Recently I undertook an assignment to build an application with lots of CRUD operations, I knew about exts new launch in 2011 and its approach of doing MVC style of client side code management, data stores and various proxies, I finally went with it to architect the UI of our application.
The only challenge me and my team had is its novelty and less online help contents to date. Thanks to ExtJS Sencha web documentation, which we refer almost everyday to understand small small things about study the ExtJS framework, also gets amaze
when thing started coming in our favour. So over all not bad to take a chance with a new rich UI framework.
I am writing this post to tell readers about the events I used and for their purpose, also I would write here something about race conditions that I encountered and solved with the use of events.
ExtJS most necessary configuration where you need a Store and a Proxy for the store to manipulate. I used AJAX type of proxy to associate with my store.
afterRequest (to fetch the records to sync UI store with database asynchronously and avoid any trap of race conditions)
AJAX proxy is used to communicate asynchronously with back-end server, actually it sends an XMLHttpRequest to GET, POST, DELETE etc. Asynchronous requests are actually used to have non-blocking user interface experience for any such CRUD operations.
A common mistake we started doing with Ajax proxy that at the time we make call for CREATE a record in database the next moment we ask proxy to send a request to fetch the same record, which is not getting any record because the CREATE operation is still in its mid, so here we understood the race condition between these two operation CREATE and READ
One can call store.sync() and store.load(), one after another to replicate the above issue. Finally, we solved this issue by making such request synchronous in nature and by using afterRequest event of ExtJS proxy.
Below are some other usefull events
The only challenge me and my team had is its novelty and less online help contents to date. Thanks to ExtJS Sencha web documentation, which we refer almost everyday to understand small small things about study the ExtJS framework, also gets amaze
when thing started coming in our favour. So over all not bad to take a chance with a new rich UI framework.
I am writing this post to tell readers about the events I used and for their purpose, also I would write here something about race conditions that I encountered and solved with the use of events.
ExtJS most necessary configuration where you need a Store and a Proxy for the store to manipulate. I used AJAX type of proxy to associate with my store.
afterRequest (to fetch the records to sync UI store with database asynchronously and avoid any trap of race conditions)
AJAX proxy is used to communicate asynchronously with back-end server, actually it sends an XMLHttpRequest to GET, POST, DELETE etc. Asynchronous requests are actually used to have non-blocking user interface experience for any such CRUD operations.
A common mistake we started doing with Ajax proxy that at the time we make call for CREATE a record in database the next moment we ask proxy to send a request to fetch the same record, which is not getting any record because the CREATE operation is still in its mid, so here we understood the race condition between these two operation CREATE and READ
One can call store.sync() and store.load(), one after another to replicate the above issue. Finally, we solved this issue by making such request synchronous in nature and by using afterRequest event of ExtJS proxy.
Below are some other usefull events
–beforeShow (to assemble different forms and their data before it shown to the user.)
–
–beforeRequest (to set parameters to the request)
–beforeDestroy (to avoid destroying the pop-up windows and forms to enhance the performance of the system)
–expand (upon expanding the accordion layout’s panels)
–collapse( upon collapsing the accordion layout’s panels)
reference: ExtJS 4 Documentation
