Databases
StackOverflow2013
Postsdbo
POExtJS 4.1: Modal Window seems to return control before submitting the window
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POExtJS 4.1: Modal Window seems to return control before submitting the window
    primarykey
    data
    text
    <p>I wasn't sure how to describe my question in the question title. But here is my problem:</p> <p>(a) When I double click on a row in an Ext.grid.Panel, I open a modal window with it's relavant details to update the record.</p> <p>(b) After I make the needed modifications and close the modal window, I want to return to the Grid with the Grid filtered on a certain code i.e selectedSalesOrderNum.</p> <pre><code>jobSlotsGrid.on('celldblclick', function(tableview, td, cellIndex, record, tr, rowIndex, e, eOpts){ modalStatus = loadWindow(); jobSlotStore.filterBy(function(rec) { alert('Filtering data'); return rec.get('salesOrderNum') === selectedSalesOrderNum; }); }); </code></pre> <p>(c) Below is the function, which creates the model window. It also has the call to method submitCreateJobSlotHandler() which basically saves the changes and reloads the original Grid with all the data. ( Hence the necessity to filter it back with a certain code i.e selectedSalesOrderNum ).</p> <pre><code>function loadWindow() { getAllTabsForEditJobSlot(); var createJobSlotWin = new Ext.Window({ id:'salesOrder-win-jobSlot', applyTo : 'hello-win', modal : true, layout : 'fit', width : 900, height : 500, closeAction :'destroy', plain : true, model : true, stateful : false, title :'Create Job Slot', items : [editJobSlotInformationPanel], buttons : [{ text : 'Save', handler : function(){ submitCreateJobSlotHandler(); //createJobSlotWin.destroy(); } },{ text : 'Close', handler : function(){ createJobSlotWin.destroy(); } }] }); createJobSlotWin.show(); } </code></pre> <p>The Issue:</p> <p>In the first block of code, as soon as the loadWindow method is called, both a modal window is popped up along with the filterBy code getting executed in parallel and showing up the alerts ( 'Filtering data' ). I then enter the data in the modal and save. So, basically, the filtering is not done after the Save/Close on Modal. The code ( if/else ) is immediately reached after loading the modal window. It is as if, the modal window opens and goes to the next line of code while waiting for the user to perform some action on the modal window later.</p> <p>Hope I am clear on my question. Could anyone please advice how do I handle this?</p> <p><strong>EDIT:</strong></p> <p>The more I think about it now, I guess the loadWindow() method just creates the Modal Window as we just have a new Ext.Window() call and doesn't bother about other user actions inside the modal and returns the control. And hence, executes the subsequent filterBy event immediately. In that case, I want to filter the store after I am reloading the store upon the Save in Modal Window. The save on Modal window has this handler code:</p> <pre><code>function submitCreateJobSlotHandler () { alert('Into Submit'); var formPanel = Ext.getCmp('salesOrderJobSlotForm'); formPanel.getForm().submit({ url : 'someUrl', method : 'POST', success : function() { alert('Success'); jobSlotStore.load({ scope : this, url : 'salesOrderJobSlot/listJSON' }); jobSlotStore.filterBy(function(rec) { alert(rec.get('salesOrderNum')+"--"+selectedSalesOrderNum) return rec.get('salesOrderNum') === selectedSalesOrderNum; }); }, failure : function() { alert('PSO save failed!'); } }); } </code></pre> <p>But the issue here is, the jobSlotStore.load() though gets called, it holds until the filterBy gets executed. Because, I see the alerts coming up one by one and then after all the alerts are done, the store loads. So, the filterBy gets overriden by the 'late' store load.</p> <p>Any suggestions to deal with the issue in any of the ways?</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USrajugaadu
    1. USrajugaadu
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload