DataTables& X-Editable使焦点项目可编辑

时间:2013-08-09 19:01:22

标签: javascript jquery html datatables

我有一个数据表和x-editable的工作设置,允许用户在从数据库加载的表中内联编辑数据。一旦页面加载我的代码下面触发并使所有可编辑选项可编辑,除了它似乎只适用于结果的第一页。当您单击下一步,更改结果数或进行搜索时,第一页上没有的任何项目都不可编辑。我假设这是因为数据表隐藏了当前页面上没有从文档流中删除它的数据。如何确保表格中的所有数据都是可编辑的?

$(document).ready(function () {
    $.fn.editable.defaults.mode = 'inline';
    $('.LocatorID').editable();
    $('.Title').editable();
    $('.Latitude').editable();
    $('.Longitude').editable();
    $('.Website').editable();
    $('.Address').editable();
    $('.City').editable();
    $('.State').editable();
    $('.Zip').editable();
    $('.Country').editable();
    $('.Phone').editable();
});

2 个答案:

答案 0 :(得分:6)

首先,将x-editable设置移动到自己的功能中:

function setupXedit() {
    $.fn.editable.defaults.mode = 'inline';
    $('.LocatorID').editable();
    $('.Title').editable();
    ...
}

然后进行设置,以便在每次抽奖时调用该函数:

$('#example').dataTable({
    "fnDrawCallback": function( oSettings ) {
     setupXedit();
     }
});

答案 1 :(得分:0)

这样做:在Datatable fnDrawCallback中有一个$('.edit').editable();,在.Datatable函数之外有一个<{p>

var table = $('#tbldivdsthietlap').DataTable({

            "fnDrawCallback": function( oSettings ) {
                $('.edit').editable();
            }
        });

$('.edit').editable();