How can I represent jqgrid values ​​as forms?

Question

I am trying to use jqGrid in a form where the user fills out traditional forms like username, phone, etc. The form contains jqGrid for positions in which the user can add / edit / process rows and when done, submit the entire form. I have a grid that works the way I want it to appear, I just can’t get the contents of the grid presented as part of the contained form.

Here is an example of pseudo code:

<form id="foo"> <input id="username" type="text">Your name<br> Enter your choices in the grid below: <!-- imagine jqGrid here --> <input type="submit" value="Submit the form"></form> 

I searched, searched Google, read documents, read wiki, etc., but just can't see how to pass rows and columns to jqGrid as forms. Any recommendations would be appreciated.

Answer 1

Probably the best way to do this is to use a hidden form field:

 <input type="hidden" name="gridData" value="" /> 

Then you must fill in the field with column data before submitting the form. You can either do this by updating the field as grid data, or by calling the JavaScript function when the button is pressed to submit the form (and calling form submit from this function).

To write grid data to a hidden field, you can call getRowData in each row of the grid sequentially and add data for each row to the array. Or maybe there is a better way. For example, is there a new data option that might work? In any case, if you have grid data, you can use json2.js to serialize the data in JSON format:

 JSON.stringify( myGridData ); 

Then on the server, you can decode JSON from this hidden field and process it accordingly.