Quiero hacer un menú desplegable en mi tabla que se completa con los datos dinámicos que provienen de la respuesta ajax y se agregan a la tabla. Mi colección de cartero se ve así.
{ "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 } }Y debajo está mi código de respuesta ajax en el que agrego los datos a la tabla.
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); }El nombre de itme.children, la edad, quiero hacer un menú desplegable en la tabla para que se vea bien.
Si te refieres a un menú desplegable como un menú de selección, esto debería hacer el trabajo
trHTML += `... <td> <select> <option selected disabled>Click me</option>` + item.children.map(({name + age}) => `<option>Name: ${name}, Age: ${age}</option>`).join('') + `</select></td>`;