Tengo un problema al insertar un botón modal dentro de mi tabla html. Estoy usando AJAX y agrego una función incorporada. Intenté este enfoque

"Modo abierto"

pero no funcionó. Traté de eliminar las propiedades del botón como 'clase', 'tipo', etc. y funcionó, pero las necesito. Cualquier enfoque para esto. Gracias.

este es mi codigo

 <script type=text/javascript> $(document).ready(function() { }); function getData(id){ $('#myModal').modal('show'); $.ajax({ type: "GET", url: "getproducts/", dataType: 'json', data: {id: id}, success: function (response) { var len = 0; if(response['data'] !=null){ len = response['data'].length; } $('#userTable tbody').empty(); if(len > 0){ for(i = 0; i < len; i++) { var p_id = response['data'][i].p_id; var p_name = response['data'][i].p_name; var p_amount = response['data'][i].p_amount; var m_fname = response['data'][i].m_fname; var tr_str = "<tr>" + "<td>" + p_id + "</td>"+ "<td>" + p_name + "</td>" + // HOW CAN I ADD MODAL BUTTON HERE THIS APPROACH DOESN'T WORKED "<td> <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#myModal2">Open modal</button></td>" "<tr>"; $('#userTable tbody').append(tr_str); } } } }); }; </script>

La salida esperada debería ser así