javascript - 複数の値と複数のラベルを使用した Jquery UI オートコンプリート

Question

1つは非表示、もう1つはテキスト入力の2つのフィールドがあります。JSON形式（値とラベル）で情報を提供するリモートPHPファイルから情報を受け取っています。

私がやろうとしているのは、選択したラベルをテキストフィールドに表示することです。これはコンマで区切られていますが、同時に、分割されたラベルの値が非表示の入力 (コンマで区切られている) 内にあるようにする必要があります。これは次のとおりです。隠し値入力のコードが欠けているテキストフィールドのこれまでの私のコード

<script type="text/javascript">
    function split( val ) {
    return val.split( /,\s*/ );
    }
    function extractLast( term ) {
    return split( term ).pop();
    }
    $( "#category_pictures_labels" )
    // don't navigate away from the field on tab when selecting an item
    .bind( "keydown", function( event ) {
    if ( event.keyCode === $.ui.keyCode.TAB &&
    $( this ).data( "ui-autocomplete" ).menu.active ) {
    event.preventDefault();
    }
    })
    .autocomplete({
    source: function( request, response ) {
    $.getJSON( "/admin/pictures_autocomplete", {
    term: extractLast( request.term )
    }, response );
    },
    search: function() {
    // custom minLength
    var term = extractLast( this.value );
    if ( term.length < 1 ) {
    return false;
    }
    },
    focus: function() {
    // prevent value inserted on focus
    return false;
    },
    select: function( event, ui ) {
    var terms = split( this.value );
    // remove the current input
    terms.pop();
    // add the selected item
    terms.push( ui.item.value );
    // add placeholder to get the comma-and-space at the end
    terms.push( "" );
    this.value = terms.join( ", " );
    return false;
    }
    });
</script>

<input type="text" name="category_pictures_labels" value="" id="category_pictures_labels" />
<input type="text" name="category_pictures" value="" id="category_pictures" />