0

Bind Composer

asked 2014-06-09 07:53:43 +0800

azgard gravatar image azgard
37 3

Hi everyone, I dont know how can I select an Item of a combobox and use properties of a button when I use apply="org.zkoss.bind.BindComposer".

My application is: select items of a combobox's like: year, item, id and then, press a button and show a different data in a grid, depends on the combobox box selected.

I am gonna be very pleased if somebody can help me, cheers

delete flag offensive retag edit

Comments

post zul and vm plz

chillworld ( 2014-06-09 08:55:41 +0800 )edit

8 Answers

Sort by ยป oldest newest most voted
2

answered 2014-06-10 14:05:21 +0800

cyiannoulis gravatar image cyiannoulis
1201 10

Still not very clear... anyway here is a combo with dynamic data from your model:

<combobox model="@load(vm.cars)" selectedItem="@bind(vm.selectedCar)"
          onSelect="@command('car-selected')" readonly="true" >

   <template name="model" var="car">
    <comboitem label="@load(car.type)" />
   </template>

</combobox>

And here is a combo with static data:

<combobox selectedItem="@bind(vm.selectedComboItem)" 
          onSelect="@command('combo-item-selected')">
  <comboitem label="Fiat" value="Fiat" />
  <comboitem label="Audi" value="Audi" />
  <comboitem label="Renault" value="Renault" />
</combobox>

Now, every time you select something in the combobox the selected value is stored automatically in the "selectedItem" attribute in your view model.

If you don't want to do anything upon selection then remove the onSelect attribute from the combobox's declaration.

Your button then may fire the command to do anything you want with the selected combo item:

<button onClick="@command('Buscar')" label="Buscar" />

@Command("Buscar")
public void onBuscar() {
    if (selectedItem.equals ...)
    .... do whatever you want ...
}

Hope that helps, Costas

link publish delete flag offensive edit

Comments

Nice work costas, you got mine vote ;)

chillworld ( 2014-06-10 19:47:10 +0800 )edit

Thank you chill. Your posts are always the best :)

cyiannoulis ( 2014-06-11 09:22:28 +0800 )edit
0

answered 2014-06-09 07:54:53 +0800

azgard gravatar image azgard
37 3

I have done everthing except select the item of a combobox when I press the button.

link publish delete flag offensive edit
0

answered 2014-06-09 11:49:13 +0800

cyiannoulis gravatar image cyiannoulis
1201 10

updated 2014-06-09 12:31:08 +0800

It is not quite clear what you are trying to do. Maybe the "menupopup" attribute is what you are looking for. It opens a combobox to allow the user to select which columns will be visible:

<grid model="@load(vm.yourmodel)" >
  <columns menupopup="auto">
    <column label="ID" />
    <column label="Name" />
    <column label="Contact" />
  </columns>

Now, if you want to do this manually then you may bind the "visible" attribute for each column to a property in your model. For example:

<grid model="@load(vm.yourmodel)" >
  <columns>
    <column label="ID" visible="@load(vm.isIdColumnVisible)" />
    <column label="Name" visible="@load(vm.isNameColumnVisible)" />
    <column label="Contact" visible="@load(vm.isContactColumnVisible)" />
  </columns>

and use a bandbox to select the columns:

<bandbox id="bd" mold="rounded" autodrop="true">  
 <bandpopup>
    <listbox multiple="true" checkmark="true">
       <listhead>
          <listheader label="Select columns" />
       </listhead>
       <listitem label="ID" />
       <listitem label="Name" />
       <listitem label="Contact" />
    </listbox>
 </bandpopup>
</bandbox>

/costas

link publish delete flag offensive edit
0

answered 2014-06-09 16:58:20 +0800

azgard gravatar image azgard
37 3

updated 2014-06-09 17:04:34 +0800

            <row>
                <label value="Periodo" />
                <combobox hflex="1" readonly="true"
                    id="combCurso">
                    <comboitem label="2" />
                </combobox>
            </row>
            <row>
                <div></div>
                <button onClick="@command('Buscar')" label="Buscar" />
            </row>
        </rows>
    </grid>
link publish delete flag offensive edit
0

answered 2014-06-10 18:56:40 +0800

azgard gravatar image azgard
37 3

thanks so much Costas

link publish delete flag offensive edit
0

answered 2014-06-11 06:40:45 +0800

azgard gravatar image azgard
37 3

It exactly what I want, the problem is by the time I selected one item, it is going to execute the button, my application is going to have 3 combobox, after I selected all of them, I will press the button and make a query depends on the selected items.

With MyComposer.java in the div will be very easy, but I can't use because I neccesary will use databinding to change the data in a grid.

I am using data binding in the div like this:

Thank you for you answeer in advantage.

link publish delete flag offensive edit
0

answered 2014-06-11 07:26:12 +0800

azgard gravatar image azgard
37 3

and I really want to use somthing like MyComposer.java in apply because I'd like to disable the button after pressed, but using databinding I don't know how cheers

link publish delete flag offensive edit
0

answered 2014-06-11 09:20:33 +0800

cyiannoulis gravatar image cyiannoulis
1201 10

It is not necessary to use a composer, if all you need to do is to disable the button during the execution. The button has the "autodisable" property which solves these problems very efficiently:

<button id="ok" label="OK" autodisable="self" />

Check out this link.

/Costas

link publish delete flag offensive edit
Your answer
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow
1 follower

RSS

Stats

Asked: 2014-06-09 07:53:43 +0800

Seen: 37 times

Last updated: Jun 11 '14

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More