Below is the picture first.
I finished customizing the fields this morning, following the work I finished a few days ago. The idea is to get the information of the column, such as fields and columns, after the ordinary query or advanced query is completed, and then hand it over to a processing function.
MakeCustomMadePanel, this function is used to generate checkboxgroup, and an event will be added to it when it is generated. At first, people thought that checkbox would have an event similar to check, but the API looked at it and it seems that only one change event, MD, can be used.
Post what you wrote below.
MakeCustomMadePanel function. . Used to automatically generate checkboxgroup according to the columns of the grid (the header content of the whole grid is obtained from the background, and the checkboxgroup can be generated to control the hidden display of columns no matter what table is sent in the background).
These parameters are the fields and columns used by gridpanel in reconfigure, and var uses these parameters during this period.
t = grid _ a . column manager . header CT . items . get(th . itemid); Is the key. . This sentence is used to get the column information of grid _ a. I can't seem to find it in the api. I found several methods on the internet, but none of them are suitable. I don't want to give each column an ID. This was found in stackoverflow.com/.. /questions/2079 1685/extjs-4-how-do-I-hide-show-grid-columns-on-the-fly
Copy code
The code is as follows:
function
MakeCustomMadePanel (field, cl)
{
defined variable
x = cusmadepanel . get component(' custom ');
//console . log(cusmadepanel . get component(' custom '));
For (var
I = 0; I & ltfields.lengthi++)
{
x.add(
{
xtype
:
Check box field',
Box label
:
cl[i]。 Title,
input value
:
Field [i]. Name,
Checked: correct,
itemId:i,
name
:
Custom',
listeners
:
{
change
:
Function (th,
Value,
Old value, eop)
{
defined variable
t = grid _ a . column manager . header CT . items . get(th . itemid);
if(t.isVisible()){
t . set visible(false);
}
Otherwise {
t . set visible(true);
}
//grid_a.columns[3]。 set visible(false);
}}
}
);
}
}
After giving it to customMadePanel
Copy code
The code is as follows:
Ext.define('customMadePanel ',
{
expand
:
External Form Panel',
title
:
Custom field',
knock-down
:
exactly,
project
:
[
{
ItemId: "custom",
xtype
:
Check box group',
Field label
:
Select field',
row
:
6,
project
:
[]
}]
//Fold: true,
});
defined variable
cusMadePanel=new
customMadePanel();
The shortcomings of my method are also obvious. It takes too long to generate checkbox components by looping through the makeCustomMadePanel function, and it takes a few seconds for 38 components. . The user experience is definitely not good. .
And it is currently generated according to the query results after each query. . . I'll think of a good way.
Today, makeCustomMadePanel is optimized, and the speed of generating components is obviously higher than before!
Copy code
The code is as follows:
function
MakeCustomMadePanel (field, cl)
cus made = 1;
defined variable
x = cusmadepanel . get component(' custom ');
//console . log(cusmadepanel . get component(' custom '));
defined variable
fie =[];
For (var
I = 0; I & ltfields.lengthi++)
{
//x.add(
defined variable
Temperature =
{
xtype
:
Check box field',
Box label
:
cl[i]。 Title,
//Enter a value
:
Field [i]. Name,
Checked: correct,
itemId:i,
name
:
Custom',
listeners
:
{
change
:
Function (th,
Value,
Old value, eop)
{
defined variable
t = grid _ a . column manager . header CT . items . get(th . itemid);
//console . log(t . is visible());
//console . log(' break ');
if(t.isVisible()){
t . set visible(false);
}
Otherwise {
t . set visible(true);
}
//console . log(t . is visible());
//var
t 1 = grid _ a . column manager . header CT . items . get(th . itemid);
//console . log(t 1);
//grid_a.columns[3]。 set visible(false);
}}
};
//console . log(temp);
fie . push(temp);
}
//console . log(fie);
x . add(fie);
The idea is to group the component objects that need to be generated circularly first, and then add them at one time. The cost of each addition is very high, and the speed is really improved ~