View Full Version : Ext.ux.data.BindMgr - Databind Manager

22 Feb 2009, 2:00 PM
Hi there,

as some of you may have noticed, I've been into data binding technology recently. I've run from failed concept of "binding-record-to-component", through "binding-components-to-record" implemented in Ext.data.Record, to Bind Manager that finally looks pretty usable and universal, yet simple enough.

BindMgr is a singleton that manages records (as many of them as you need, from as many stores as you need - or standalone records) and components bound to them. The idea is that after you bind a component to a record, the component will be informed about data changes in that record. If component has afterEdit, afterReject, afterCommit, onBind and onUnbind methods they will be called with the record causing the change as argument.

You can see the demo at http://examples.extjs.eu/?ex=databind and documentation of BindMgr at http://extjs.eu/docs/?class=Ext.ux.data.BindMgr


23 Feb 2009, 5:39 PM
post deleted by MJ

24 Feb 2009, 1:40 AM
Re id: Bound components are internally stored in an object and keyed by their id for easy reference. Ext assign ids anyway.

Re Record (last version): It is fully functional but I started to doubt that it will find its way to to the core. I also started to realize that data binding functionality should be separated from the record itself. I will update the Feature Request thread.

24 Feb 2009, 4:46 AM
post deleted by MJ

24 Feb 2009, 4:48 AM
Because I use c.id as key to internal object that stores bound components:

this.bounds[internal_id].components[c.id] = c;

24 Feb 2009, 4:55 AM
post deleted by MJ

24 Feb 2009, 5:00 AM
Now I get the question.... :)

Component is w/o id before it is initialized, so if user passes sth like:

Ext.ux.data.BindMgr.bind(record, {xtype:'grid', ...});

it will be ignored. Maybe the test is redundant but does no harm and protects internal storage.

24 Feb 2009, 8:03 AM
Post deleted by MJ

25 Feb 2009, 5:56 AM
We where thinking about implementing much the same idea. Is there any specific reason you didn't choose to use the plugin structure?

25 Feb 2009, 6:12 AM
Plugin to components? I dropped the idea for more reasons:

1) concept of binding record to component failed. Good concept is: bind components to record
2) it is too much overhead of add plugin to all components you want to bind
3) you can have many records from many stores and many components bound to them at the same time

So the concept of sigleton BindMgr is best I can see at present.

25 Feb 2009, 12:16 PM
post deleted by MJ

25 Feb 2009, 12:27 PM
MJ, if you can put it to form needed for my examples (html + js + css, if any) I can host it at my server. Looks nice and useful.

26 Feb 2009, 7:05 AM
Hi, jsakalos, I'm getting an error on examples.extjs.eu ..

26 Feb 2009, 8:39 AM
Which error? Which browser? Have you cleared cache of your browser?

27 Feb 2009, 4:12 AM
Its ok now, i was getting an error for about 2 - 3 days but now its ok.

PS: Nice extension

27 Feb 2009, 4:14 AM
Yeah, I found it; it was a syntax error in one of the core files.

1 Mar 2009, 1:39 AM
hi jsakalos,

thanks for this bindMgr, it work fine but I forgot to see something because when I use it, it does not appear the first time, I must close and reopen my 'FormPanel'

can I put the code here or should I open another post?

1 Mar 2009, 2:02 AM
Hmmm, BingMgr has no UI so I doubt your troubles are related to it. If you still think they are, then post the code here.

1 Mar 2009, 4:07 AM
I found, I call my function mywin.show () too late.
Now it works well
sorry for the derangement
thank you

4 Jun 2009, 6:40 AM
First, Ext.ux.data.BindMgr is a great class and works very well with 2.2 =D>

at the moment i update a Application to 3.0 RC2. I found out that the afterCommit functianalty not work anymore.

Could it be because of the

// patch Ext.data.Record
if('function' !== typeof Ext.data.Record.prototype.afterEdit) {
Ext.override(Ext.data.Record, {

in Ext.ux.data.BindMgr ?

Any tips are welcome to get this great extension running for Extjs 3.0


4 Jun 2009, 7:18 AM
I found out little bit more.

Its because the Record bject changed from 2.2 to 3.0 and now has some function the patch was for.

now functions exist by default with no parameter "record" which Ext.ux.data.BindMgr function expect, like:

4 Jun 2009, 7:33 AM
Works for me if i remove the

if('function' !== typeof Ext.data.Record.prototype.afterEdit) {
condition because in 3.0 its true because afterEdit exists, but the following overrides are needet that BindMgr works

4 Jun 2009, 10:53 AM
I haven't ported it to 3.x yet. You could help with posting the complete code (or contact me via skype:jsakalos). I'd test it and publish it then.

20 Mar 2010, 7:21 AM
hi, i have problem whit BindMgr, my solution is set reference on BindMgr to record :

record.bindMgr = this;
record.afterEdit = record.afterEdit.createSequence(this.afterEdit, record);
record.afterReject = record.afterReject.createSequence(this.afterReject, record);
record.afterCommit = record.afterCommit.createSequence(this.afterCommit, record);
and in handlers:

,afterEdit:function() {
var mgr = this.bindMgr; // mgr is stored in record
var id = mgr.idOf(this); // this is record
if(id) {
for(var p in mgr.bounds[id].components) {
if(mgr.bounds[id].components.hasOwnProperty(p)) {
var c = mgr.bounds[id].components[p];
mgr.callMethod('afterEdit', this, c);
} //eo function afterEdit

For me this solution working.

20 Mar 2010, 1:35 PM
Thank you for posting the code.

23 Jun 2010, 8:18 AM

I am using ExtJs 3.2.1.

I have two questions:

+ is BindMgr the best way to bind components and records in ExtJs 3.2.1?.

+ is BindMgr compatible with ExtJs 3.2.1?.


23 Jun 2010, 8:37 AM
If you really need various components bound to one record then BindMgr is very good. If you only need, for example, to edit a record with a form then it is overkill.

BindMgr contains Ext.data.Record override that was written for Ext 2.x so this override would need revision for use with Ext 3.x.

11 Jan 2013, 5:25 AM

Does BindMgr also work with ExtJS 4.x or does a similar helper exists?
We found a site using some sort of binding (see http://blog.dnet-ebusiness-suite.com/2012/03/data-binding-in-extjs-4-grid-form.html) and I was wondering if we could do something similar with BindMgr.