如何将从 ajax 响应接收的数据下拉列表作为 objects 的数组

Question

我想在我的 table 中创建一个下拉列表，其中填充了来自 ajax 响应的动态数据并附加到 table。我的邮递员 collection 看起来像这样。

{
    "createdDate": "2022-04-06T11:42:37.360Z",
    "enabled": true,
    "_id": "62502b868daa3b1cdbdc98e8",
    "CNIC": "40740c7d9f3a11d93e76af7f2f60887a",
    "employeeID": "LE44337",
    "fName": "HUSNAIN",
    "company": "6249fdf91399dc7a14173dcd",
    "fatherName": "husnain",
    "motherName": "momutaz",
    "spouse": "no spouse",
    "children": [{
        "_id": "62502b868daa3b1cdbdc98e9",
        "name": "hunsian",
        "age": 23232
    }, {
        "_id": "62502b868daa3b1cdbdc98ea",
        "name": "hunsian",
        "age": 12121
    }, {
        "_id": "62502b868daa3b1cdbdc98eb",
        "name": "momin",
        "age": 2323
    }
}

下面是我的 ajax 响应代码，我在其中将数据附加到 table。

success : function(response){
                        
    var trHTML = '';
    $.each(response.doc, function (i, item) {
                        
        trHTML += '<tr><td>' + item.fName + '</td><td>' + item.CNIC + '</td><td>' + item.spouse + '</td><td>'+ item.fatherName + '</td><td>' + item.motherName +'</td><td>'+ item.employeeID +'</td><td>' + item.children.map(({name, age}) => `Name: ${name} Age: ${age}`).join('  ||  ') +'</td></tr>';
    });
    $('#records_table').append(trHTML);
}

itme.children 姓名、年龄我想将其下拉到 table 中，这样看起来不错。

Answer 1

如果您指的是像 select 菜单这样的下拉菜单，这应该可以做到

trHTML += `... <td>
    <select>
        <option selected disabled>Click me</option>` + 
        item.children.map(({name + age}) => `<option>Name: ${name}, Age: ${age}</option>`).join('') +
    `</select></td>`;

如何将从 ajax 响应接收的数据下拉列表作为 objects 的数组

How to make a dropdown of the data receive from ajax response as array of objects

html

javascript

ajax