如何使用带有 ajax 调用的 jquery 数据表答案

【问题标题】：how to use jquery datatables with ajax calls如何使用带有 ajax 调用的 jquery 数据表
【发布时间】：2017-06-05 22:17:11
【问题描述】：

如何在 jquery 数据表中使用 ajax 回调，即点击时调用函数？：

这行得通

$(document).ready(function() {
    var table = $('#example').DataTable();

    $('#example tbody').on('click', 'tr', function () {
        var data = table.row( this ).data();
        alert( 'You clicked on '+data[0]+'\'s row' );
    } );
} );

用 Ajax 调用替换 alert( 'You clicked on '+data[0]+'\'s row' );：

不工作

$(document).ready(function() {
    var table = $('#example').DataTable();

    $('#example tbody').on('click', 'tr', function () {
        var data = table.row( this ).data();
        //alert( 'You clicked on '+data[0]+'\'s row' );

         $.ajax({
                url: '/process',
                data: data[0],
                type: 'POST',
                success: function(response) {
                    $("#response_placeholder").html(response);
                },
                error: function(error) {
                    console.log(error);
                }
         });

    } );
} );

后端

#--app.py----

@app.route('/process', methods=['POST'])
def process_data():
    data =  request.form['data[0]'];
    print data
    return render_template('mypage.html', result=data)

【问题讨论】：

标签： javascript jquery ajax flask datatables

【解决方案1】：

尝试使用它。

 $('body').delegate('#example tbody tr','click' , function () {


} );

Delegate 有助于在加载后添加到 dom 的元素上添加事件。

将数据放在这样的对象中也很方便

data: {data: data[0]},

并且网址应该包含扩展名

url: '/process.js', // or process.php depends on what extension it has.

对于标准，您应该定义将返回错误的 3 个属性，例如。

error: function(jqXHR, textStatus, errorThrown) {

【讨论】：