javascript - Jtable ajax 帖子不工作

Question

我直接使用来自 JTable 网站的 PHP 示例代码。我无法从 AJAX POST 获取值。

我的 JTableSimple.php 中的 JavaScript:

$(document).ready(function () {

        //Prepare jTable
        $('#PeopleTableContainer').jtable({
            title: 'Table of people',
            actions: {
                listAction: 'PersonActions.php?action=list',
                createAction: 'PersonActions.php?action=create',
                updateAction: 'PersonActions.php?action=update',
                deleteAction: 'PersonActions.php?action=delete'
            },
            fields: {
                PersonId: {
                    key: true,
                    create: false,
                    edit: false,
                    list: false
                },
                Name: {
                    title: 'Author Name',
                    width: '40%'
                },
                Age: {
                    title: 'Age',
                    width: '20%'
                },
                RecordDate: {
                    title: 'Record date',
                    width: '30%',
                    type: 'date',
                    create: false,
                    edit: false
                }
            }
        });

        //Load person list from server
        $('#PeopleTableContainer').jtable('load');

    });

PersonActions.php(仅显示列表组件):

require_once 'config.php';
// connecting to mysql
$con = mysql_connect(DB_HOST, DB_USER, DB_PASSWORD);
// selecting database
mysql_select_db(DB_DATABASE);
//Getting records (listAction) 
if($_GET["action"] == "list")
{
    //Get Name
    $Name = $_POST['Name'];
    //SQL query
    $result = mysql_query("select * from user_data WHERE Name=$Name");
    //Add selected records into an array
    $rows = array();
    while($row = mysql_fetch_array($result))
    {
        $rows[] = $row;
    }

    //Return result to jTable
    $jTableResult = array();
    $jTableResult['Result'] = 'OK';
    $jTableResult['Records'] = $rows;
    print json_encode($jTableResult);
}

我正在使用 XAMPP。到目前为止我已经尝试过:

• 使用 var_dump($_POST) 不会返回任何内容。
• 重新安装 XAMPP
• 重新安装 JTable、JQuery、Jquery UI 的所有头文件和所有 css 文件。
• 使用 GET 而不是 POST，但这也不起作用。

当我打开“PersonActions.php?action=list”时，我收到一条通知:

Notice: Undefined index: Name in C:\xampp\htdocs\PersonActions.php on line xx

我认为这意味着 $_POST['Name'] 不存在？

Answer 1

我也遇到了同样的问题。尝试在表属性中的操作组件之前添加此内容:

ajaxSettings: {
        type: 'POST', 
        data: {'VariableName': 'VariableValue'},
        url: './PersonActions.php'
        },

出现这种情况是因为“列表”操作没有通过 AJAX 方法将任何数据发布到您的 PersonActions.php。你必须手动完成。

对于“更新”和“删除”等其他操作，您不需要进行任何其他更改，只需使用 $_POST['Fieldname']，如 JTable 示例代码中所示。

另外:我建议安装 Firebug。它对于查看 POST 数据非常有用，并提供了一个额外的调试工具。

编辑 #1 对于使用 PHP 的主/子: 如果要添加子表，请将以下代码添加为主表中的附加字段。我已将该字段命名为“ChildTableButton”。

           fields: {
                ChildTableButton: {
                        title: '',
                        width: '3%',
                        sorting: false,
                        edit: false,
                        create: false,
                        display: function (ChildData) {
                            //Image that will open child table
                            var $img = $('<img src="./img/more.png"/>');
                            //Open child table when user clicks the image
                            $img.click(function () {
                                $('#PeopleTableContainer').jtable('openChildTable',
                                        $img.closest('tr'),
                                        {
                                            title: 'Title',
                                            actions: {
                                                listAction: './tableactions.php?action=listchild',
                                               updateAction:'./tableactions.php?action=updatechild',
                                                deleteAction: './tableactions.php?action=deletechild'
                                                },
                                            fields: {
                                                Field1: {
                                                    title: 'Field 1 child table',
                                                    key: true,
                                                    create: false,
                                                    edit: false,
                                                    width: '50%'
                                                },
                                                Field2: {
                                                    title: 'Field 2 child table',
                                                    width: '50%'
                                                }
                                            }
                                        }, function (data) { //opened handler
                                            data.childTable.jtable('load');
                                        });
                            });
                            //Return image to show on the person row
                            return $img;
                        }
                    },

然后，您可以通过检查action='listchild'等来处理PHP端，就像您的主表一样。

希望这有帮助!