2

собственно вот код html

<div id="sheet" class="inner" style="display: block;">
    <div>
       <input id="size1" type="text">
    </div>
    <div>
         <input id="size2" type="text">
    </div>
</div>

javascript

$('body .frontend-setup-form #secure').click(function (e) {
    e.preventDefault();
    var json;
    var shirts = [];
    var shirt = [];
    $('body .frontend-setup-form #sheet input').each(function () {
        if($(this).val()!='') {
            shirt['name'] = $(this).attr('id');
            shirt['value'] = $(this).val();
            shirts.push(shirt);
        }
    });
   json={shirts:shirts}
   console.log(JSON.stringify(json));

получаю

{"shirts":[[]]}

хотелось бы

{
    "name":"patern",
    "shirt": [
        {
            "name": "size1",
            "value": "размер1"
        }, 
        {
            "name": "size2",
            "value": "размер2"
        }

    ]
}  
6
  • Приведите минимальный, самодостаточный и воспроизводимый пример, потому что с этим оторванным от контекста куском кода мы ничего сделать не можем (ан нет, Grundy смог :)
    – andreymal
    3 фев 2017 в 7:53
  • @andreymal вам html нужен ? или что не понятно ?
    – Sergalas
    3 фев 2017 в 7:57
  • Довольно очевидно, что код завязан на html, поэтому без него, разумеется, никак
    – andreymal
    3 фев 2017 в 7:58
  • #secure там нету айди
    – L. Vadim
    3 фев 2017 в 8:09
  • @L.Vadim вам всю страницу выложить в том числе и ссылку на которую клик делаю ?
    – Sergalas
    3 фев 2017 в 8:14

1 ответ 1

5

Ошибка в типе переменной shirt.

В данном случае это массив. При сериализации массива с помощью JSON.stringify на выходе будет массив с количеством элементов соответствующих length.

Свойство length - это число, большее максимального индекса.

В данном случае, максимальный индекс в массиве 0, так как элементы в него не добавлялись.

Поэтому на выходе имеется пустой массив.

Для решения нужно заменить массив ([]), на объект ({})

var shirt = {};

А также необходимо внести определение переменной shirt внутрь цикла.


Чтобы не возникало проблемы со сторонними переменными, вместо each нужно использовать map, filter и get(для получения результата)

var shirts = $('input')
  .filter(function() {
    return this.value != ''
  })
  .map(function() {
    return {
      name: $(this).attr('id'),
      value: $(this).val()
    }
  })
  .get();
console.log(JSON.stringify(shirts));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="sheet" class="inner" style="display: block;">
  <div>
    <input id="size1" type="text" value='123'>
  </div>
  <div>
    <input id="size2" type="text">
  </div>
</div>

6
  • пробовал делать и через объект следующим образом $('body .frontend-setup-form #secure').click(function (e) { e.preventDefault(); var json; var shirts = []; var shirt = []; $('body .frontend-setup-form #sheet input').each(function () { if($(this).val()!='') { shirt['name'] = $(this).attr('id'); shirt['value'] = $(this).val(); shirts+={name:shirt['name'],value:shirt['value']} } }); json={shirts:shirts} console.log(JSON.stringify(json)); ни чего не получилось тоже
    – Sergalas
    3 фев 2017 в 7:58
  • @Sergalas, откуда у тебя этот код? что за странное использование массива с оператором +=? где ты увидел, что я говорил, что надо менять именно эту часть? Посмотри внимательно в моей ответе, что именно я сказан нужно заменить и на что? В коде в комментарии - ты сделал непонятно что, и непонятно как это относится к моему ответу, кроме одного слова объект?
    – Grundy
    3 фев 2017 в 8:06
  • @Sergalas, я выделил место, в котором описано решение.
    – Grundy
    3 фев 2017 в 8:07
  • хорошо исправил на if($(this).val()!='') { shirt={'name':$(this).attr('id')}; shirt={'value':$(this).val()}; shirts.push(shirt); } а почему name не получил?
    – Sergalas
    3 фев 2017 в 8:11
  • @Sergalas, ответ очевиден: просто подумай что делает твой код. Дай угадаю, раньше ты использовал php?
    – Grundy
    3 фев 2017 в 8:14

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.