Question

在我的模板中得到这个Ajax，我收到一个json响应，并将该json的元素追加到数据表中：

$('.bicam_tests').click(function(){
    $.ajax({
        type: 'GET',
        url: 'http://10.1.1.150/humanresource/testsql.php?user_id=&user_id=&option=total_quizes_json',
        dataType: 'json',
        async: false,
        contentType: 'application/json; charset=UTF-8',
        success: function (response) {
            $("#id_bicam_datatable tbody").html("");
            $.each(response, function(i, item) {
                $("#id_bicam_datatable tbody").append('<tr><td>'+ item.id +'</td><td>'+ item.course +'</td><td>'+ item.name +'</td><td>'+'<input class="form-check-input" name="bicam_check" type="checkbox" fid=' + item.id  + ' fcourse=' + item.course + ' fname=' + item.name + '></td></tr>');
            });
            init_datatable("#id_bicam_datatable");
        },
        error:
        function(data){
            alert("Response error");
        }
    });
});

我有两个问题：

我无法获取用于对记录进行分页的数据表
我正在设置的自定义属性（fid，fcourse和fname）正在接收修剪过的字符串，就像javascript它自己切割字符串并创建分离的属性但我检查了连接并且它们没问题。此外，consolelog根本不显示错误。

这是我用于数据表init的自定义方法：

function init_datatable(element, option){
    var element = element || ".datatable";
    var option_sorting = [[0,'asc']];
    if(option == "no-order"){
        option_sorting = [];
    }
    $("" + element).DataTable({
        'lengthChange': true,
        'searching'   : true,
        'destroy'     : true,
        'ordering'    : true,
        'info'        : true,
        'autoWidth'   : true,
        'aaSorting'   : option_sorting,
        "language": {
            "url": "//"+ XPS_ +"/datatables/lang/Spanish.json"
        }
    })
}

Answer 1

尝试在引号中包含变量连接（javascript + HTML）：

$('.bicam_tests').click(function(){
    $.ajax({
        type: 'GET',
        url: 'http://10.1.1.150/humanresource/testsql.php?user_id=&user_id=&option=total_quizes_json',
        dataType: 'json',
        async: false,
        contentType: 'application/json; charset=UTF-8',
        success: function (response) {
            $("#id_bicam_datatable tbody").html("");
            $.each(response, function(i, item) {
                $("#id_bicam_datatable tbody").append('<tr><td>'+ item.id +'</td><td>'+ item.course +'</td><td>'+ item.name +'</td><td>'+'<input class="form-check-input" name="bicam_check" type="checkbox" fid="' + item.id  + '" fcourse="' + item.course + '" fname="' + item.name + '"></td></tr>');
            });
            init_datatable("#id_bicam_datatable");
        },
        error:
        function(data){
            alert("Response error");
        }
    });
});

如果未设置引号，则会打印：

<input class="form-check-input" name="bicam_check" type="checkbox" fid=item  fcourse=XXX text of course fname=YYY text of name>

DOM显示了这个：

<input class="form-check-input" name="bicam_check" type="checkbox" fid=item  fcourse=XXX text="" of="" course="" fname=YYY text="" of="" name="">

如果您期望一个字符串（带空格），则正确的方法用引号括起来。整数类型字段不需要引号。

fcourse="' + item.course + '"

对于Datatable功能，我建议添加此属性：

pagination: true,

但是，通过连接校正，它必须有效。

Javascript数据表分页和自定义属性获得不需要的修剪字符串

1 个答案: