Datatables插件添加行PHP

时间:2011-10-05 15:53:04

标签: jquery datatables

datatables 应该添加的行请求似乎不会向.php页面发送请求。当我点击 AddNewRow 表单上的确认时,它只会在网页上的数据表中添加一行,并且不会提醒我任何来自php页面'AddData.php'的输出,如删除和编辑,这是唯一的其中的代码是一个echo'test',看它是否有效。

我正在使用Editable plugin for Datatables

HTML中要求makeEditable AddNewRow插件工作的表单工作正常,表单显示正确的按钮和字段。

如何测试是否发送了AJAX请求?我可以使用哪些功能或属性来检查发送的数据并更改必须发送的数据?

以下是创建数据表的代码:

$('#tmTabs').tabs( {
    "show": function(event, ui) {
        //make datatable columns resize to adjust to changing tabs

    }
} );

$('.dataTable').each(function(){ 
    //get ID of current table;
    tblID = $(this).attr("id");
    var pattern = "[0-9]+";
    $tblIDNum = tblID.match(pattern);

    //transform this table into a data table
    $(this).dataTable({ 
        "bProcessing":true,
        "sScrollY": "600px",
        "sScrollX": "100%",
        "bScrollCollapse": true,
        "bPaginate": false,
        "bJQueryUI": true

        }) 

    .makeEditable({
            //ajax requests for server-side processing

            sUpdateURL: "UpdateData.php",



            sAddURL: 'AddData.php',
            sDeleteURL: "DeleteData.php",
            sReadOnlyCellClass: "read_only",

            //Button Customization
            oAddNewRowButtonOptions: { 
            label: "Add...",
                            icons: { primary: 'ui-icon-plus' }
                        },
                        oDeleteRowButtonOptions: {
            label: "Remove",
                            icons: { primary: 'ui-icon-trash' }
                        },
                        oAddNewRowOkButtonOptions: {
            label: "Confirm",
                            icons: { primary: 'ui-icon-check' },
                            name: "action",
                            value: "add-new"
                        },
                        oAddNewRowCancelButtonOptions: { 
            label: "Close",
                            class: "back-class",
                            name: "action",
                            value: "cancel-add",
                            icons: { primary: 'ui-icon-close' }
                        },
            oAddNewRowFormOptions: {
                title: 'Add New Row',
                show: "blind",
                hide: "explode"
                },

            //Link button ids
            sAddDeleteToolbarSelector: ".dataTables_length",
            sAddNewRowFormId: "formAddNewRow"+$tblIDNum,
            sAddNewRowButtonId: "btnAddNewRow"+$tblIDNum,
            sAddNewRowOkButtonId: "btnAddNewRowOk"+$tblIDNum,
            sAddNewRowCancelButtonId: "btnAddNewRowCancel"+$tblIDNum,
            sDeleteRowButtonId: "btnDeleteRow"+$tblIDNum                                
            });
enter code here

});

1 个答案:

答案 0 :(得分:0)

使用firebug net panel查看Ajax调用已完成。

如果在没有任何警告的情况下添加该行,那么您的php页面似乎已被调用,并且它已返回插件接受的内容作为新行的有效ID。

请注意,如果您的页面返回任何响应,则此响应将被视为新行的ID。如果您可以找到新行的id属性,您将看到它具有从服务器返回的值。

根据您的描述,我认为您的服务器页面被调用,服务器端的插入失败但插件认为一切正常,并且添加了行。

从服务器返回错误代码的唯一方法是通过将响应状态代码设置为某些错误代码来强制Ajax错误,例如然后404和插件将在弹出窗口中显示响应正文并取消编辑。请参阅http://code.google.com/p/jquery-datatables-editable/wiki/AddingNewRecords#Handling_server_errors

上有关错误处理的更多详细信息