Load two jqgrids in order ( sequence ajax calls)

I have two jqgrids in my page. when page load i will popup a modeldialogwindow to the user that use a ajax call. i will populate jqgrids by using the value from the popup window that user selected. can i delay the jqgrid load ajax calls ? ( by g开发者_C百科iving timeout?)my issue is sometimes grids ajax calls fires before the popup. so that from the back end it will throw an error. ( since the value that user select is not exists. i need to do the following in a sequence manner.

1. show the popup window . wait for user response( this will automatically happens when using the window.showModalDialog) get the value that user selects and post to back end.

2. send ajax call to load the first grid.

3. send ajax call to load the second grid.

since jqgrids are populating just after the '$(document).ready' i was unable to delay it.

appreciate your help. Thank you in advance.

You should set datatype parameter of the both grids to 'local' at the initialization. It will prevent any ajax calls. After the user select all parameters needed for the ajax request you should set the datatype to 'json' (or 'xml' depend on your requirements) and trigger reloadGrid:

$("#list").setGridParam({datatype:'json',page:1}).trigger('reloadGrid');

Instead of calling the jqgrid function on $(document).ready move it to an event that gets fired after the user makes a selection in the modal box.