You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@tapestry.apache.org by Ben Titmarsh <be...@hotmail.co.uk> on 2013/04/23 17:58:21 UTC

Handling onEvent change from a Select component

After a lot of Googling around I'm unable to find a solution to my problem.  I want to handle the change event from a Select Component.  I'm creating a bunch of these components in a loop:

<t:select t:id="type" model="cardTypeModel" encoder="cardTypeEncoder" value="cubeCard.cardType" blankOption="never"/>

And I've got the following handler declaration:

    @OnEvent(component="type", value = "change")
    public Object onChangeOfCardType(String value) {
        System.out.println("onChange!!!");
        return cardTypeZone.getBody();
    }
    
Ideally I want to provide some context to this handler too so that it knows which CardType to update (i.e. which Select the event came from).  The handler just isn't getting called at the moment, what am I doing wrong?
 		 	   		  

RE: Handling onEvent change from a Select component

Posted by Ben Titmarsh <be...@hotmail.co.uk>.
This reply really helped me, thanks Jens.

Everything is working fine for a select component.  The mixin seems to submit the value to the server, but when I do the same for a checkbox or textfield, no joy.  

<t:textfield t:id="tagList" t:clientId="tagList" class="cubeAjaxUpdate" value="cubeCard.tagList" t:mixins="jquery/bind" bind.context="cubeCard.id" bind.event="tagListChanged" bind.eventType="change" bind.zone="gridZone" t:zone="gridZone"/>

I know for sure that the change event is getting fired after the value has been entered into the textfield and can see the server side handler being called, but cubeCard.tagList is null.

Any ideas?

> Date: Tue, 23 Apr 2013 21:27:53 +0200
> From: mailinglist@j-b-s.de
> To: users@tapestry.apache.org
> Subject: Re: Handling onEvent change from a Select component
> 
> Hi Ben!
> 
> I am using the tapestry-jquery mixin for this:
> 
> tml:
> 
> <t:select t:id="yourId" model="yourModel" encoder="yourEncoder" 
> t:validate="required" value="yourValue"
>          t:mixins="jquery/bind" bind.context="${yourValue.pk}" 
> bind.event="yourSelectionChanged" bind.eventType="change"/>
> 
> page:
> 
> public Object onYourSelectionChanged(final long pk)
> {
>      System.out.println(pk);
>      return null;
> }
> 
> 
> 
> so any change of the select input control triggers "change" which calls 
> the "yourSelectionChanged" method, which is named 
> "onYourSelectionChanged" in java by tapestry convention. I believe you 
> can use "[${yourValue.pk}, ${whateverId}]  to pass multiple arguments to 
> your method, too (be careful: this is just my gut feeling, never tried it)
> 
> Jens
> 
> 
> 
> Am 23.04.13 17:58, schrieb Ben Titmarsh:
> > After a lot of Googling around I'm unable to find a solution to my problem.  I want to handle the change event from a Select Component.  I'm creating a bunch of these components in a loop:
> >
> > <t:select t:id="type" model="cardTypeModel" encoder="cardTypeEncoder" value="cubeCard.cardType" blankOption="never"/>
> >
> > And I've got the following handler declaration:
> >
> >      @OnEvent(component="type", value = "change")
> >      public Object onChangeOfCardType(String value) {
> >          System.out.println("onChange!!!");
> >          return cardTypeZone.getBody();
> >      }
> >      
> > Ideally I want to provide some context to this handler too so that it knows which CardType to update (i.e. which Select the event came from).  The handler just isn't getting called at the moment, what am I doing wrong?
> >   		 	   		
> 
> 
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> For additional commands, e-mail: users-help@tapestry.apache.org
> 
 		 	   		  

Re: Handling onEvent change from a Select component

Posted by George Christman <gc...@cardaddy.com>.
Hi Ben, a really basic example. I'm assuming your trying to loop the zones,
I hope this helps.


<t:Loop source="products" value="product">
${product}
<t:select t:id="cardType" validate="required" zone="${product}"/>
<t:zone t:id="cardTypeZone" id="${product}">

<t:if test="cardTypes">
<p> ${cardTypes}</p>
<t:if>

<t:zone>
<t:Loop>


    @Property
    private CardType cardType;
    @Property
    private String cardTypes;
    @InjectComponent
    private Zone cardTypeZone;
    private String products = "desk,computer";
    @Property
    private String _product;

    public String[] getProducts() {
        return products.split(",");
    }

    public Object onValueChanged(CardType cardType) {
        cardTypes = findCardType(cardType);
        return cardTypeZone.getBody();
    }

    public String findCardType(final CardType cardType) {
        switch (cardType) {
            case DISCOVER:
                return "Discover Card";
            case VISA:
                return "Visa";
            case MASTERCARD:
                return "Mastercard";
            default:
                return "American Express";
        }
    }

    public enum CardType {
        DISCOVER, VISA, MASTERCARD, AMEX;
    }


On Tue, Apr 23, 2013 at 3:27 PM, Jens Breitenstein <ma...@j-b-s.de>wrote:

> Hi Ben!
>
> I am using the tapestry-jquery mixin for this:
>
> tml:
>
> <t:select t:id="yourId" model="yourModel" encoder="yourEncoder"
> t:validate="required" value="yourValue"
>         t:mixins="jquery/bind" bind.context="${yourValue.pk}" bind.event="
> **yourSelectionChanged" bind.eventType="change"/>
>
> page:
>
> public Object onYourSelectionChanged(final long pk)
> {
>     System.out.println(pk);
>     return null;
> }
>
>
>
> so any change of the select input control triggers "change" which calls
> the "yourSelectionChanged" method, which is named "onYourSelectionChanged"
> in java by tapestry convention. I believe you can use "[${yourValue.pk},
> ${whateverId}]  to pass multiple arguments to your method, too (be careful:
> this is just my gut feeling, never tried it)
>
> Jens
>
>
>
> Am 23.04.13 17:58, schrieb Ben Titmarsh:
>
>  After a lot of Googling around I'm unable to find a solution to my
>> problem.  I want to handle the change event from a Select Component.  I'm
>> creating a bunch of these components in a loop:
>>
>> <t:select t:id="type" model="cardTypeModel" encoder="cardTypeEncoder"
>> value="cubeCard.cardType" blankOption="never"/>
>>
>> And I've got the following handler declaration:
>>
>>      @OnEvent(component="type", value = "change")
>>      public Object onChangeOfCardType(String value) {
>>          System.out.println("onChange!!**!");
>>          return cardTypeZone.getBody();
>>      }
>>      Ideally I want to provide some context to this handler too so that
>> it knows which CardType to update (i.e. which Select the event came from).
>>  The handler just isn't getting called at the moment, what am I doing wrong?
>>
>>
>
>
> ------------------------------**------------------------------**---------
> To unsubscribe, e-mail: users-unsubscribe@tapestry.**apache.org<us...@tapestry.apache.org>
> For additional commands, e-mail: users-help@tapestry.apache.org
>
>


-- 
George Christman
www.CarDaddy.com
P.O. Box 735
Johnstown, New York

Re: Handling onEvent change from a Select component

Posted by Jens Breitenstein <ma...@j-b-s.de>.
Hi Ben!

I am using the tapestry-jquery mixin for this:

tml:

<t:select t:id="yourId" model="yourModel" encoder="yourEncoder" 
t:validate="required" value="yourValue"
         t:mixins="jquery/bind" bind.context="${yourValue.pk}" 
bind.event="yourSelectionChanged" bind.eventType="change"/>

page:

public Object onYourSelectionChanged(final long pk)
{
     System.out.println(pk);
     return null;
}



so any change of the select input control triggers "change" which calls 
the "yourSelectionChanged" method, which is named 
"onYourSelectionChanged" in java by tapestry convention. I believe you 
can use "[${yourValue.pk}, ${whateverId}]  to pass multiple arguments to 
your method, too (be careful: this is just my gut feeling, never tried it)

Jens



Am 23.04.13 17:58, schrieb Ben Titmarsh:
> After a lot of Googling around I'm unable to find a solution to my problem.  I want to handle the change event from a Select Component.  I'm creating a bunch of these components in a loop:
>
> <t:select t:id="type" model="cardTypeModel" encoder="cardTypeEncoder" value="cubeCard.cardType" blankOption="never"/>
>
> And I've got the following handler declaration:
>
>      @OnEvent(component="type", value = "change")
>      public Object onChangeOfCardType(String value) {
>          System.out.println("onChange!!!");
>          return cardTypeZone.getBody();
>      }
>      
> Ideally I want to provide some context to this handler too so that it knows which CardType to update (i.e. which Select the event came from).  The handler just isn't getting called at the moment, what am I doing wrong?
>   		 	   		


---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
For additional commands, e-mail: users-help@tapestry.apache.org