trying to submit php form using jquery

Question

I am having two problems.

First: Trying to submit this form using jquery. When I hit submit nothing happens, no data is submited but everything else works.

Second: When I click submit the message appears and then when I hit close the box closes, how can I reload the popup div so that when the link is clicked again it doesn't show the message or the last action.

<script type="text/javascript">
$(document).ready(function(){ 
    $('#popbox').click(function(){
        $('#form').submit(function(){
            $.post('url.php', function(data){
                var message = 'some text';
                $('#popbox').html('message');
            });
            return false;
        });
        $('#closeForm').click(function(){
            $('#popbox').fadeOut(); 
        });
    }); 
}); 
</script>

HTML Code:

<div id="popbox">
    <form id="form" method="post" action="" >
        <input type="radio" name="option" value="text1" />text1 <br>
        <input type="radio" name="option" value="text2" />text2<br>
        <br><input type="submit" name="sendData" value="send"/>
    </form>
    <div style="margin:auto; border:1px gray groove ; padding:2px 7px 2px 5px; clear:both; width:30px;border-radius:5px;"><a id="closeForm">close</a></div>
</div>

Is there a reason you are binding to the form's submit event inside the click event handler for the #popbox link? The problem with this is that if the link is clicked more than once, you will be adding more than one submit event handler to the form. — Jasper
– Jasper, Commented Jan 24, 2012 at 0:23

Jasper · Accepted Answer · 2012-01-24 00:20:42Z

1

You have to add the forms data to the AJAX request. To do this we can use jQuery's .serialize() function:

        $.post('url.php', $(this).serialize(), function(data){
            var message = 'some text';
            $('#popbox').html('message');
        });

Docs for .serialize(): http://api.jquery.com/serialize
Docs for $.post(): http://api.jquery.com/jquery.post

answered Jan 24, 2012 at 0:20

Jasper

76.1k14 gold badges153 silver badges148 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

trying to submit php form using jquery

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related