У меня есть сайт HTML с 4 inputRange slidern. Если пользователь нажимает кнопку, все значения из диапазонов должны быть сохранены во вложенном объекте JSON. Пока все хорошо, но JS сохраняет только последний в этом массиве, а не остальные ранее. Но все ползунки имеют разные значения от 1 до 5, но JS сохраняет только 4 из последнего ползунка. Вот мой код:

    //Speichert die aktuellen Angaben in einem Nested-JSON Objekt
function saveBewertung() {
var jsonObj = {};
var kriterien = []; 
var bewertungen = {};

 //Loop
$('input[type=range]').each(function() {


    var id = $(this).attr("id");
    var note = $(this).val();


    bewertungen.id = id;
    bewertungen.note = note;

    kriterien.push(bewertungen);
    jsonObj.Bewertungen = kriterien;

});

jsonObj.Kommentar  = $('textarea#kommentar').val();


//TEST AUSGABE
alert(JSON.stringify(jsonObj));

}

Результат:

enter image description here

1
user3541032 23 Фев 2018 в 12:06

3 ответа

Лучший ответ

Вы снова и снова помещаете один и тот же объект в массив. Вам нужно инициализировать bewertungen каждый раз в блоке each.

Declare

var bewertungen = {};

Внутри блока each

$('input[type=range]').each(function() {
    var bewertungen = {};
    var id = $(this).attr("id");
    var note = $(this).val();    

    bewertungen.id = id;
    bewertungen.note = note;

    kriterien.push(bewertungen);
});
jsonObj.Bewertungen = kriterien;  //this line can be moved out
2
gurvinder372 23 Фев 2018 в 09:09

Другая возможность рядом с решением от @ gurvinder372 - сократить функцию, чтобы вам не нужно было объявлять переменные bewertungen, id и note:

//Speichert die aktuellen Angaben in einem Nested-JSON Objekt
function saveBewertung() {
  var jsonObj = {};
  var kriterien = [];

  //Loop
  $('input[type=range]').each(function() {
    // Anonymous object
    kriterien.push({
        id: $(this).attr("id"),
      note: $(this).val()
    });
  });

  jsonObj.Bewertungen = kriterien;
  jsonObj.Kommentar = $('textarea#kommentar').val();

  //TEST AUSGABE
  alert(JSON.stringify(jsonObj));
}
0
ahendwh2 23 Фев 2018 в 09:19

Вот описание того, как эта штука работает

var bewertungen = {}; // this line declare the object this object will hold values in each loop.

$('input[type=range]').each(function() {
var bewertungen = {};
var id = $(this).attr("id");
var note = $(this).val();    

bewertungen.id = id;   // this line add value to {bewertungen} object key
bewertungen.note = note; // this line add value to {bewertungen} object key

kriterien.push(bewertungen); // every itration will push value to [kriterien] array
});
jsonObj.Bewertungen = kriterien; // this is final array with all values
0
Mustkeem K 23 Фев 2018 в 09:44