数据表更新单元格值不显示

时间:2018-12-11 13:40:38

标签: javascript jquery datatables

我想知道如何更改数据表中的单元格值。 我需要将rows.count()的值设置为最后一行的第一个单元格。

这是我创建数据表的功能:

function callForStepBoxes(){
    flow.steps = [];
    flowChartJSON = new Array();
    if(!typeof currentFlowsTable === 'undefined' || currentFlowsTable != null){
        $('#flowsTable').DataTable().ajax.url(restURI + 'orch/search/operations/'+flow.name).load();
        $('#flowsTable').DataTable().ajax.reload();
    } else {
        currentFlowsTable = $('#flowsTable').DataTable({
            responsive: true,
            columnDefs: [
                { responsivePriority: 1, targets: 0 },
                { responsivePriority: 2, targets: 4 },
                { responsivePriority: 3, targets: 2 },
                { responsivePriority: 4, targets: 3 },
                { responsivePriority: 5, targets: 4 },
                { responsivePriority: 6, targets: 5 }
            ],
            ajax: {
                "url": restURI + 'orch/search/operations/'+flow.name,
                "contentType": "application/json",
                "type": "GET",
                "data": null,
            },
            order: [0, 'desc'],
            scrollCollapse: true,
            scrollX: false,
            aLengthMenu: [
                [10, 25, 50, 100, -1],
                [10, 25, 50, 100, "All"]
            ],
            iDisplayLength: -1,
            "columns": [
                {"data": "ROWID", "defaultContent": "", "sClass": "displayNone"},
                {"data": "STEP", "defaultContent": "", "sClass": "text-center limitedWidth"},
                {"data": "OPERATION_NAME", "defaultContent": "", "sClass": "text-center limitedWidth"},
                {"data": null, "defaultContent": "<input type='number' class='flowTimeoutValue'/>", "sClass": "text-center limitedWidth"},
                {"data": null, "defaultContent": "<input type='number' class='flowLimitValue'/>", "sClass": "text-center limitedWidth"},
                {"data": null, "defaultContent": "<input type='checkbox' class='flowActiveValue' checked='false'/>", "sClass": "text-center limitedWidth"},
            ],
            'rowCallback': function(row, data, index) {
                // Retrieve rows.count
                lastStep = currentFlowsTable.data().count();
                // Retrieve last row
                lastRow = currentFlowsTable.row(':last').data();
                // Set the value
                lastRow.STEP = lastStep;
                currentFlowsTable.row(':last').data().STEP = lastStep;
            },
            'drawCallback': function(settings){
                createNodesAndEdges(flowChartJSON);
            }
        });
    };
}

我检索rows.count()值,我检索最后一行并设置该值,但它不起作用。我究竟做错了什么 ?谢谢!

2 个答案:

答案 0 :(得分:1)

请您尝试以下更改。

var flowTable = $('#flowsTable').DataTable().ajax.url(restURI + 'orch/search/operations/'+flow.name).load();
        flowTable.ajax.reload();

答案 1 :(得分:1)

我找到了解决方案。我在要更新第一个单元格的列中添加了一个类,然后检查该单元格的值是否为空。

function callForStepBoxes(){
    flow.steps = [];
    flowChartJSON = new Array();
    if(!typeof currentFlowsTable === 'undefined' || currentFlowsTable != null){
        var flowTable = $('#flowsTable').DataTable().ajax.url(restURI + 'orch/search/operations/'+flow.name).load();
        flowTable.ajax.reload();
    } else {
        currentFlowsTable = $('#flowsTable').DataTable({
            responsive: true,
            columnDefs: [
                { responsivePriority: 1, targets: 0 },
                { responsivePriority: 2, targets: 4 },
                { responsivePriority: 3, targets: 2 },
                { responsivePriority: 4, targets: 3 },
                { responsivePriority: 5, targets: 4 },
                { responsivePriority: 6, targets: 5 }
            ],
            ajax: {
                "url": restURI + 'orch/search/operations/'+flow.name,
                "contentType": "application/json",
                "type": "GET",
                "data": null,
            },
            order: [0, 'desc'],
            scrollCollapse: true,
            scrollX: false,
            aLengthMenu: [
                [10, 25, 50, 100, -1],
                [10, 25, 50, 100, "All"]
            ],
            iDisplayLength: -1,
            "columns": [
                {"data": "ROWID", "defaultContent": "", "sClass": "displayNone"},
                {"data": "STEP", "defaultContent": "", "sClass": "text-center limitedWidth stepCell"},
                {"data": "OPERATION_NAME", "defaultContent": "", "sClass": "text-center limitedWidth"},
                {"data": null, "defaultContent": "<input type='number' class='flowTimeoutValue'/>", "sClass": "text-center limitedWidth"},
                {"data": null, "defaultContent": "<input type='number' class='flowLimitValue'/>", "sClass": "text-center limitedWidth"},
                {"data": null, "defaultContent": "<input type='checkbox' class='flowActiveValue' checked='false'/>", "sClass": "text-center limitedWidth"},
            ],
            'rowCallback': function(row, data, index) {
                // Set the STEP for ARCHIVE operation
                lastStep = currentFlowsTable.data().count();
                if($(row).find('.stepCell').text() === "") {
                    $(row).find('.stepCell').append(lastStep);
                }
            },
            'drawCallback': function(settings){
                createNodesAndEdges(flowChartJSON);
            }
        });
    };
}