jquery form submission

Question

I am using jQuery+JSON combination something like this:

test.php:

<script type="text/javascript" src="coupon.js"></script>

<form action='_test.php' method='post' class='ajaxform'>
 <input type='text' name='txt' value='Test Text'>
 <input type='submit' value='submit'>
</form>

<div id='testDiv'></div>

_test.php:

<?php
      // Code here to deal with form submitted data.
      $arr = array( 'testDiv' => 'Form is successfully submitted.' );
      echo json_encode( $arr );
?>

coupon.js:

jQuery(document).ready(function(){

    jQuery('.ajaxform').submit( function() {

        $.ajax({
            url     : $(this).attr('action'),
            type    : $(this).attr('method'),
            dataType: 'json',
            data    : $(this).serialize(),
            success : function( data ) {
                        for(var id in data) {
                            jQuery('#' + id).html( data[id] );
                        }
                      }
        });

        return false;
    });

});

Now what i wanted is that when a successful form is submitted then without any page refresh a message should be displayed under the div testDiv. I was hoping that this script would help but when a form is being submitted then the page goes to .../_test.php and displays a white blank page except the following -

{"testDiv":"Form is successfully submitted."}

Firebug does not report any error with any of the scripts.Please help.Thanks in advanvce

The same can be seen at http://174.132.194.155/~kunal17/devbuzzr/deals/5-discount-on-all-guitars. Click on "grab coupon" link and then click on submit inside the pop up.

Answer 1

I went to the link you provided, but the coupon.js script that I found ends with "return true," not "return false." Have you tried changing that to "return false"?