0

アオトコンプリートで名前(カウント)を自動候補として表示したいのですが、項目を選択すると入力ボックスに名前だけが出力されます。私のデータ形式はこんな感じです

[{"name":"Test","count":"5"},{"name":"Javascript","count":"1"}]

複数選択されたアイテムが印刷された状態で、カウントなしで名前を表示できるコード:

jQuery(document).ready(function ($){

    function split( val ) {
        return val.split( /,\s*/ );
    }
    function extractLast( term ) {
        return split( term ).pop();
    }

    $("#ctags-input")
        .bind( "keydown", function( event ) {
            if ( event.keyCode === $.ui.keyCode.TAB &&
                    $( this ).data( "autocomplete" ).menu.active ) {
                event.preventDefault();
            }
        })
    .autocomplete({ 

        source: function(req, add){
            var ctags_action = 'ctags_autosuggest';

            $.getJSON(CTags.url+'?callback=?&action='+ctags_action, req, function(data) {   

                var suggestions = [];

                $.each(data, function(i, val){                              
                    suggestions.push(val.name);
                });
                add(suggestions);
            });
        },
        focus: function() { 
            return false;
        },

        select: function( event, ui ) {
            var terms = split( this.value );
            terms.pop();
            terms.push( ui.item.value );
            terms.push( "" );
            this.value = terms.join( ", " );
            return false;
        }
    });

});

試してみsuggestions.push(val)ました;うまくいきません。私も試し ましたsuggestions.push(val.name + "C" + count + ")" );これは名前（カウント）を表示できますが、選択すると（カウント）も選択されます。表示名(カウント)を候補として表示し、名前のみを入力するにはどうすればよいですか?

4

1 に答える 1

0

カスタム データと表示デモを確認してください。この例を複数の値のコードと組み合わせて、アイテムのラベルと共にカウントを表示できます。

$("#ctags-input")
    .bind( "keydown", function (event) {
        /* snip */
    })
.autocomplete({ 
    source: function(req, add){
        var ctags_action = 'ctags_autosuggest';

        $.getJSON(CTags.url+'?callback=?&action='+ctags_action, req, function(data) {   
            var suggestions = [];

            $.each (data, function(i, val) {      
                suggestions.push({
                    label: val.name,
                    count: val.count
                });
            });

            add(suggestions);
        });
    },
    /* snip */
}).data("autocomplete")._renderItem = function(ul, item) {
    return $("<li></li>")
        .data("item.autocomplete", item)
        .append("<a>" + item.label + " (" + item.count+ ")</a>")
        .appendTo(ul);
};

例: http://jsfiddle.net/NwRR6/ (リモート部分を除く)。

于 2012-07-12T00:38:26.057 に答える