Question

我正在努力将代码从dataTables 1.9转换为1.10，以及使用ajaxSource而不是预填充表。

我遇到的问题是我的表行有一个输入字段，当填充新的源时，我丢失了输入字段中写入的数据。我尝试过很多变通办法，但似乎无法获得无缝的东西。

下面你会看到生成表数据的PHP代码以及带有user_list类的输入框。由于我每30秒更新一次表格数据，因此我试图将书面文本拉回来，而不会让用户知道数据已更新。

我尝试使用以下方法完成此操作：

        setInterval(function() {
            var predata = $(".user_list:focus").val();
            var trid = $(".user_list:focus").closest('tr').attr('id');
            mainTable.ajax.reload(null, false);
            console.log(predata);
            console.log(trid);
            $("#" + trid + " .user_list").val(predata);
        }, 30000);

但是，尽管console.loging id正确，但输入的值永远不会更新。请协助。

JS：

mainTable = $("#main_dash").DataTable({
    "language": {
        "url": "../locale/" + locale + "/LC_MESSAGES/" + "dt." + locale + ".txt",
    },
    "pagingType": "full_numbers",
    "pageLength": 10,
    "ajax": {
        "url": "ajax_tables/main_table.php",
        "type": "POST"
    },
    "columnDefs": [
        { "orderable": false, "targets": 0 }
    ],
    "columns": [
        {"data": "flagged"},
        {"data": "date"},
        {"data": "type"},
        {"data": "regarding"},
        {"data": "submitted_by"},
        {"data": "review"},
        {"data": "assign"},
    ],
    "autoWidth":false,
    "order": [[1, 'asc']],
    "deferRender": true,
    "initComplete": function() {
        setInterval(function() {
            mainTable.ajax.reload(null, false);
        }, 30000);
    },
});

PHP代码（main_table.php）：

foreach ( $data as &$d ) {
    $d['DT_RowId'] = $d['groom_id'];
    $d['DT_RowClass'] = 'groom-color-' . $d['type_id'];
    $d['review'] = '<button class="button button-blue review_item">Review</button>';
    $d['assign'] = '<span class="groom_id hidden">' . $d['groom_id'] . '</span><input type="text" class="user_list">';
    if ( preg_match('/1969-12-31/', $d['date'] )) {
        $d['date'] = $d['date2'];
    }
    if ( $d['flagged'] ) {
        $d['flagged'] = '<img src="images/red_flag.gif">';
    } else {
        $d['flagged'] = null;
    }
}

echo json_encode(array(
    "draw" => 1,
    "recordsTotal" => $count,
    "recordsFiltered" => 1,
    "data" => $data,    
));

Answer 1

在输入字段中添加onchange()处理程序，并使用ajax调用将值写入数据库。

然后在下次重新加载时，值应该再次出现。

当然，您应该在写入数据时阻止自动重新加载，而是在将更改的数据成功保存到数据库然后再次激活自动重新加载时重新加载。可以用i am busy saving - don't auto-reload now标志来完成。

在dataTables中使用ajax.reload（）保存输入文本

1 个答案: