JQuery удаляет выделенный текст во втором поле

Question

Я использую erichynds's jquery MultiSelect Plugin для замены на 2-уровневый прикованный-select-box, однако он отлично работает, но есть небольшой недостаток, который нужно исправить.

Пожалуйста, найдите рабочий пример here.

Например, я выбрал опцию «2» на первом поле, второе поле также заполнило optgroup для «2», затем я выбрал «2B», а текст - во втором поле. ОК, теперь я отменил выбор «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); 
    }); 
} 

Пожалуйста, сообщите, спасибо.

Answer 1

Вы можете проверить длину отмеченных элементов в первом поле, а затем сделать соответственно. Пожалуйста, обратитесь следующий сценарий:

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/

Answer 2

Попробуйте мой вариант

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'); 


} 

Я устанавливаю "filterSubActivity" каждый раз, когда filterActivity изменяется

Вот рабочий пример http://jsfiddle.net/hsQjh/17/

Я надеюсь, что это поможет.