0

すべての名前の左側にチェックボックスがある人々のリストがある単純なASPページを作成しています。入力に基づいてテーブルの行を非表示および表示できる単純な jQuery スクリプトを作成できました: http://jsfiddle.net/Tq97v/ (最初の部分)

ご覧のとおり、名前の一部を入力すると、特定の行が非表示になります。赤い「x」を使用して、すべてのチェックボックスをオフにできます。

私が今やろうとしているのは、その静的な赤い「x」をトライステートチェックボックスに変更することです。どうやって始めたらいいのかわからない。

リスト内のすべてのチェックボックスに変更リスナーを追加する必要がありますか?

2 つ目は、サイトで同じ「プラグイン」の複数のインスタンスを作成する方法です。今はそれで入力を識別していますが、その入力をparamとして関数を呼び出すといいでしょう。その入力の後にテーブルを細かくして、必要なロジックを作成します。このようにして、ページ上で関数を複数回呼び出して、複数のリストを作成できました。

私は完全な解決策を求めているわけではありません (もちろん、いつでも大歓迎です :) ) しかし、必要なのは、リストに 500 以上の要素がある場合があるため、効率的な方法でこれを達成し、可能な限り最適化する方法を考えることです。

PS は HTML コードを見ないでください。それは ASP によって生成されたものです。

このプラグインを見つけました: https://github.com/bcollins/jquery.tristateですが、リストでそれを使用する方法がわかりません。

アップデート：

コードを関数に変換することはできましたが、今はリストごとに 3 つの関数を呼び出さなければなりません。
これが私の更新されたコードです: http://jsfiddle.net/65MEV/4/
どうすれば1つの関数に変更できますか? それは良くなるでしょうか？
これは私の更新されたコードです。私の削除イメージの代わりに、不確定チェックボックスを実行する方法をまだ考えています。

UPDATE2

私は動作するコードをビルドします:)
http://jsfiddle.net/65MEV/9/
しかし、できるだけ改善したいと思います。
どんな提案も大歓迎です！

4

2 に答える 2

0

トライステート チェックボックスは、Three-Portal Device のようなものです: 錯覚です。

実際に必要なのは、indeterminate(同じ名前のプロパティを に設定してtrue) チェックボックスを作成することです。これを実装するには、各チェックボックスにchange(またはclick) ハンドラーが必要です。次に、それらすべてが同じ状態にあるかどうかを確認し、そうでない場合はindeterminateプロパティを設定する必要があります。チェックボックスが表示されることはめったになくindeterminate、ほとんどのユーザーはチェックボックスをどうすればよいかわかりません。できれば避けるべき。

于 2012-07-23T13:58:30.940 に答える
0

同じプラグイン アクセス要素の複数のインスタンスを他の要素に対して相対的に作成するには。

例：あなたの場合、アイテムをjQueryオブジェクトに保持する代わりにvar $tableRows = $('table.myList tr');、イベントでそれらにアクセスします。

$('#user_name').keyup(function () {
    var sValue = $.trim($('input#user_name').val());
    if(lastInput==sValue) return;
    var $tableRows = $(this).next().next().find("table.myList tr");
    if (sValue == '') {
        $tableRows.show();
    } else {
        $tableRows.each(function () {
            var oLabel = $(this).find('label');
            if (oLabel.length > 0) {
                if (oLabel.text().toLowerCase().indexOf(sValue.toLowerCase()) >= 0) {
                    $(this).show();
                } else {
                    $(this).hide();
                }
            }
        });
        lastInput=sValue;
    }
});

実際のリストしかありません。

また、ツリー状態のチェックボックスについては、ボタンやリンクを追加するだけでプラグインは必要ありません。クリックするたびにステータスを確認すると、 jQuery データによってステータスを維持し、このデータに従って要素の画像を変更できます。

于 2012-07-23T14:15:19.533 に答える