0

erichynds の jquery MultiSelect Pluginを使用して 2 レベルの chained-select-box に変更しましたが、完全に機能しますが、これまでに修正しなければならない小さな欠陥があります。

ここで実際の例を探してください。

たとえば、最初のボックスでオプション「2」を選択すると、2 番目のボックスでも「2」の optgroup が入力され、次に「2B」を選択すると、テキストは 2 番目のボックスに表示されます。最初のボックスで '2' の選択を解除しました。'2' の optgroup はなくなりましたが、テキストはまだ 2 番目のボックスに表示されています。最初のボックスで関連するオプションの選択を解除したときに、テキストと共に削除するにはどうすればよいですか

function filterActivityTrigger(e){
     var ids = $('#filterActivity + div input:checked').map(function(i) {
        return $(this).val().replace(/ .*/, '');
     }).get(); // Retrieve checked IDs

     $('#filterSubActivity + div div label').each(function() { // Show matching options
        $(this).toggle($.inArray($('input', this).val().replace(/(\d+).*/, '$1'), ids) > -1);
     });

     $('#filterSubActivity + div label.optGroup').each(function() { // Show matching groups
        $(this).toggle($(this).next().find('label:visible').length > 0);
     });
}

アドバイスしてください、ありがとう。

4

2 に答える 2

0

最初のボックスでチェックされた要素の長さを確認し、それに応じて行うことができます。次のスクリプトを参照してください。

function filterActivityTriggeredUser(e){
   var ids = $('#filterActivity + div input:checked').map(function(i) {
        return $(this).val().replace(/ .*/, '');
    }).get(); // Retrieve checked IDs
    var len = ids.length;

    $('#filterSubActivity + div div label').each(function() { // Show matching options
        $(this).toggle($.inArray($('input', this).val().replace(/(\d+).*/, '$1'), ids) > -1);
      if(len == 0)
            $('#filterSubActivity span').text('All');
             $(this).removeAttr('checked');
    });

    $('#filterSubActivity + div label.optGroup').each(function() { // Show matching groups
        $(this).toggle($(this).next().find('label:visible').length > 0);
    });
}

function filterSubActivityTriggeredUser(e){ 
    if($(e).attr('checked')=='checked') {

    }
}

$(document).ready(function() {

    $("#filterActivity").multiSelect({
        selectAll: false,
        noneSelected: 'All',
        oneOrMoreSelected: '*'
    },
    filterActivityTriggeredUser);

    $("#filterSubActivity").multiSelect({
        selectAll: false,
        noneSelected: 'All',
        noneSelectedText : 'All',
        oneOrMoreSelected: '*'
    },
    filterSubActivityTriggeredUser);

});

これが実際の例です: http://jsfiddle.net/G2kXg/1/

于 2013-03-28T06:09:49.940 に答える
0

私のバージョンを試す

function filterActivityTriggeredUser(e){
    var ids = $('#filterActivity + div input:checked').map(function(i) {
        return $(this).val().replace(/ .*/, '');
    }).get(); // Retrieve checked IDs
    $('#filterSubActivity + div div label').each(function() { // Show matching options
        $(this).toggle($.inArray($('input', this).val().replace(/(\d+).*/, '$1'), ids) > -1);
    });
    $('#filterSubActivity + div label.optGroup').each(function() { // Show matching groups
        $(this).toggle($(this).next().find('label:visible').length > 0);
    });

    var ids1 = [];
        $('#filterSubActivity + div div label:visible').each(function(i) {
             if($(this).find('input:checked').length>0)
                ids1.push($(this).text());
    });


    $('#filterSubActivity span').text(ids1.join(" ,"));  
    if(ids1.length==0)
        $('#filterSubActivity span').text('All');


}

filterActivity が変更されるたびに「filterSubActivity」を設定しています

ここに実例がありますhttp://jsfiddle.net/hsQjh/17/

それが役立つことを願っています。

于 2013-03-28T23:27:30.517 に答える