DataTable - Ajax 来源数据答案

【问题标题】：DataTable - Ajax sourced dataDataTable - Ajax 来源数据
【发布时间】：2015-10-06 14:35:33
【问题描述】：

我有一张桌子并用 ajax 填充它

TABLE

<table id="tabla_productos"> </table>

Ajax 来源数据

var tabla_productos = $('#tabla_productos').DataTable( {
"responsive" : "true",
"ajax": {
    "url": "/funciones/getProductos.php",
    "dataSrc": ""
},
"columns": [
    { "data": "id" },
    { "data": "add_cart" }
]
}});

AJAX 数据

{"id":"2",
 "add_cart":"<form class=\"form-item\"><input type=\"hidden\" value=\"1\" name=\"product_qty\"><input type=\"hidden\" value=\"S10881\" name=\"product_code\"><button class=\"btn\" type=\"submit\">Add to Cart<\/button><\/form>" }

jQuery 表单提交：

$(".form-item").submit(function(e){
    alert('ok');        
    e.preventDefault();
});

HTML 输出：从 ajax 创建的表单

<form class="form-item"><input type="hidden" name="product_qty" value="1"><input type="hidden" name="product_code" value="S10881"><button type="submit" class="btn">Add to Cart</button></form>

从 HTML 创建的相同表单：

<form class="form-item"><input type="hidden" name="product_qty" value="1"><input type="hidden" name="product_code" value="S10881"><button type="submit" class="btn">Add to Cart</button></form>

当我提交从 html 创建的表单时，它可以正常工作。
如果我提交从 ajax 创建的表单，它不起作用。
如果我等待该表填满数据，它会起作用：

setTimeout(函数(){ $(".form-item").submit(function(e){ 警报('ok');
e.preventDefault(); }); }, 10000);

【问题讨论】：

你的问题是什么？
为什么当我点击提交按钮时它没有提交表单？我想通过单击按钮提交表单

标签： ajax forms datatable submit

【解决方案1】：

我在数据表中添加了带有表单提交功能的“initComplete”

    var tabla_productos = $('#tabla_productos').DataTable( {
"responsive" : "true",
"ajax": {
    "url": "/funciones/getProductos.php",
    "dataSrc": ""
},
"columns": [
    { "data": "id" },
    { "data": "add_cart" }
],
"initComplete": function(settings, json) {
  $(".form-item").submit(function(e){
   alert('ok');        
   e.preventDefault();
  });
}
        }});

【讨论】：