[Seaside] TwitterBootstrap dropdowns and submitting on change

Mariano Martinez Peck marianopeck at gmail.com
Fri Oct 18 01:49:42 UTC 2013


On Thu, Oct 17, 2013 at 6:23 PM, Paul DeBruicker <pdebruic at gmail.com> wrote:

>
> I think you're trying to find out about something by asking about
> something else, and in this instance its confusing.  What I suspect you are
> trying to do is:
>
> 1. user clicks dropdown menu item
> 2. form data is submitted to server
> 3. form callback is processed based on which menu item is clicked
> 4. UI is updated based on calculations and data
>
>
Ouch Paul.....you will kill me....I have wasted your time.. Sorry. I found
out my stupid problem.
I added the form just as an immediate "give it a try" because my callbacks
were not being executed. But no, I didn't have any data in there.
Now, why my callbacks were no being called? because of the most stupid
error. At least nobody saw it in the pasted code either hahaha.
I was defining the anchors as:

html anchor text: 'something'; callback: [ self halt  ].

just changing it to

html anchor  callback: [ self halt  ]; with: 'something';

make the callbacks work...

Again, sorry to waste your time and thanks for your help!



>
> more below:
>
> On Oct 17, 2013, at 11:40 AM, Mariano Martinez Peck <marianopeck at gmail.com>
> wrote:
>
> >
> >
> >
> > On Thu, Oct 17, 2013 at 2:37 PM, Paul DeBruicker <pdebruic at gmail.com>
> wrote:
> > Hi Mariano,
> >
> > I don't understand what you mean when you say "And it doesn't work
> either"
> >
> >
> > The callback is not called.
>
> You can't have the anchor callbacks processed as part of the form
> submission process because anchors aren't form elements, but navigation
> elements.  They can trigger a form submission using javascript and thats
> about it when it comes to forms & anchors.
>
> You can either attach those callbacks to #hiddenInputs next to each anchor
> or just use one hiddenInput at the bottom of the form (which is what I
> recommend if you want the same thing to happen no matter what link is
> clicked)
>
> If you want a different callback to be processed based on which anchor is
> clicked and have the UI updated then do this:
>
>
> html anchor
>                 onClick:
>                         (html jQuery ajax
>                                 serializeForm: (html jQuery id: 'myForm');
>                                 onSuccess:
>                                                 ((html jQuery id:
> 'myForm') load
>                                                                 html: [ :h
> |
>
> self selectedCallback.
>
> self renderForm: h ])).
>                 with: 'Selected'.
>
> Which serializes the form data, then replaces the form after performing
> the #selectedCallback
>
>
> >
> >
> > That should serialize the form and the data in the inputs to the server.
>  In the javascript debugger do you see a 'GET' after clicking the link that
> has the form data?
> >
> >
> > Yes, I do see a GET.
> >
> > Maybe you need a
> >
> > html hiddenInput callback:[self processSubmittedFormData].
> >
> > at the end of the form.
> >
> >
> > mmm I don't get it. Sorry, I am still a bit newbie here.
> >
>
>
> So if all of the callbacks in your example do the same thing then take the
> callbacks off the anchors and at the end of the form insert a #hiddenInput.
>  Attach a callback to that #hiddenInput which will process all the data.
>  Put it at the end of the form so all of the form's data will have been
> processed by seaside by the time its time to run the #hiddenInput's
> callback.
>
>
> > What do you want to happen when the link is clicked?
> >
> >
> > Quite simple in fact. I just want my callbacks to be invoked. See my
> original example:
> >
>
> I think the #hiddenIpnut or the JQuery monstrosity above should cover it
> but do you mean all of them anytime one a link is clicked or just the one
> nearest the link?
>
>
> > html form: [
> > html tbsButtonGroup: [
> >               html tbsDropdownButton beDefault;  beExtraSmall; with:
> [html text: 'Filter '; tbsCaret].
> >               html tbsDropdownMenu
> >                       with: [
> >                               html tbsDropdownMenuItem: [
> >                                       html anchor
> >                                               text: 'Selected';
> >                                               callback: [self halt. ]. ].
> >                               html tbsDropdownMenuItem: [
> >                                       html anchor
> >                                               text: 'Unselected';
> >                                               callback: [self halt. ]. ].
> >                       ]
> >       ]
> >
> > ]
> >
> > you see those halts? I simple want them to really be executed when I
> click on an item....
> >
> > thanks Paul.
> >
> >
> >
> >
> >
> > Thanks
> >
> > Paul
> >
> > On Oct 17, 2013, at 10:25 AM, Mariano Martinez Peck <
> marianopeck at gmail.com> wrote:
> >
> > >
> > >
> > >
> > > On Thu, Oct 17, 2013 at 1:39 PM, Paul DeBruicker <pdebruic at gmail.com>
> wrote:
> > > Hi Mariano,
> > >
> > >
> > > Can you use the JQAjax>>serializeForm: ?
> > >
> > > e.g. for our anchor say:
> > >
> > > onClick: html jQuery ajax serializeForm:(html jQuery id:'myForm');
> > >
> > >
> > >
> > > Hi Paul, I have just tried that doing this:
> > >
> > > html tbsDropdownMenuItem: [
> > >                                       html anchor
> > >                                               onClick: (html jQuery
> ajax serializeForm: (html jQuery id: formID));
> > >                                               text: 'Selected';
> > >                                               callback: [self halt. ].
> ].
> > >
> > >
> > > And it doesn't work either. The html for such code is this:
> > >
> > > <li>
> > >
> > >     <a
> onclick="jQuery.ajax({"url":"/dp","data":["_s=OpQD8YOfnkSWYrc_","_k=6_McsUmdszVXIFuG","21",jQuery("#id18").closest("form").find(":input").serialize()].join("&")})">
> … </a>
> > >
> > > </li>
> > >
> > > and indeed, "#id18" is the correct id of the form.
> > >
> > > Ant other idea?
> > >
> > > Thanks in advance,
> > >
> > >
> > >
> > >
> > >
> > >
> > >
> > > On Oct 17, 2013, at 7:48 AM, Mariano Martinez Peck <
> marianopeck at gmail.com> wrote:
> > >
> > > > Hi guys,
> > > >
> > > > In my application I have many many places in which I need to submit
> the surrounding form once an item has been selected from a list or things
> like that. For example, for a "html select", I am relying on
> #beSubmitOnChange (which is deprecated....).
> > > >
> > > > I am now using #tbsButtonGroup and #tbsDropdownMenu (they are inside
> a form with another html selects) and I want to achieve the same. I added a
> > > >
> > > > onClick: 'submit()';
> > > >
> > > > to the tbsDropdownMenu. The form seems to be submitted, but the
> callbacks of my anchors never get called:
> > > >
> > > > Reduced example:
> > > >
> > > > html form: [
> > > > html tbsButtonGroup: [
> > > >               html tbsDropdownButton beDefault;  beExtraSmall; with:
> [html text: 'Filter '; tbsCaret].
> > > >               html tbsDropdownMenu
> > > >                       onClick: 'submit()';
> > > >                       with: [
> > > >                               html tbsDropdownMenuItem: [
> > > >                                       html anchor
> > > >                                               text: 'Selected';
> > > >                                               callback: [self halt.
> ]. ].
> > > >                               html tbsDropdownMenuItem: [
> > > >                                       html anchor
> > > >                                               text: 'Unselected';
> > > >                                               callback: [self halt.
> ]. ].
> > > >                       ]
> > > >       ]
> > > >
> > > > ]
> > > >
> > > > Any ideas?
> > > >
> > > > Thanks
> > > >
> > > > --
> > > > Mariano
> > > > http://marianopeck.wordpress.com
> > > > _______________________________________________
> > > > seaside mailing list
> > > > seaside at lists.squeakfoundation.org
> > > > http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
> > >
> > > _______________________________________________
> > > seaside mailing list
> > > seaside at lists.squeakfoundation.org
> > > http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
> > >
> > >
> > >
> > > --
> > > Mariano
> > > http://marianopeck.wordpress.com
> > > _______________________________________________
> > > seaside mailing list
> > > seaside at lists.squeakfoundation.org
> > > http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
> >
> > _______________________________________________
> > seaside mailing list
> > seaside at lists.squeakfoundation.org
> > http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
> >
> >
> >
> > --
> > Mariano
> > http://marianopeck.wordpress.com
> > _______________________________________________
> > seaside mailing list
> > seaside at lists.squeakfoundation.org
> > http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>
> _______________________________________________
> seaside mailing list
> seaside at lists.squeakfoundation.org
> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>



-- 
Mariano
http://marianopeck.wordpress.com
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.squeakfoundation.org/pipermail/seaside/attachments/20131017/2e3e77e3/attachment-0001.htm


More information about the seaside mailing list