jQuery dataTables自定义按钮

Question

创建两个自定义按钮的任何方式：Edit和Delete，然后我可以使用.click()或任何其他方式捕获，并为$.post()执行Delete {1}}并重定向到http://site.com/admin/news/edit/1212 Edit？

我刚刚实现了dataTables()并且初始版本中缺少了一些东西，而这些按钮就是其中之一。

例如，这就是我之前为Delete事件所做的事情：

$('.delete_item').click(function(){
    $("input[name^='selector']:checked:enabled").each(function(index, value){
        var block = $(this).parent().parent();
        var id = $(this).parent().parent().find('.id').text();
        $.post(base_url+'admin/articles/delete/'+id,function(data) {
            if (data == true)
            {
                block.fadeOut('slow');
            }
            else
            {
                alert('there was an error, please try again');
            }
        }, 'json');
    });
});

Answer 1

您是否想要告诉每行我们有一个列有两个按钮：编辑和删除，当您点击它们时，您会执行您所描述的操作吗？

如果是，

DEMO jsFiddle

你应该这样做：

首先，使用您的按钮创建一个表单，并在表单中，您就是数据表：

例如：

HTML

<form type="post">
   <div><input id="button" type="button" value="delete" /></div>
   <div class="container">

     <table cellpadding="0" cellspacing="0" border="0" class="dataTable" id="example">
       <thead>
          <tr>
            <th>Select</th>
            <th>Rendering engine</th>
            <th>Browser</th>
            <th>Platform(s)</th>
            <th>Engine version</th>
            <th>CSS grade</th>
          </tr>
       </thead>
       <tbody>
          <tr>
            <td><span><input name="row_1" type="checkbox" value="id1" /></span></td>
            <td>Trident</td>
            <td>Internet
                   Explorer 4.0</td>
            <td>Win 95+</td>
            <td> 4</td>
            <td>X</td>
          </tr>
       </tbody>
     </table>

   </div>
</form>

的javascript

var oTable = $('#example').dataTable();
$('#button').click(function() {
  alert(JSON.stringify($('form').serialize()));
  //do you post here example :
  //$.ajax({
  //    url:base_url+'admin/articles/delete/',
  //    data: $('form').serializeArray(), // or $('form').serialize()
  //    type:'POST',
  //    dataType:'json'
  //}).done(function(data){
  //if (data)
  //{
  //   block.fadeOut('slow');
  //}
  //else
  //{
  //   alert('there was an error, please try again');
  //}
  //});
});

这对你有帮助吗？