2015-06-10 4 views
0

я получаю массив какПроверить несколько флажков с помощью JQuery с двумерным массивом

var favorite = {}; 
    $.each($(".list input[type='checkbox']:checked"), function(){ 
     if(typeof(favorite[$(this).attr("name")]) == 'undefined'){ 
      favorite[$(this).attr("name")] = []; 
     }   
     favorite[$(this).attr("name")].push($(this).val()); 
    }); 

С одномерный массив я могу сделать:

$('#list [value="'+favorite.join('"],[value="')+'"]').prop('checked',true); 

Который производит селектор, как:

$('#list [value="1"],[value="3"],[value="4"],[value="5"]') 

Но как создать селектор из двухмерного массива вроде:

$('#list [Name="Name[]",value="1"],[Name="Name[]",value="3"],[Name="Name[]",value="4"],[Name="Model[]",value="5"]') 

Мне нужно выбрать все флажки, которые находятся в избранном массиве. Потому что после того, как АЯКС сообщения я потерять все проверило Флажки что-то вроде этого:

$(function() { 
    $('.list input').change(function(e){ 
      //e.preventDefault(); 
      var favorite = {}; 
       $.each($(".list input[type='checkbox']:checked"), function(){ 
        if(typeof(favorite[$(this).attr("name")]) == 'undefined'){ 
         favorite[$(this).attr("name")] = []; 
        }   
        favorite[$(this).attr("name")].push($(this).val()); 
       }); 


     var str; 
     str = $.param(favorite); 

     $.ajax({ 
      url:'/Search.asp', 
      type:'POST', 
      data:str, 
      dataType:'text', 
      success: function(data) 
      { 
       $("#ExSearchForm").html(data); 
       $("#ExSearchForm").find('[value=' + favorite.join('], [value=') + ']').prop("checked", true); 
      } 
     }); 


    }); 
}); 

кода HTML разметка

   <div class="list"> 
        <div class="nomination">Make</div> 
        <div class="name"> 
        <label class='selected-car'><input type='checkbox' name='Make[]' value='*FAKE*' /><span>*FAKE*<i>0</i></span></label> 
<label class='selected-car'><input type='checkbox' name='Make[]' value='AIXAM' /><span>AIXAM<i>2</i></span></label> 
<label class='selected-car'><input type='checkbox' name='Make[]' value='ALFA ROMEO' /><span>ALFA ROMEO<i>106</i></span></label> 
<label class='selected-car'><input type='checkbox' name='Make[]' value='ALPINA' /><span>ALPINA<i>1</i></span></label> 
<label class='selected-car'><input type='checkbox' name='Make[]' value='AUDI' /><span>AUDI<i>686</i></span></label> 
<label class='selected-car'><input type='checkbox' name='Make[]' value='BMW' /><span>BMW<i>557</i></span></label> 
.... 
+0

Я не думаю, что последний селектор действителен. Это не работает – AmmarCSE

+2

Я уверен, что это * много * сложнее, чем нужно. Можете ли вы описать, что вы пытаетесь достичь, чтобы мы могли показать вам более эффективный способ. –

+0

$ (". List input [type = 'checkbox']: checked") уже возвращает ваш отмеченный вход как объект jquery, , сохраняя его в var и используем позже $ ("# ExSearchForm"). Find (myvar). prop ("checked", true); должен делать трюк – VeNoMiS

ответ

2

Вы должны создать массив значений на основе favorite объекта:

$('.list input[type=checkbox]').on('change', function() { 
    var favorite = {}; 

    $('.list input[type=checkbox]:checked').each(function() { 
     var $el = $(this); 
     var name = $el.attr('name'); 
     if (typeof (favorite[name]) === 'undefined') { 
      favorite[name] = []; 
     } 
     favorite[name].push($el.val()); 
    }); 

    $.ajax({ 
     url: '/Search.asp', 
     type: 'POST', 
     data: $.param(favorite), 
     dataType: 'text', 
     success: function (data) { 
      $("#ExSearchForm").html(data) 
       .find('input[type=checkbox]').each(function() { 
        var $el = $(this); 
        var name = $el.attr('name'); 
        var value = $el.attr('value') 
        if (favorite[name] && favorite[name].indexOf(value) !== -1) { 
         $el.prop('checked', true); 
        } 
       }); 
     } 
    }); 
}); 

Notice: Но такого рода селекторы являются очень сложными и могли быть очень медленным.

+0

Этот селектор похож на ваш (он может быть медленным, если есть тысячи флажков). –

+0

Но сниппет будет немного быстрее в геренале, чем ваш. Поскольку он кэширует ссылки на элементы флажка внутри цикла 'each' и формирует ссылку внутри обратного вызова' success'. –

+0

Этот пример должен быть довольно быстрым. Просто попробуйте. –

0

Я предложил бы использовать массив объектов, а не то вы можете легко перебор, которая могла бы также массив быть значительно быстрее.

Что-то вроде этого

$(function() { 
 
    $('.list input').change(function(e){ 
 
      //e.preventDefault(); 
 
      var favorite = {}; 
 
       $.each($(".list input[type='checkbox']:checked"), function(){ 
 
        if(typeof(favorite[$(this).attr("name")]) == 'undefined'){ 
 
         var item = { 
 
          value: 1, 
 
          name : favorite[$(this).attr("name") 
 
         } 
 
        } else { 
 
         var item = { 
 
          value: 0, 
 
          name : favorite[$(this).attr("name") 
 
         } 
 
        } 
 
              
 
        favorite[$(this).attr("name")].push(item); 
 
           
 
        
 
       }); 
 

 
    }); 
 
});

+1

Пожалуйста, приведи пример –

+0

Я отредактировал мой ответ с примером –

+1

Вы не можете использовать массив объектов, потому что 'любимый' должен быть сериализован позже с помощью' $ .param' и передан как параметр для $ .ajax' –

Смежные вопросы