Mam tę tablicę obiektów jQuery

(2) [{…}, {…}]
0:{Name: "name", NRIC/Passport: "nric", Date of Birth: "2018-06-02", Occupation: "occ", Weight: "123", …}
1:{Name: "name2", NRIC/Passport: "nric2", Date of Birth: "2018-06-02", Occupation: "occ2", Weight: "234", …}
length:2
__proto__:Array(0)

Chcę umieścić je w elementy formularzy HTML. Obecnie tak to robię:

$.each(spouses,function(key,value){
       $.each(value,function(int_key,int_value){
       $("#spouse_data").append("<div class='col-sm-4'><label>"+int_key+"</label><input type='text' readonly class='form-control' name='spouse' value="+int_value+"></div>");
    });
});

Nie będę jednak w stanie ustawić nazwy dla każdego elementów formularzy, dzięki czemu mogę otrzymać dane, gdy złożę formę. Jest inna opcja, w której zamiast używać tego formatu obiektu

"Name of obj":data

Używam

name_of_obj:data

Problem z drugim jest to, że nie mogę wstawić nazw etykiet. Zastanawiałem się, jaki jest najlepszy sposób na to.

0
JianYA 2 czerwiec 2018, 10:32

3 odpowiedzi

Najlepsza odpowiedź

Zmień swoje obiekty do tablicy obiektów, patrząc nieco w ten sposób:

[{ value: 'name', label: 'Name', name: 'name' }, { value: 'nric', label: 'NRIC/Passport', name: 'nric_password' }]

Następnie iteruj go za pomocą Array.prototype.forEach:

[{
  value: 'name',
  label: 'Name',
  name: 'name_for_form_submission'
}, {
  value: 'nric',
  label: 'NRIC/Passport',
  name: 'nric_password'
}].forEach((item) => {
  console.log(`${item.label}: ${item.value}, form name: ${item.name}`)
})
0
connexo 2 czerwiec 2018, 07:53

A co z użyciem następujących elementów formularzy:

name="spouse[' + index + ']"

Czy ma sens, aby użyć typu pola tablicy zamiast ciąg?

0
MyStream 2 czerwiec 2018, 07:39

Sprawdź ten kod, możesz to zrobić

https://codepen.io/createvedev/pen/pkjamd.

var obj = {
        0: {Name: "name", "NRIC/Passport": "nric", "Date of Birth": "2018-06-02", Occupation: "occ", Weight: "123"},
        1: {Name: "name2", "NRIC/Passport": "nric2", "Date of Birth": "2018-06-02", Occupation: "occ2", Weight: "234"}
        };
$.each(obj,function(key,value){
    $.each(value,function(key1,value1){
    $("#data").append("<div class='col-sm-4'><label>"+key1+"</label><input type='text' readonly class='form-control' name='spouse' value="+value1+"></div>");
    });
     $("#data").append("<br/><br/>");
});
0
Bhumi Shah 2 czerwiec 2018, 07:56