JQuery Datatables添加新行

我创建了一个注册页面，其中有人可以注册多达20个其他人，如果他们想。所以，我有这些文本框：JQuery Datatables添加新行

First Name: <br/><input type="text" name="fname" id="fname" /> <br/> 
Last Name: <br/><input type="text" name="lname" id="lname" /> <br/> 
Email: <br/><input type="text" name="email" id="email"/> <br/>

这是我的HTML表格与数据表的我的JQuery intialization：

<div id="tables"> 
    <table id="table" border="1"> 
     <thead> 
      <tr> 
       <th>First Name</th> 
       <th>Last Name</th> 
       <th>Email</th> 
      </tr> 
     </thead> 
    </table> 
</div> 

$('#reg_more').dataTable({ 
    "bLengthChange": false, 
    "bInfo": false 
});

现在我想提出一个附加按钮，以便用户可以输入第一和姓氏和电子邮件，然后点击添加，它会被放入表格中。我如何去做这件事？

来源

2012-09-16 Richard

谷歌搜索您的具体问题的意愿。快速告诉你。https://www.google.com/search?q=JQuery+Datatables+Add+new+Row&rlz=1C1CHFX_enUS480US480&aq=f&sugexp=chrome,mod=8&sourceid=chrome&ie=UTF-8 –

@StephenSarcsamKamenar呀，这正是我在发布之前就已经做过了，但我无法回应这些问题，甚至尝试了一些解决方案，但都没有成功，这就是我来到这里的原因，所以有人可以解释我能理解的解决方案。选项 – Richard

http://datatables.net/examples/api/add_row.html不起作用？你有什么麻烦？ –

$(document).ready(function() { 
    $('#example').dataTable(); 
    $('#addbtn').click(addrow); 
}); 

function addrow() { 
    $('#example').dataTable().fnAddData([ 
     $('#fname').val(), 
     $('#lname').val(), 
     $('#email').val() ]); 

}

您需要在按钮单击中调用addrow（）。

在HTML代码中

<input type="button" value="add" id="addbtn" />

来源

2012-09-16 03:56:30 Sutha

ahh好多了，我是jquery和datatables的全新品牌，所以我很难做这种事情。但是这更有意义。所以我可以做同样的事情进行编辑和删除。还有1件事，我如何正确发布所有这些数据，以便我可以将它添加到MySQL数据库？假设他们注册自己和20个其他人，我需要添加21个条目到我的mysql数据库。要注册 – Richard

，可以使用jQuery ajax将数据插入到数据库中。 – Sutha

下面是这个现在在数据表1.10

<input type="button" value="add" id="addbtn" /> 

var dTable = $('#example').DataTable(); 
$('#addbtn').on('click', function() { 
    dTable.row.add([ 
     $('#fname').val(), 
     $('#lname').val(), 
     $('#email').val() 
    ]).draw(); 
});

来源

2014-05-05 15:43:28 Shoe

完成这也可能是有用的，但并不总是在时间的方式添加该按钮。我自己调试过，即使你有更多的数据，也不会花费太多时间。

var table = $(".tableclassName")["1"] 
var tableClone = $(".tableclassName")["3"] 
$(yournewrowtext).insertAfter(table.children["1"].children[currentRowId]); 
$(yourfirstcolumn).insertAfter(tableClone.children["1"]. 
children[currentRowId]);

注意：如果你不使用固定的列，那么你可以删除此行 $（yourfirstcolumn）.insertAfter（tableClone.children [ “1”]

来源

2017-05-24 10:05:04 Eliotjse

JQuery Datatables添加新行

回答

相关问题