2

我放弃了，因为在过去的 4 个小时里我一直在搞砸这个，我只是没有得到任何地方。使用此处找到的 jquery 数据表时。http://datatables.net/examples/api/editable.html（似乎是一个非常流行的插件）除了可编辑的单元格部分之外，我几乎可以获得我想要工作的所有内容。我有我的文件按这个顺序

<script src="JS/jquery.js"></script>
<script src="JS/jquery.dataTables.min.js" type="text/javascript"></script>
<script src="JS/jquery.jeditable.js"></script>
<script src="JS/jquery.validate.js"></script>
<script src="JS/ColReorder.min.js"></script>
<link href="JS/css/jquery.dataTables.css" rel="stylesheet" />

然后我有这个脚本来初始化表。

function formattable(thistable) {
        //alert(thistable + " from format table")
       // $(document).ready(function () {
            //  ADPControlProcessor_Table1
        //$("#ADPControlProcessor_GridView1").dataTable();

        var oTable = $("#ADPControlProcessor_GridView1").dataTable({
                //"bFilter": true,
                "sScrollY": "200px",
                "bPaginate": false,
                "bAutoWidth": false,
                "sDom": 'Rlfrtip'



            //});
            //alert("running");
       });

        //var oTable = $('#example').dataTable();

        /* Apply the jEditable handlers to the table */
        $('td', oTable.fnGetNodes()).editable('../examples_support/editable_ajax.php', {
            "callback": function (sValue, y) {
                var aPos = oTable.fnGetPosition(this);
                oTable.fnUpdate(sValue, aPos[0], aPos[1]);
            },
            "submitdata": function (value, settings) {
                return {
                    "row_id": this.parentNode.getAttribute('id'),
                    "column": oTable.fnGetPosition(this)[2]
                };
            },
            "height": "14px"
        });

我不知道还能尝试什么。谁能指出我正确的方向。

4

2 回答 2

11

我没有为可编辑的插件付费，而是自己构建了您可以免费使用的插件。仓库在这里：DataTables CellEdit Plugin

基本初始化快速简单：

oTable.MakeCellsEditable({
    "onUpdate": myCallbackFunction
});

myCallbackFunction = function (updatedCell, updatedRow) {
    console.log("The new value for the cell is: " + updatedCell.data());
}
于 2016-03-28T16:09:52.367 回答
5

你没有初始化正确试试这个

$(document).ready(function() {
        /* Init DataTables */
        var oTable = $('#example').dataTable();

        /* Apply the jEditable handlers to the table */
        $('td', oTable.fnGetNodes()).editable( '../examples_support/editable_ajax.php', {
            "callback": function( sValue, y ) {
                var aPos = oTable.fnGetPosition( this );
                oTable.fnUpdate( sValue, aPos[0], aPos[1] );
            },
            "submitdata": function ( value, settings ) {
                return {
                    "row_id": this.parentNode.getAttribute('id'),
                    "column": oTable.fnGetPosition( this )[2]
                };
            },
            "height": "14px"
        } );
    } );

这是现场示例，请单击此处

于 2013-07-04T06:47:32.227 回答