Thanks, it was indeed a js-error, but not in the script I called.
The magic:
"data: this.serialize(),"
should be
"data: jQuery(this).serialize(),"
and that's it.
Additional I can say that "return false" is only needed at the end of
onsubmit (at least it works with opera nd ff, no ie here to test it,
maybe someone can verify that).
The working form-tag would be something like this:
<form id="signUpForm" name="signUpForm" action="/trainingHelper/user/
signUp"
method="post"
onsubmit="jQuery.ajax({type:'POST',
dataType: 'json',
data: jQuery(this).serialize(),
url:'/trainingHelper/user/signUp',
success:function(data,textStatus){
alert(data.reason);
},
error:function(XMLHttpRequest,textStatus,errorThrown) {
}
});
return false;">
Cheers
Finn
MorningZ schrieb:
> Yeah, you're right... my example wasn't correct or working
>
> I will note, that if you have any sort of javascript error, then the
> code will never reach the "return false" and stop the action from
> happening..... meaning it will continue to do a full post to the other
> page
>
> on top of that advice..... i'd suggest using Mike Alsup's excellent
> ajax form plugin
>
> http://www.malsup.com/jquery/form/
>
> it does all that plumbing for you automatically......
>
>
>
>
> On Oct 15, 2:10�pm, "[EMAIL PROTECTED]"
> <[EMAIL PROTECTED]> wrote:
> > Hi,
> >
> > thanks for your response.
> >
> > Do you mean something like this?
> >
> > jQuery.ajax({type:'POST',
> > � � � � � � � � � dataType: 'json',
> > � � � � � � � � � data: this.serialize(),
> > � � � � � � � � � url:'/trainingHelper/user/signUp',
> > � � � � � � � � � success:function(data,textStatus) {
> > � � � � � � � � � � � �signUpResult(data);
> > � � � � � � � � � � � �return false;
> > � � � � � � � � � },
> >
> > error:function(XMLHttpRequest,textStatus,errorThrown) {
> > � � � � � � � � � � � � return false;
> > � � � � � � � � � � �}
> > � � � � � � � � � });
> >
> > With this I get the same behaviour :/
> >
> > Any other suggestions?
> >
> > Cheers
> > Finn
> >
> > MorningZ schrieb:
> >
> > > Yuck
> >
> > > Break out the $.ajax code out of the markup, that's just making it
> > > tons more difficult to debug
> >
> > > $(document).ready(function() {
> > > � � $.ajax({
> > > � � � �type:'POST',
> > > � � � �dataType: 'json',
> > > � � � �data: this.serialize(),
> > > � � � �url:'/trainingHelper/user/signUp',
> > > � � � �success:function(data,textStatus) {
> > > � � � � � �signUpResult(data);
> > > � � � �},
> > > � � � �error:function(XMLHttpRequest,textStatus,errorThrown){
> > > � � � �}
> > > � � });
> > > � �return false;
> > > });
> >
> > > breaking out out that way makes it easier to see that you are missing
> > > "return false" from both the "success" and "error" callbacks (which is
> > > needed)
> >
> > > On Oct 14, 9:15 pm, Finn Herpich <[EMAIL PROTECTED]>
> > > wrote:
> > > > Hi folks,
> >
> > > > I've searched the Internet for a while but couldn't find a reason why my
> > > > problem occurs.
> >
> > > > So, I'm working on a jQuery-plugin for Grails and I'm struggling with an
> > > > AJAX-submit of a form.
> >
> > > > The attached code, generated by the plugin, leads the browser (Opera
> > > > 9.6, Firefox 3.0.3 working with jQuery 1.2.6) to show the result on a
> > > > new page instead of calling the success-function.
> >
> > > > Maybe I'm just to tired at the moment (3 am here), but I can't see my
> > > > mistake. Hopefully someone can help me =)
> >
> > > > Cheers
> > > > Finn
> >
> > > > <!-- snip -->
> > > > <script src="/trainingHelper/js/jquery/jquery-1.2.6.js"
> > > > type="text/javascript">
> > > > </script>
> > > > </head>
> > > > <body>
> > > > <form id="signUpForm" name="signUpForm"
> > > > action="/trainingHelper/user/signUp" method="post"
> > > > onsubmit="$.ajax({type:'POST',dataType: 'json',data: this.serialize(),
> > > > url:'/trainingHelper/user/signUp',success:function(data,textStatus){signUpResult(data);},error:function(XMLHttpRequest,textStatus,errorThrown){}});return
> > > > false">
> > > > <button type="submit">Sign Up</button>
> > > > </form>
> > > > </body>
> > > > </html>
