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

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 一样，它自己切割字符串并创建单独的属性，但我检查了串联，它们没问题。此外，控制台日志根本不显示错误。

这是 im 用于数据表初始化的自定义方法：

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 + '"

对于数据表函数，我建议添加此属性：

pagination: true,

但是，通过串联校正，它必须工作。