3

jQuery UIオートコンプリートを使用しており、複数の結果を制限しようとしています。基本的に、toフィールドにオートコンプリートを使用しているPMシステムを構築しています。しかし、私は1つのメッセージを送信できる人の数を制限しようとしています。したがって、最大選択数を25に制限します。

これを制限する方法はありますか？また、それらが最大に達したという視覚的指標に関するアイデアはありますか？

 select: function( event, ui){
    var terms = split( this.value );
    if(terms.length <= 2)
    {
        // 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;
    }
    else
    {
        $(this).effect("highlight", {}, 1000);
        $(this).addClass("red");
        $("#warnings").html("<span style='color:red;'>Max people reached</span>");
        return false;
    }
}
4

1 に答える 1

4

これは、イベントを聞くことで簡単に実現できます。たとえば、クラスを追加し、オートコンプリートするクラスを削除することで、色を赤にすることができます。少しの努力でこれを自分で達成できると思います。

select: function( event, ui ) {
    var terms = split( this.value );
    if(terms.length <= 2) { 
        // 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;
    } else {
        var last = terms.pop();
        $(this).val(this.value.substr(0, this.value.length - last.length - 2)); // removes text from input
        $(this).effect("highlight", {}, 1000);
        $(this).addClass("red");
        $("#warnings").html("<span style='color:red;'>Max people reached</span>");
        return false;
    }
}

PS私はまた、これらのプラグインの1つがグーグルのおかげで適切である可能性があると思います：

  1. https://github.com/loopj/jQuery-Tokenizing-Autocomplete-Plugin

    私の意見ではよさそうだ：

    オートコンプリートプラグインのトークン化のデモ

    リンクをクリックしてライブデモを表示します。

  2. http://net.tutsplus.com/tutorials/javascript-ajax/how-to-use-the-jquery-ui-autocomplete-widget/

  3. FacebookスタイルのJQueryオートコンプリートプラグイン
于 2011-01-27T00:39:27.747 に答える