PDA

View Full Version : [HELP] How to dynamically assign value to the store in PICKER



hoaibaotre
24 Oct 2013, 6:50 PM
Dear,

I want to use only a picker in somewhere (in same page, in list page and popup add/edit) and re-use code. But I can't dynamic assign value to the store in that picker, so I can't re-use that.

Thank for help,
HoaND

Here my code, some special keywords in BOLD. With this code, data was archieved fully, but it can't render into my picker. When I move declaration store in Picker instead of in List file, data will be render into my picker.

file List.js


var pickerAgentSearchStore = Ext.create('Gtrack.store.PickerAgentSearchStore');
var pickerCompanySearchStore = Ext.create('Gtrack.store.PickerCompanySearchStore');
var pickerDepartmentSearchStore = Ext.create('Gtrack.store.PickerDepartmentSearchStore');


Ext.define('Gtrack.view.SaRole.List', {
extend: 'Ext.grid.Panel',
alias: 'widget.SaRoleList',
title: 'Danh sách vai tṛ',
store: 'SaRoleStore',

initComponent: function () {
var me = this;

Ext.applyIf(me, {
columns: [
{
header: 'STT',
align: 'right',
width: 30,
xtype: 'rownumberer'
},
{
xtype: 'gridcolumn',
dataIndex: 'ROLE_NAME',
//hidden: true,
flex: 1,
header: 'Vai tṛ',
text: 'Vai tṛ'
},
{
xtype: 'gridcolumn',
dataIndex: 'AGENT_NAME',
//flex: 1,
header: '??i lư',
text: '??i lư'
},
{
xtype: 'gridcolumn',
dataIndex: 'COMPANY_NAME',
header: 'Công ty',
text: 'Công ty',
//align: 'right',
},
{
xtype: 'gridcolumn',
dataIndex: 'DEPARTMENT_NAME',
//flex: 1,
header: 'Pḥng ban',
text: 'Pḥng ban'
},
],
viewConfig: {
stripeRows: true
},
dockedItems: [{
xtype: 'pagingtoolbar',
store: 'SaRoleStore',
dock: 'bottom',
displayInfo: true
}],
tbar: [new Ext.Toolbar.TextItem("Search:"),
{ xtype: 'tbspacer', width: 5 },
{
xtype: 'PickerAgentSearch',
width: 250,
labelWidth: 55,
fieldLabel: '??i lư ',
name: 'AGENT_NAME',
id: 'AGENT_NAME',
valueField: 'GROUP_ID',
displayField: 'text',
emptyText: 'Ch?n...',
valueNotFoundText: 'Ch?n...',
autoScroll: true,
store: pickerAgentSearchStore,
},
{ xtype: 'tbspacer', width: 5 },
{
xtype: 'PickerCompanySearch',
width: 250,
labelWidth: 68,
fieldLabel: 'Công ty ',
name: 'COMPANY_NAME',
id: 'COMPANY_NAME',
valueField: 'GROUP_ID',
displayField: 'text',
emptyText: 'Ch?n...',
valueNotFoundText: 'Ch?n...',
autoScroll: true,
store: pickerCompanySearchStore,
},
{ xtype: 'tbspacer', width: 5 },
{
xtype: 'PickerDepartmentSearch',
width: 250,
labelWidth: 80,
fieldLabel: 'Cây pḥng ban',
name: 'DEPARTMENT_NAME',
id: 'DEPARTMENT_NAME',
valueField: 'GROUP_ID',
displayField: 'text',
emptyText: 'Ch?n...',
valueNotFoundText: 'Ch?n...',
autoScroll: true,
store: pickerDepartmentSearchStore,
},
{
xtype: 'textfield',
width: 250,
fieldLabel: 'Vai tṛ',
//hideLabel: true,
labelWidth: 50,
name: 'pattern',
id: 'pattern'
},
{ xtype: 'tbspacer', width: 5 },
{
xtype: 'button',
text: 'T́m ki?m',
//border: true,
//icon: '/Content/icons/fam/cog.png',
iconCls: 'act-search',
action: 'Search'
},
{ xtype: 'tbspacer', width: 5 },
{
xtype: 'button',
text: 'T?o',
//border: true,
//icon: '/Content/icons/fam/add.png',
iconCls: 'act-add',
action: 'Add'
},
]
});

me.callParent(arguments);
}

});



$(document).ready(function () {
Ext.onReady(function () {
var AgentName = document.getElementById('hdAgentName').value;
var AgentId = document.getElementById('hdAgentId').value;

var GroupType = document.getElementById('hdGroupType').value;

var CompanyName = document.getElementById('hdCompanyName').value;
var CompanyId = document.getElementById('hdCompanyId').value;

var DepartmentName = document.getElementById('hdDepartmentName').value;
var DepartmentId = document.getElementById('hdDepartmentId').value;

var storeAgent = Ext.data.StoreManager.lookup('PickerAgentSearchStore');
var storeCompany = Ext.data.StoreManager.lookup('PickerCompanySearchStore');
var storeDepartment = Ext.data.StoreManager.lookup('PickerDepartmentSearchStore');

if (GroupType == undefined) {
return;
}
if (GroupType == '1') {
storeAgent.load();

storeCompany.load({
params: {
node: AgentId
}
});

Ext.getCmp('hiddenGROUP_ID').setValue(AgentId);
}
else if (GroupType == '2') {
storeCompany.load({
params: {
node: CompanyId
}
});

storeDepartment.load({
params: {
node: CompanyId
}
});

Ext.getCmp('AGENT_NAME').disable();
Ext.getCmp('hiddenGROUP_ID').setValue(CompanyId);
}
else if (GroupType == '3') {
storeDepartment.load({
params: {
node: CompanyId
}
});

//Ext.getCmp('btnCreate').disable();

Ext.getCmp('AGENT_NAME').disable();
Ext.getCmp('COMPANY_NAME').disable();
Ext.getCmp('hiddenGROUP_ID').setValue(DepartmentId);
}
else {
return;
}

});
});



file PickerAgentSearch.js



Ext.define('Gtrack.view.Common.PickerDepartmentSearch', {
extend: 'Ext.form.field.Picker',
alias: 'widget.PickerDepartmentSearch',

createPicker: function () {
return Ext.create('Ext.tree.TreePanel', {
hidden: true,
floating: true,
minHeight: 300,
//store: 'PickerDepartmentSearchStore',
//store: pickerDepartmentSearchStore,
rootVisible: false,
autoScroll: true,
listeners: {
select: function (saagenttreecombo, record, value) {
var storeparent = Ext.data.StoreManager.lookup('PickerDepartmentSearchStore');

Ext.getCmp('hiddenDEPARTMENT_GROUP_ID').setValue(record.data.GROUP_ID);
Ext.getCmp('hiddenGROUP_ID').setValue(record.data.GROUP_ID);

Ext.getCmp('DEPARTMENT_NAME').setValue(record.data.text);
Ext.getCmp('DEPARTMENT_NAME').collapse();
}
}
});
},
});


file PickerCompanySearch.js


Ext.define('Gtrack.view.Common.PickerCompanySearch', {
extend: 'Ext.form.field.Picker',
alias: 'widget.PickerCompanySearch',

createPicker: function () {
return Ext.create('Ext.tree.TreePanel', {
hidden: true,
floating: true,
minHeight: 300,
//store: 'PickerCompanySearchStore',
//store: pickerCompanySearchStore,
rootVisible: false,
autoScroll: true,
listeners: {
select: function (saagenttreecombo, record, value) {

Ext.getCmp('COMPANY_NAME').setValue(record.data.text);
Ext.getCmp('COMPANY_NAME').collapse();
Ext.getCmp('hiddenCOMPANY_GROUP_ID').setValue(record.data.GROUP_ID);
Ext.getCmp('hiddenDEPARTMENT_GROUP_ID').setValue('');
Ext.getCmp('hiddenGROUP_ID').setValue(record.data.GROUP_ID);

var storeAgent = Ext.data.StoreManager.lookup('PickerAgentSearchStore');
var storeCompany = Ext.data.StoreManager.lookup('PickerCompanySearchStore');
var storeDepartment = Ext.data.StoreManager.lookup('PickerDepartmentSearchStore');

var companyID = record.data.GROUP_ID;
storeDepartment.load({
params: {
node: companyID
}
});
Ext.getCmp('DEPARTMENT_NAME').setValue('');
}
}
});
},
});

hoaibaotre
24 Oct 2013, 11:11 PM
Pls help me!

hoaibaotre
27 Oct 2013, 6:16 PM
Is anyone there?