Question

I have used a jquery UI tabs plugin in my page and in one of the tab i have put a form. SO for example , the tab calls a page form.php which has the form tag of html. Now form.php uses ajax and jquery to submit the form. Does this sound feasible.

    $(document).ready(function(){

    $("form#formdata").submit(function() {

            var str = $("#formdata").serialize();
            $.ajax({
            type: "POST",
            url: "submit.php",
            data: $("#formdata").serialize(),
            success: function(msg){
                     alert(msg);
                    }
    });

return false;
});

});

SO the above code comes in my form.php

The form gets submitted but , not via ajax, and am directed to submit.php
I want to reflect the result in my UI tabs itself.

Please suggest..thanks

EDIT : i put preventdefault() and return false , but it did not help..

Answer 1

Finally i got it working.

This is what i did.

in my UI tabs code

<div id="tabs">
            <ul>
                <li><a href="link.html">Link1</a></li>
                <li><a href="form.html">Data</a></li>
            </ul>
</div>

The form.html contained the form details and from there i was using ajax.

SO to correct it i used the form details on the same page under a div like this

<div id="tabs">
                <ul>
                    <li><a href="link.html">Link1</a></li>
                    <li><a href="#form">Data</a></li>
                </ul>

<div id = "form">
//form details here
</div>

    </div>

And used the ajax jquery code on this page.

Thanks to all who replied to my question and special thanks to @cheekysoft

Hope this comes handy and useful..