Блог

Главная - Вопросы по программированию - jQuery создает объект с выбранным атрибутом и значением

jQuery создает объект с выбранным атрибутом и значением

#jquery #arrays #sorting

Вопрос:

У меня есть другой вариант выбора для страны, города, почтового индекса. Теперь мое требование состоит в том, чтобы, когда кто-то изменяет значения из выпадающего списка, он должен создать объект массива с выбранными значениями. Поэтому, чтобы достичь этого, я сделал что-то вроде этого

 var SearchParams = [];

jQuery('.form-type-select').each(function() {
    let Attribute = jQuery(this).attr('data-attribute-name');
    
    $(this).find("input[type='checkbox']:checked").each(function(i, e){
    obj = {};
        var self = jQuery(this).val();
        if( Attribute == 'country' ) {
            obj[Attribute] = self;
        }

        if( Attribute == 'city' ) {
            obj[Attribute] = self;
        }
        SearchParams.push(obj);
    });
});

console.log(SearchParams);

Он показывает вывод примерно так

 [
    {country: 'France'}
    {country: 'UK'}
    {country: 'Spain'}
    {city : 'Toulouse'}
    {city : 'Lyon'}
    {city : 'Yorkshire'}
]

Но я хочу, чтобы результат выглядел так

 [
    {country: 'France', 'UK', 'Spain'}
    {city : 'Toulouse', 'Lyon', 'Yorkshire'}
]

Так может ли кто-нибудь сказать мне, как этого добиться? Любая помощь и предложения были бы действительно заметны.

Ответ №1:

Вы создаете новый объект JSON на каждой итерации, т. Е.: obj = {}; . Вместо этого вы можете просто создать ключ SearchParams["country"] , а затем вставить значение внутри этого ключа .

Демонстрационный код :

 var SearchParams = {}; //create obj
SearchParams["country"] = new Array() //create keys..
SearchParams["city"] = new Array()
jQuery('.form-type-select').each(function() {
  let Attribute = jQuery(this).attr('data-attribute-name');
  $(this).find("input[type='checkbox']:checked").each(function(i, e) {
    var self = jQuery(this).val();
    if (Attribute == 'country') {
      SearchParams["country"].push(self); //push inside key...
    }
    if (Attribute == 'city') {
      SearchParams["city"].push(self);
    }
  });
});

console.log(SearchParams); 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<div class="form-type-select" data-attribute-name="country"><input type="checkbox" value="1" checked></div>
<div class="form-type-select" data-attribute-name="city"><input type="checkbox" value="2" checked></div>
<div class="form-type-select" data-attribute-name="country"><input type="checkbox" value="7" checked></div>
<div class="form-type-select" data-attribute-name="city"><input type="checkbox" value="45" checked></div>
Метки: