Tags
People
Badges
Help-
CORE FRAMEWORK
FEATURED COMPONENTS
-
RESOURCES
-
LEARN ZK
RESOURCES
Hello,
I'm new to zk and i'm looking for a good way (ie simple^^) to do the following thing:
The problem:
A page with one radio group with 2 radio button and one grid below.
The grid is empty at startup and receive then an empty listModel. A rowrenderer is render the grid data.
Grid has to be hidden at startup. 1st radio is selected.
When the 2nd radio is selected, a model object is added to the grid model and the grid become visible.
When the 1st radio is selected back, all datas in grid model are removed and the grid become invisible.
Solutions ?
1st/ I use the 'unless' property of the grid with an object that indicate whether to show the grid or not. Page is invalidated to redisplay the grid.
Something like:
in zul file:
<radiogroup>
<radio id="firstRadio" />
<radio id="secondRadio" />
</radiogroup>
<grid unless="${showMe}" >
....
in composer:
public void onCheck$secondRadio(Event event) {
ListModeList theModel = (ListModeList ) theGrid.getModel();
theModel.add(defaultBusinessObject());
// get page and
page.setAttribute("showMe", Boolean.TRUE);
page.invalidate();
}
public void onCheck$firstRadio(Event event) {
ListModeList theModel = (ListModeList ) theGrid.getModel();
theModel.clear();
// get page and
page.setAttribute("showMe", Boolean.FALSE);
page.invalidate();
}
2nd/ I use a css style to hide/unhide the grid ( maybe a good old overflow:hidden/overflow:visible ? another ? i'm not very good with css i fear :p). The css style is updated in the 'onCheck event' handlers. The model is handled the same way as in 1st solution. No need to explicit redisplay as the model care to fire appropriate events to the view.
3rd/ Hmm. No 3rd solution ^^
What do you think of this ? How would you do that ?
Welcome to zk. :)
i think visible is the one u need.
Just like the sample below
public void onCheck$secondRadio(Event event) {
grid.setModel(new ListModelList(getTestModel()));
grid.setVisible(true);
}
public void onCheck$firstRadio(Event event) {
grid.setModel(new ListModelList());
grid.setVisible(false);
}
2.append and remove with grid dymanic.
Just like your first solution ( page invalidate ) , because after invidate , grid will not exist in real html dom,
but component which setVisible(false) is still in the client dom.
----
btw , we usually prevent page invildate , because it will rebuild all the dom element of the component ,
but we actually want is setVisible or removeChild ( even in javascript, it needs just only one command . ).
and there's another way to include a zul through Executions.createComponents ,
so you can make a grid zul and build it when you need it ,remove the component when u didnt need it .
i thinks there is lots of way to do the thing u want ,
but basically , setVisible is very useful anymore . ^^
Great, i missed the setVisible feature, thank you :p
I actually managed to get it work by setting the grid style from display:none to display:block but your proposal is much more reliable.
I'll replace this by the user of 'visible' attribut as soon as i can, thank again.
Asked: 2010-09-30 07:42:37 +0800
Seen: 786 times
Last updated: Oct 01 '10