jQuery Dummy

This should be an easy one. I'm using jQuery to turn a div into a submit button. onClick I need the div to evaluate a callback and then submit the form. I can do one or the other but I'm wasting a lot of time trying to figure out how do both. Been playing with script:, but I don't understand what it is and can't get it to work.

canvas div
        id: divID;
        onClick: ( canvas jQuery ajax callback: [ self goToNextStep ] );
        with: [ canvas text: 'Next' ]

BTW, I'd love suggestions on a good resource or path for understanding jQuery in seaside.

Thanks,
Joel

_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

onClick: (canvas jQuery ajax callback: [ self goToNextStep ]), (canvas
jQuery ajax serializeForm)

(I think)

Julian

On Mon, Jan 4, 2010 at 7:03 AM, Joel Turnbull
<[hidden email]> wrote: _______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

Hmm, thanks Julian, doesn't quite seem to work...nice to know about the comma though.

I'm just going to use submit buttons for now until I have more time.




_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

The best way I've found for things like this is taking advantage of components. From an object-oriented standpoint, you are replacing an element on the page with a new one that has its own functionality.

html div
    style: 'width: 100px; height: 100px; background-color: blue';
    onClick: (html jQuery this html: WACounter new).

Try this out, and you'll understand what I mean.

Also, the commas concatenate javascript code (string), which results from the jQuery stuff; therefore, you can combine them with string functions. A function similar to the one above might return something like this...

$(this).html("blah");

... which will be executed when an event takes place.

RS

---

From: [hidden email]
Date: Mon, 4 Jan 2010 12:49:57 -0500
Subject: Re: [Seaside] jQuery Dummy
To: [hidden email]


Hmm, thanks Julian, doesn't quite seem to work...nice to know about the comma though.

I'm just going to use submit buttons for now until I have more time.

---

Your E-mail and More On-the-Go. Get Windows Live Hotmail Free. Sign up now.
_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

> I'm just going to use submit buttons for now until I have more time.

I assume that the answer would be simple, but I don't quite get your question:

- What does "turn a div into a submit button" mean?
- What should "evaluate a callback" exactly do?
- Where is "the form to submit"?

Lukas

--
Lukas Renggli
http://www.lukas-renggli.ch
_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

Thanks for the responses guys and sorry for the delay in responding,
I'm on a pretty tight deadline right now. But you're helping me
understand the jQuery stuff.

> I assume that the answer would be simple, but I don't quite get your question:
>
> - What does "turn a div into a submit button" mean?

We didn't want to use a html submit button because apparently they are
hard to style consistently across browsers. We wanted to stay away
from using  imageButtons as well ( but that's what we're currently
doing )

So what I mean is, we take a div and style it to look like a button
and make it clickable. I want the exact functionality of a submit
button though, i.e. the ability to assign callbacks, and it should
submit a form.

> - What should "evaluate a callback" exactly do?

We compile a group of components into what we call a PurchaseFlow.
Each component takes care of a different step in an e-commerce
purchase process: choose the product, enter the shipping address,
enter the credit card information, etc

So the callback evaluates a method that increments an index that the
PurchaseFlow keeps to load the appropriate component in the flow.

> - Where is "the form to submit"?

The button div would be inside the form that I want to submit. Does
that answer your question?
_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

>> - What does "turn a div into a submit button" mean?
>
> We didn't want to use a html submit button because apparently they are
> hard to style consistently across browsers. We wanted to stay away
> from using  imageButtons as well ( but that's what we're currently
> doing )

In this case I would use #button instead of #submitButton. An
alternative would be to use an #anchor, but I would refrain from using
a #div for actions. Search engines, mobile users and people with
cognitive disabilities will thank you :-)

> So what I mean is, we take a div and style it to look like a button
> and make it clickable. I want the exact functionality of a submit
> button though, i.e. the ability to assign callbacks, and it should
> submit a form.

The simplest thing you can do from within the form is:

     html div onClick: 'submit()'; with: 'Submit'

That doesn't use AJAX and doesn't require an external Javascript library.

Lukas

--
Lukas Renggli
http://www.lukas-renggli.ch
_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside