Clever Geek Handbook

Jtable ajax message not working

I am using the example code straight from the JTable for PHP website. I cannot get the values ​​from the AJAX POST.

javascript in my JTableSimple.php:

$(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 (list component only):

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);
}

I am using XAMPP. I have tried so far:

  • Using var_dump ($ _ POST) which returns nothing.
  • Reinstalling XAMPP
  • Re-setting all header files for JTable, JQuery, JQuery UI and all css files.
  • Using GET instead of POST, but that doesn't work either.

When I open "PersonActions.php? Action = list", I get a notification that:

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

What I am assuming means that $ _POST ['Name'] does not exist?

+3


source to share


1 answer


I had the same problem. Try adding this before the action component in your table properties:

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

This happens when the "list" does not POST any data via AJAX methods to your PersonActions.php. You have to do it manually.

For other actions, such as "update" and "delete", you do not need to make any additional changes, just use $ _POST ['Fieldname'] as shown in the JTable code example.

ALSO: I would recommend installing Firebug. This is really useful for viewing POST data and provides an additional tool for debugging.



EDIT # 1 For the wizard / kid with PHP: If you want to add a child table, add the following code as an additional field to your main table. I named the field "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;
                        }
                    },

Then you can refer to the PHP side by checking if action = 'listchild' is valid, etc. just like your main table.

Hope this helps!

0


source






More articles:


All Articles