PDA

View Full Version : Problem while getting store of item selector



FunnyBunny
29 May 2012, 10:45 PM
I've written a code for displaying table column names in Item selector. I can switch between different tables using combo box and respective columns should get populated in fromMultiselect(source multiselect box), whereas the right one(target multiselect/ toMultiselect) should not change its content.
If I'm again selecting same table name from the drop down, the list should be filtered while getting populated in fromMultiselect(left one). It should not display items which are already there in right selector.
For this I need to get the current store of right multiselect. How can I?:-?
I'm posting my code below. Which is not working, as its returning 0 items in the store.


Ext.onReady(function(){
Ext.QuickTips.init();

var currentTableSelected;

var sourceStore = new Ext.data.ArrayStore({
fields : ['columnName']
});

var targetStore = new Ext.data.ArrayStore({
fields : ['columnName']
});

var aliasComboValues = new Ext.data.ArrayStore({
fields : ['aliasName'],
url : 'ReadAliasNamesJDBC.action',
root : 'aliasRoot',
autoLoad : true
});

function getTableComboValues(aliasname)
{
var tableComboValues = new Ext.data.ArrayStore({
baseParams : {
aliasname : aliasname
},
fields : ['tableName'],
url : 'ReadTableNamesJDBC.action',
root : 'tableRoot',
autoLoad : true
});
return tableComboValues;
}

function checkTableSelected(arr,val)
{
for(var j=0;j<arr.length;j++)
{
if((arr[j].indexOf(val)) == -1) //if not found
return false;
}
return true; //if found
}

var gSelector = new Ext.extend(Ext.ux.form.ItemSelector,{
initComponent: function() {
gSelector.superclass.initComponent.call(this);
},

toFrom: function () {
var selectionsArray = this.toMultiselect.view.getSelectedIndexes();
var records = [];
for (var k=0; k<selectionsArray.length; k++) {
record = this.toMultiselect.view.store.getAt(selectionsArray[k]).get('columnName');
records.push(record);
}
if(checkTableSelected(records,currentTableSelected))
{
gSelector.superclass.toFrom.call(this);
}
else
Ext.Msg.alert('Message','Please select corresponding table.');
}
});

Ext.reg('gauriSelector', gSelector);

var form1 = new Ext.FormPanel({
renderTo : document.body,
id : 'form12',
frame : true,
title : 'Grids Demo',
width : 500,
height : 500,
items :
[
{
xtype : 'combo',
name : 'aliasname',
fieldLabel : 'Select Alias',
mode : 'local',
store : aliasComboValues,
displayField : 'aliasName',
valueField : 'aliasName',
editable : false,
autoShow : true,
triggerAction : 'all',
width : 200,
emptyText : 'Select alias',
listeners : {
select : function(f, r, i) {
Ext.getCmp('panel2').removeAll();
Ext.getCmp('panel2').doLayout();
Ext.getCmp('panel2').add([{
xtype : 'label',
text : 'Select Table'
},{
xtype : 'combo',
name : 'tablename',
fieldLabel : 'Select Table',
mode : 'local',
store : getTableComboValues(f.getValue()),
displayField : 'tableName',
valueField : 'tableName',
editable : true,
autoShow : true,
triggerAction : 'all',
width : 200,
emptyText : 'Select table',
listeners : {
select : function(f, r, i) {

currentTableSelected = f.getValue();

//to add records into sourceStore
Ext.Ajax.request({
url : 'GetTableDataJDBC.action',
params : {
tablename : f.getValue()
},
success: function( response, options )
{
temp = Ext.decode(response.responseText);
if(temp.success == true){
var cols = temp.cols; //column names array

}
var colCnt = cols.length;

//to remove previous columnnames
sourceStore.removeAll();

//get present selected records
var presentRecords=[];
var currentStore = Ext.getCmp('itemselector').toMultiselect.view.store; //returning store with 0 items everytime
var strCnt =currentStore.getTotalCount();
alert(strCnt);
if(strCnt != 0){
for(var l=0;l<strCnt;l++)
{
presentRecords.push(currentStore.getAt(l).get('columnName'));
}

for(var i=0;i<colCnt;i++)
{
var newColName = f.getValue()+':'+cols[i];
for(var m=0;m<strCnt;m++)
{
if(newColName != presentRecords[m]) //if columnname not present then only add
{
var new_rec = new (sourceStore.recordType)({
columnName : newColName
});
sourceStore.add([new_rec]);
}
}
}
Ext.getCmp('panel1').doLayout();
}
else
{
for(var i=0;i<colCnt;i++)
{
var newColName = f.getValue()+':'+cols[i];
var new_rec = new (sourceStore.recordType)({
columnName : newColName
});
sourceStore.add([new_rec]);
}
}
}

});
}
}}

]);
Ext.getCmp('panel2').doLayout();
}
}
},
{
xtype : 'panel', //panel to contain combobox
id : 'panel2',
autoWidth : true,
autoHeight : true,
bodyBorder : true,
border : true,
layout:'hbox'
},
{

xtype : 'panel', //panel to contain item selector
id : 'panel1',
autoWidth : true,
autoHeight : true,
bodyBorder : true,
border : true,
layout : 'fit',
autoScroll : true,
items : [{
xtype: 'gauriSelector',
id : 'itemselector',
name: 'itemselector',
fieldLabel: 'SelEct Items',
imagePath: 'extjs/examples/ux/images',
multiselects: [{
width: 250,
height: 200,
store :sourceStore,
displayField: 'columnName',
valueField: 'columnName'
},{
width: 250,
height: 200,
store:targetStore,
displayField: 'columnName',
valueField: 'columnName'
}]
}]

}
]
});

});

Regards,
FB

FunnyBunny
29 May 2012, 10:55 PM
Forgot to add panel.doLayout() in else. Please consider its there, still same result! :(

scottmartin
31 May 2012, 7:31 AM
Moved to Help and Discussion

Scott.

FunnyBunny
5 Jun 2012, 9:46 PM
Still no reply :s

scottmartin
6 Jun 2012, 6:46 AM
Please modify your code so it is a working example using an array store, or loading data from a static file.

Scott.