PDA

View Full Version : Uncaught Ext.AbstractManager.register(): Registering duplicate id



venkateshwar
4 Feb 2013, 11:15 PM
In the application below, I am trying to add `id`'s to the generated items dynamically. My code works fine but when I add the below two commented lines in it. It throws error


Uncaught Ext.AbstractManager.register(): Registering duplicate id "73" with this manager


--------------
When I tried to find out the source of error, I found that the code is working fine till the execution of `81` id's (console.log(_idGen)). From this, it is clear that the error is related to out of range exception. (9*9 = 81) and also only in Fiddle, when I add HTML text to the child panels, I came to know that they are between 73 to 81??(instead of 1 to 81) which is confusing me, how?


FIDDLE (http://jsfiddle.net/v7hZH/1/)



Ext.onReady(function(){
var _idGen = 1;
var childItems = [], items = [];

for (var i = 0; i < 9; i++) {
childItems.length = 0;
for (var j = 0; j < 9; j++) {
childItems.push({
xtype: 'panel',
/****************************/
id: _idGen,
html: _idGen + "",
/****************************/
width: 50,
height: 50,
style: {borderWidth: '1px'}
});
console.log(_idGen);
/*****************************/
_idGen++;
/*****************************/
}
items.push({
xtype: 'panel',
layout: {
type: 'table',
columns: 3
},

items: childItems
});
}
Ext.create('Ext.container.Container', {
layout: {
type: 'table',
// The total column count must be specified here
columns: 3
},
renderTo: Ext.getBody(),
style: {width: '455px',marginLeft: 'auto',marginRight: 'auto', marginTop: '30px'},
items: items
});


});

sriram139
5 Feb 2013, 8:54 AM
itemId: (Recommended) HTML element's ID is automatically generated to ensure uniqueness, usually by concatenating ID of the container hierarchy. Programmer only need to ensure ID is unique within it's container.

id: (Not recommended) Rendered HTML element will use this property as their ID. It's programmer's responsibility to ensure it is unique across the whole page (think when you starting to have multiple instances of the same control on a page).

For more info on these, refer their APIs, they clearly mention how to use them:
http://docs.sencha.com/ext-js/4-1/#!/api/Ext.AbstractComponent-cfg-id
http://docs.sencha.com/ext-js/4-1/#!/api/Ext.AbstractComponent-cfg-itemId