How do I stop redirection after form submittion?

Question

I had a similar question posted here a few hours ago, just now I got the answer that I should look into using AJAX to do this. Since I want to complete this part of the site today I can't afford to learn AJAX from the basics to do this now.. This shouldn't be something difficult and I thougt that I would be able to do this but I'm not skilled enough...

I have a form, when you click submit, it posts to twitter.com/statuses/update.xml and I need to be able to do so without being redirected there.

Is there an easy way to do this or do I need to learn AJAX?

Thankfull for any answer at all..!

edit:

I'm using this to submit:

$(function() {  
    $("#skikka").click(function() {  
        var dendar = 
            "http://" + 
            $("#usernam").val() + ":" + $("#passwo").val() +
            "@twitter.com/statuses/update.xml";

        $("#formen").attr("action", dendar);
        $("#formen").submit();
        alert(dendar);
        return false;

    });  
});

Answer 1

You could use type="button" instead of type="submit".

Answer 2

Just redirect back to your page in your server-side script. What language are you using?

Answer 3

// post via ajax
$.post(dender, $("#formen").serialize());

Full Example:

$(function() {
$("#skikka").click(function() {
var dendar = "http://" + $("#usernam").val() + ":" + $("#passwo").val() + "@twitter.com/statuses/update.xml";

// post via ajax
$.post(dender, $("#formen").serialize()); 

alert(dendar); return false;

});
});

Answer 4

Here is a quick example using JQuery, which is probably the easiest way to do AJAX without investing too much time learning it. Although it sounds like you'd have to learn a whole other technology (Jquery) it really isn't that hard. Mostly it just involves adding one more javascript include file reference to the page.

    $.post(dendar , $("#formen").serialize());

More Details on AJAX with Jquery here.

Since you are posting back to a different domain, you will have to do a little bit of extra work. Check out this article on using JSONP against twitter.

Also, here is a JQUERY plugin specifically for working against twitter: jTwitter

Answer 5

If you must do it that way ( via click event and without just having the server send a redirect ), you can add an onSubmit event to the form that handles actual submission via ajax and then cancels the event propagation.

Event.observe( 
  $('searchfield').form , 
  'submit' , 
  function( e ){ 
    alert('No YOU' ); 
    /* secretly submit using ajax and clear form */ ; 
    Event.stop( e ) ;
  });

Something like that.