Sencha ExtJS 5 Checkbox DataBinding

I often find that something does not work as I expect and I have to take the problem to bits.  In this case, I was expecting to post a bug to the Sencha team about DataBinding and checkbox field but as is often the case, making the simple example brings out the correct solution and understanding.  So, in light of sharing, here is my simple working example of two way databinding with Sencha’s ExtJS 5. You can see from the example and code that 1,true (and “on” not shown) all check the box as you would expect. Ext.application({ name: 'ProblemBindApp', launch: function () { Ext.create('Ext.container.Viewport', { autoShow: true, viewModel: { data: { … Continue Reading

Why In Sencha’s ExtJS or Sencha Touch Source is so Important

Right now, I’m trying to figure out how to turn grouping on and off in a Sencha ExtJS store. That is, I have a page that looks like the following where I want to have a checkbox to turn the grouping page on and off depending on how the user wants to see the display. So, I look in the help and I don’t find a method in the “store” documentation that says enableGrouping or disableGrouping.  I do find one that says “isGrouped” however.  So, clicking on the view source for that I now see source as follows: which tells me that if there are no “groupers” defined that my store is not grouped. Just sayin… … Continue Reading

ExtJS Not Using autoLoad Best Practice

The typical usage pattern in Sencha’s ExtJS for loading data into a visual control such as a grid is to assign a grid to a store, then let the store have autoLoad: true which means that when the store is created, it will automatically be loaded and since it is assigned to a visual control (grid), the grid will be populated.  I don’t like that pattern.  I like to be more in control.  There may be things I want to do before the grid is loaded. So, what I do is in the application launch event I load my store first and in my store itself, I explicitly tell it not to autoLoad by setting autoLoad to false.  Below is an example of the code I’m using at the moment to handle this.  Notice that I cleverly show a load mask … Continue Reading

In Sencha ExtJS how not to Thrash Precious Memory with Popup Forms

Typically, in the callback of a button that opens a popup window, we just create the window, get access to it’s form and then show it.  The code looks something like this: var data = this.getSessionDetailPanel().data, store = this.getSessionsStore(), session = store.getById(, formWindow = Ext.create('widget.sessionform'), form = formWindow.down('form').getForm(); // do stuff...; Assuming the above code is in a Sencha ExtJS button handler that brings up the form, the problem is that when the form gets close, the form panel gets deleted (destroyed) and the next time you use it, it all has to be created again. A better solution is to add to the form … Continue Reading


Get every new post delivered to your Inbox

Join other followers: