get row data from grid

[mr_putersmitParticipant]

Hi

Can someone show in a easy example, the process required to get the data from a row and send to php server for inclusion in db? What I am trying to do is when I click on a link button this opens a popup window with form. Once I jave completed form and upon hitting OK, this data goes to server via ajax for processing. I assume it has something to do with var data = $(‘#grid’).jqxGrid(‘getrowdata’, 0); or events, but cannot see where to start. If an example could include php/db call rather than xml, I would be grateful. Many thanks

[Peter StoevKeymaster]

Hi mr_putersmit,

See this help topic: php-server-side-grid-crud.htm.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[mr_putersmitParticipant]

Hi Peter

I have looked at that tut extensively and still am slightly confused. For example, in the link you gave me, in the section where the grid is populated under the addrow code there is a line var datarow = generaterow(rowscount + 1); there is no generaterow function that I can see. That appears in the xml example. So how is datarow used in the php example? Also, this example is only good for adding the next available row to the grid from the db. What about if someone wanted to add new data by say using popup and submit to php through ajax? Thanks

[Peter StoevKeymaster]

The help topic shows how to add, delete and update a row. It uses sample local data. The help topic also shows how to send update, insert and delete commands via Ajax and it also contains PHP code which implements the synchronization with the DB. The generaterow is included in the code, too. Its just a simple function used in the help topic to generate the local data.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[mr_putersmitParticipant]

Peter
OK.May I put it like this. What is the correct way to retrieve data from a grid and pass to ajax for db inclusion. Once I have the framework, I can possibly figure the rest out from the API. Thanks

[Peter StoevKeymaster]

Hi mr_putersmit,

This part of the help topic and especially the addrow, deleterow and updaterow functions retrieve data and make ajax calls. You can also use the getrowdata method of jqxGrid to get a row at specific index and make the ajax call depending on the returned value from getrowdata.

var source =
{
     datatype: "json",
     datafields: [
         { name: 'EmployeeID'},
         { name: 'FirstName'},
         { name: 'LastName'},
         { name: 'Title'},
         { name: 'Address'},
         { name: 'City'},
         { name: 'Country'},
         { name: 'Notes'}
    ],
    id: 'EmployeeID',
    url: 'data.php',
    addrow: function (rowid, rowdata) {
        // synchronize with the server - send insert command
        var data = "insert=true&" + $.param(rowdata);
           $.ajax({
                dataType: 'json',
                url: 'data.php',
                data: data,
                success: function (data, status, xhr) {
                   // insert command is executed.
                }
            });
    },
    deleterow: function (rowid) {
        // synchronize with the server - send delete command
           var data = "delete=true&EmployeeID=" + rowid;
           $.ajax({
                dataType: 'json',
                url: 'data.php',
                data: data,
                success: function (data, status, xhr) {
                     // delete command is executed.
                }
            });
   },
    updaterow: function (rowid, rowdata) {
        // synchronize with the server - send update command
           var data = "update=true&" + $.param(rowdata);
              $.ajax({
                dataType: 'json',
                url: 'data.php',
                data: data,
                success: function (data, status, xhr) {
                    // update command is executed.
                }
            });
    }
};

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[mr_putersmitParticipant]

Peter

In the example you give here on your site:

// create new row.
$("#addrowbutton").bind('click', function () {
var datarow = generaterow();
$("#jqxgrid").jqxGrid('addrow', null, datarow);
});

That is fine on the fly and I can follow that. But my scenario is quite different. What I need to do is to click on a button which opens popup with form fields. I then need to capture those events to MySQL along with the row data. Can you show example for that? Easy as pie in php, but quite new to JavaScript and jQuery and certainly to your widgets. Many Thanks for your continuing help whilst I try and grasp this new way of working.

[Author]

Posts