如何从无处提交按钮？

Question

我正在制作一个新的Datatable，其中有这样的功能，如果有人按下它，我可以延展一行：

// Add event listener for opening and closing details
$('#datatable-buttons tbody').on('click', 'tr', function(){
    var tr = $(this);
    var row = a.row( this );


    if(row.child.isShown()){
        // This row is already open - close it
        row.child.hide();
        tr.removeClass('shown');
    } else {
        row.child(format(row.data())).show();
        tr.addClass('shown');
           }
});

所以，如果有人按了一条长线的按钮，我就听不到了：

$('#datatable-buttons tbody').on('click', 'td button', function(){
    var tr = $(this);
    var row = a.row( this );

然而，我已经尝试了100种方式来提交这一行的形式，但没有什么是正确的。

这是一个简单的函数，它扩展了一行：

function format ( d ) {
    var editform = '<form> ... <button type="submit" class="btn 
    btn-primary mb-2" >Submit</button></div> </div></form>';

    return editform; 
}

所以，现在我只能在按下按钮时才能听，但我不知道如何获取这些数据并提交表单。

再一次: 1. Datatable有行，没有任何按钮。2.如果您按下任何一行--它将扩展并显示它的详细信息(行下面的新区域将出现)。3.这是一份关于这一领域的表格。4.我不能提交。

UPDATE: 小提琴您可以看到一个问题，按下任何行并提交一个按钮。这样你就可以有一个警报，而不是表单数据。

Answer 1

从您的JSFiddle代码和注释来看，您似乎试图阻止表单提交，以便使用AJAX请求来提交数据。但是，您是通过修改form标记的"action“属性来做到这一点的，在这样做时引入了一个语法错误。

虽然您可能能够使此技术工作，但这不是推荐的方法，而且确实有一些缺点。最好使用标准的jQuery (委托)事件处理程序来处理表单的“提交”事件：

$('#table_id tbody').on('submit', 'form', function(event) { 
  event.preventDefault(); 
  //...and then your AJAX code goes here
});

event.preventDefault将阻止常规表单提交的发生，以便您能够运行AJAX代码。

下面是您的JSFiddle的一个经过调整的版本，展示了它的作用：https://jsfiddle.net/moa1nr9j/