-
FEATURED COMPONENTS
First time here? Check out the FAQ!
I would like to know if is it there any event that is fired when I click on the button that opens the Detail of my grid or something like this. I am listening the onOpen event but the data has already rendered when this event is fired.
Thank you,
Javier
Hi there,
The onOpen event should be fired from client-side to the server when the user clicks, then be handled by the server-side handler during the events phase, which comes before rendering.
At this stage, you should still have control over the component.
Can you send a zkfiddle of what you are currently doing, and how you want it to behave?
What I really want is to get the control before the detail is open because I am using the same variables to load the detail of diferent rows and when the user has a detail open and opens another detail, the "old" variables values are shown in the new detail and then the onOpen event is fired which set the new values to the variables.
Because of that, I would like to know if there is another event that is fired before than onOpen event, like the onClick event of the detail's button or something like that. I got a code like this:
<vlayout apply="org.zkoss.bind.BindComposer" viewModel="@id('vm')">
<grid model="@load(vm.beans)">
<rows>
<template name="model" var="item">
<row value="@load(item)">
<detail onOpen="@command('onOpenEvent')">
<label value="@load(vm.labelValue)">
</detail>
</row>
</template>
</rows>
</grid>
</vlayout>
In this example I would like to change the "labelValue" before the detail is open. I have to say that only one detail will remain open, so if the user opens other row's detail, the previous detail will be closed.
Thank you,
Javier
Hi Javier,
Got a better understanding, thanks for the short example. Your main issue here is due to the timing between client-rendering and server-redering. When the user clicks a master detail, the component will open and display the last known content for this component. At the same time, a request is sent to the server to perform the onOpen event, but since there is a request/response cycle necessary to receive that update, the master-detail is already open with the old info at this point.
Depending on what is available on your objects, you could make the content of the master detail depend on the item instead of depend on the vm directly. For example:
<row value="@load(item)">
<detail onOpen="@command('onOpenEvent')">
<label value="@load(item.labelValue)">
Since each of the details would have their own content already, there shouldn't be conflict between values for different items. However, I can see this being memory inefficient, or even an issue if your data structure don't support this, or if the display value is not actually a property of the row item.
Another option would be to prevent the master detail from opening at client-side, and only set it open from server-side whenever the user has clicked the master detail, and the value have been populated.
You can do that with 3 steps: 1 > use script to prevent the default open action when doing doClick_ on master detail 2 > use a custom event, with a custom event handler to trigger the command 3 > use a model object to control the open state of the detail components
See an example here: https://zkfiddle.org/sample/107ojp2/4-Master-Detail-Override
Thank you! One more question: How would be the script to override the onSelect event of a tab? I would like to call this new custom event insted of onSelect, set the data to te variables and then open the tab.
I got something like this:
<vlayout apply="org.zkoss.bind.BindComposer" viewModel="@id('vm')">
<grid model="@load(vm.beans)">
<rows>
<template name="model" var="item">
<row value="@load(item)">
<detail onOpen="@command('onOpenEvent')">
<label value="@load(vm.labelValue)"
<tabs >
<tab onSelect="@command('onSelectEvent')"/>
Thank you,
Javier
Hi Javier,
I'm assuming that these tabs would be in a tabbox? I'm not entirely sure if that would work directly under the detail component. Yes, you can use the same principle in that case. Just intercept the click, prevent the client-side tab selection, and only use the viewmodel selection state with @load binding to choose the selected tab from the VM
See the client part below (the onCustom is selecting directly here, but you can use it as a @command)
https://zkfiddle.org/sample/2rfniv4/1-custom-tab-select-handler
Asked: 2020-04-16 00:34:19 +0800
Seen: 13 times
Last updated: Apr 22 '20