You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@tapestry.apache.org by nhhockeyplayer nashua <nh...@hotmail.com> on 2012/10/26 02:32:42 UTC

form and select component

Folks,

Do I really NEED to have a form with my <select> components ?

I know its unorthadox... but I would like to skip the form if possible to keep this lightweight and just use  onchange="this.form.submit()" when it gets selected.

Can I guarantee my handler will be invoked and the select value persisted across requests (provided I do it right). I have yet to see my handler get invoked on selection.

I am wondering if the dependencies between select and form are too substantive to bypass the form and operate the select with the javascript submit.

Thanks for any clarification.

Best regards 
and thanks... KEN 		 	   		  

Re: form and select component

Posted by Peter Wendorff <we...@uni-paderborn.de>.
Am 26.10.2012 02:32, schrieb nhhockeyplayer nashua:
> Folks,
>
> Do I really NEED to have a form with my <select> components ?
>
> I know its unorthadox... but I would like to skip the form if possible to keep this lightweight and just use  onchange="this.form.submit()" when it gets selected.
For that concrete question:
ask yourself, why you need a form to call "this.form..."...

Probably many of you (who ask questions on the Tapestry list) should 
learn a little bit basics about html and javascript, too. It's not 
enough to write java code, you should understand what the template code 
does, too.

Your question about select isn't a tapestry issue or question, it's a 
basic html issue; well... if you want, call it a slightly sophisticated 
html issue, but that's it.

If you're not sure how it works server side, first make sure which 
client side html code is generated (e.g. using Firebug), and work out, 
if and how communication with your server side tapestry application works.
You will find, that this.form.submit() would trigger a builtin 
javascript function on a form element, but that form element doesn't 
exist, because it has to be an ancestor of your select - and therefore 
you would have needed the form element in your template as well.

That's basics, sorry.
Probably Tapestry makes development too easy, if these basics are ignored.

regards
Peter

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


Re: form and select component

Posted by Thiago H de Paula Figueiredo <th...@gmail.com>.
On Thu, 25 Oct 2012 22:32:42 -0200, nhhockeyplayer nashua  
<nh...@hotmail.com> wrote:

> Folks,

Hi!

> Do I really NEED to have a form with my <select> components ?

Short answer: yes.
Long answer: yeeeeeeeeeeeeeeeeeeeeeeees. :P The Form component is the one  
who actually invokes the form field components logic that handles form  
submissions, so no, you can't have Tapestry's form field components  
without a surrounding Form. On the other hand, nothing prevents you to  
create your own Select-like component that doesn't need a Form to work and  
(optionally) submits a hidden form or triggers some server-side event.

> I know its unorthadox...

Almost all of the unorthodox things you've asked so far were the wrong way  
of doing something and the orthodox way was the recommended one.

> but I would like to skip the form if possible to keep this lightweight

What's the weight you think the Form component adds?

> and just use  onchange="this.form.submit()" when it gets selected.

You can do that with the Form component. Anyway, don't use onchange, use  
Prototype's Event.observe() or the corresponding function in jQuery or  
your JS framework of choice instead. Do the right thing. Leave bad things  
behind. :)

-- 
Thiago H. de Paula Figueiredo

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


Re: form and select component

Posted by Geoff Callender <ge...@gmail.com>.
Maybe the following will help?

	http://jumpstart.doublenegative.com.au/jumpstart/examples/ajax/select1
	http://jumpstart.doublenegative.com.au/jumpstart/examples/component/subformcomponent1

Cheers,
Geoff

On 27/10/2012, at 4:29 AM, nhhockeyplayer nashua wrote:

> 
> Ok I got the select to operate now with...
> 
> onchange="galleryForm.submit()"
> 
> funny thing... the gallery renders the proper amount of objects based on whats selected... but my darn select event handler never gets called.... i cannot get a break point in it or a log statement out of it
> 
> oh well...onward
> 
> I am historically an DECWindows XWindows buff... babied by the MIT boys back in the day... but this is endless challenging fun
> 
> From: nhhockeyplayer@hotmail.com
> To: users@tapestry.apache.org
> Subject: RE: form and select component
> Date: Fri, 26 Oct 2012 09:04:19 -0400
> 
> 
> 
> 
> 
> Ok, I am stubborn.. because it worked fine in T4 without the form.
> 
> But it is housed within a form... from the Home.tml... the form just isnt apparently visible inside the code of my widget.
> 
> Home.tml
> 
>    <t:form t:id="galleryForm" id="galleryForm" clientValidation="true" >
>        <t:errors/>
> 
>        <t:Gallery t:id="galleryWidget" id="galleryWidget"
>            collectionType="coachClass"
>            itemsPerPage="itemsPerPage"
>            tableColumns="tableColumns"
>            cursor="cursor"
>            />
> 
>    </t:form>
> 
> onchange="this.form.submit()" should work
> 
> ok I will get out the firebug and see what gives inside the dom
> 
> Best regards 
> and thanks... KEN
> 
> From: nhhockeyplayer@hotmail.com
> To: users@tapestry.apache.org
> Subject: RE: form and select component
> Date: Fri, 26 Oct 2012 00:37:24 -0400
> 
> 
> 
> 
> 
> <select t:type="Select" t:id="itemsPerPageSelect" t:clientId="itemsPerPageSelect" id="itemsPerPageSelect"
>    t:model="literal:5,10,15,25,50,100,250,500,1000,5000,10000"
>    t:value="itemsPerPage"
>    onchange="obj=document.getElementById('itemsPerPageSelect');Event.fire(obj,'change');"
> 
>    />
> 
> this one doesnt invoke the handler either
> 
> but I changed handkler to the following
> 
>    @Component(id="itemsPerPageSelect", parameters = { "value=itemsPerPage", "clientId=itemsPerPageSelect" })
>    private Select itemsPerPageSelect;
> 
>    @OnEvent(value = EventConstants.VALUE_CHANGED, component = "itemsPerPageSelect")
> 
>    public void onValueChangedItemsPerPageSelect(int value)
>    {
>    }
> 		 	   		   		 	   		   		 	   		  


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


RE: form and select component

Posted by nhhockeyplayer nashua <nh...@hotmail.com>.
Ok I got the select to operate now with...

onchange="galleryForm.submit()"

funny thing... the gallery renders the proper amount of objects based on whats selected... but my darn select event handler never gets called.... i cannot get a break point in it or a log statement out of it

oh well...onward

I am historically an DECWindows XWindows buff... babied by the MIT boys back in the day... but this is endless challenging fun

From: nhhockeyplayer@hotmail.com
To: users@tapestry.apache.org
Subject: RE: form and select component
Date: Fri, 26 Oct 2012 09:04:19 -0400





Ok, I am stubborn.. because it worked fine in T4 without the form.

But it is housed within a form... from the Home.tml... the form just isnt apparently visible inside the code of my widget.

Home.tml

    <t:form t:id="galleryForm" id="galleryForm" clientValidation="true" >
        <t:errors/>
        
        <t:Gallery t:id="galleryWidget" id="galleryWidget"
            collectionType="coachClass"
            itemsPerPage="itemsPerPage"
            tableColumns="tableColumns"
            cursor="cursor"
            />

    </t:form>

onchange="this.form.submit()" should work

ok I will get out the firebug and see what gives inside the dom

Best regards 
and thanks... KEN

From: nhhockeyplayer@hotmail.com
To: users@tapestry.apache.org
Subject: RE: form and select component
Date: Fri, 26 Oct 2012 00:37:24 -0400





<select t:type="Select" t:id="itemsPerPageSelect" t:clientId="itemsPerPageSelect" id="itemsPerPageSelect"
    t:model="literal:5,10,15,25,50,100,250,500,1000,5000,10000"
    t:value="itemsPerPage"
    onchange="obj=document.getElementById('itemsPerPageSelect');Event.fire(obj,'change');"
    
    />

this one doesnt invoke the handler either

but I changed handkler to the following

    @Component(id="itemsPerPageSelect", parameters = { "value=itemsPerPage", "clientId=itemsPerPageSelect" })
    private Select itemsPerPageSelect;
    
    @OnEvent(value = EventConstants.VALUE_CHANGED, component = "itemsPerPageSelect")

    public void onValueChangedItemsPerPageSelect(int value)
    {
    }
 		 	   		   		 	   		   		 	   		  

Re: form and select component

Posted by Thiago H de Paula Figueiredo <th...@gmail.com>.
On Fri, 26 Oct 2012 11:04:19 -0200, nhhockeyplayer nashua  
<nh...@hotmail.com> wrote:

> Ok, I am stubborn.. because it worked fine in T4 without the form.

T5 is not T4. T5 is a complete rewrite, not sharing any code with T4, so  
don't expect stuff to work in the same way.

> But it is housed within a form... from the Home.tml... the form just  
> isnt apparently visible inside the code of my widget.
>
> Home.tml
>
>     <t:form t:id="galleryForm" id="galleryForm" clientValidation="true" >
>         <t:errors/>
>        <t:Gallery t:id="galleryWidget" id="galleryWidget"
>             collectionType="coachClass"
>             itemsPerPage="itemsPerPage"
>             tableColumns="tableColumns"
>             cursor="cursor"
>             />
>
>     </t:form>
>
> onchange="this.form.submit()" should work

Again, use the right thing, use event listeners, not onXXX. You seem to be  
really stubborn to do things the non-recommended way . . . :P

-- 
Thiago H. de Paula Figueiredo

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


RE: form and select component

Posted by nhhockeyplayer nashua <nh...@hotmail.com>.
Ok, I am stubborn.. because it worked fine in T4 without the form.

But it is housed within a form... from the Home.tml... the form just isnt apparently visible inside the code of my widget.

Home.tml

    <t:form t:id="galleryForm" id="galleryForm" clientValidation="true" >
        <t:errors/>
        
        <t:Gallery t:id="galleryWidget" id="galleryWidget"
            collectionType="coachClass"
            itemsPerPage="itemsPerPage"
            tableColumns="tableColumns"
            cursor="cursor"
            />

    </t:form>

onchange="this.form.submit()" should work

ok I will get out the firebug and see what gives inside the dom

Best regards 
and thanks... KEN

From: nhhockeyplayer@hotmail.com
To: users@tapestry.apache.org
Subject: RE: form and select component
Date: Fri, 26 Oct 2012 00:37:24 -0400





<select t:type="Select" t:id="itemsPerPageSelect" t:clientId="itemsPerPageSelect" id="itemsPerPageSelect"
    t:model="literal:5,10,15,25,50,100,250,500,1000,5000,10000"
    t:value="itemsPerPage"
    onchange="obj=document.getElementById('itemsPerPageSelect');Event.fire(obj,'change');"
    
    />

this one doesnt invoke the handler either

but I changed handkler to the following

    @Component(id="itemsPerPageSelect", parameters = { "value=itemsPerPage", "clientId=itemsPerPageSelect" })
    private Select itemsPerPageSelect;
    
    @OnEvent(value = EventConstants.VALUE_CHANGED, component = "itemsPerPageSelect")

    public void onValueChangedItemsPerPageSelect(int value)
    {
    }
 		 	   		   		 	   		  

RE: form and select component

Posted by nhhockeyplayer nashua <nh...@hotmail.com>.
<select t:type="Select" t:id="itemsPerPageSelect" t:clientId="itemsPerPageSelect" id="itemsPerPageSelect"
    t:model="literal:5,10,15,25,50,100,250,500,1000,5000,10000"
    t:value="itemsPerPage"
    onchange="obj=document.getElementById('itemsPerPageSelect');Event.fire(obj,'change');"
    
    />

this one doesnt invoke the handler either

but I changed handkler to the following

    @Component(id="itemsPerPageSelect", parameters = { "value=itemsPerPage", "clientId=itemsPerPageSelect" })
    private Select itemsPerPageSelect;
    
    @OnEvent(value = EventConstants.VALUE_CHANGED, component = "itemsPerPageSelect")

    public void onValueChangedItemsPerPageSelect(int value)
    {
    }
 		 	   		  

RE: form and select component

Posted by nhhockeyplayer nashua <nh...@hotmail.com>.
as you can tell I like to keep things petite and simple

onchange="Event.fire(this,'change');"

?

From: nhhockeyplayer@hotmail.com
To: users@tapestry.apache.org
Subject: RE: form and select component
Date: Thu, 25 Oct 2012 23:49:20 -0400





    <select t:type="Select" 
                  t:id="itemsPerPageSelect" t:clientId="itemsPerPageSelect" 
                  id="itemsPerPageSelect"
                  t:model="literal:5,10,15,25,50,100,250,500,1000,5000,10000"
                  t:value="itemsPerPage"
                 />

    @Component(id="itemsPerPageSelect", parameters = { "value=itemsPerPage", "clientId=itemsPerPageSelect" })
    private Select itemsPerPageSelect;
    
    @OnEvent(value = EventConstants.VALUE_CHANGED, component = "itemsPerPageSelect")
    public Object onValueChangedItemsPerPageSelect() {
         ...
    }

Why isnt this sufficient?
It refuses to invoker the event handler.
I am beating this thing to death with ID's

I figured I would at least get a break point.
 		 	   		   		 	   		  

Re: form and select component

Posted by Thiago H de Paula Figueiredo <th...@gmail.com>.
> Why isnt this sufficient?
> It refuses to invoker the event handler.

I've already told you that it won't work and why, in this same thread why,  
so I don't think I need to repeat it here.

-- 
Thiago H. de Paula Figueiredo

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


RE: form and select component

Posted by nhhockeyplayer nashua <nh...@hotmail.com>.
    <select t:type="Select" 
                  t:id="itemsPerPageSelect" t:clientId="itemsPerPageSelect" 
                  id="itemsPerPageSelect"
                  t:model="literal:5,10,15,25,50,100,250,500,1000,5000,10000"
                  t:value="itemsPerPage"
                 />

    @Component(id="itemsPerPageSelect", parameters = { "value=itemsPerPage", "clientId=itemsPerPageSelect" })
    private Select itemsPerPageSelect;
    
    @OnEvent(value = EventConstants.VALUE_CHANGED, component = "itemsPerPageSelect")
    public Object onValueChangedItemsPerPageSelect() {
         ...
    }

Why isnt this sufficient?
It refuses to invoker the event handler.
I am beating this thing to death with ID's

I figured I would at least get a break point.