javascript - 如何通过 ajax 调用使用 jquery 数据表

Question

如何将ajax回调与jquery数据表一起使用，即点击时调用函数？:

这个有效

$(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)

Answer 1

尝试使用这个。

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


} );

委托(delegate)有助于在加载后添加到 dom 的元素上添加事件。

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

data: {data: data[0]},

并且 URL 可能应该包含扩展名

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

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

error: function(jqXHR, textStatus, errorThrown) {