jquery表单提交

时间:2010-09-21 18:00:45

标签: html forms

我正在使用类似这样的jQuery + JSON组合:

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;
    });

});

现在我想要的是,当提交一个成功的表单然后没有任何页面刷新时,应该在div testDiv下显示一条消息。 我希望这个脚本会有所帮助,但是当提交表单时,页面会转到... / _ test.php并显示一个白色的空白页,除了以下内容 -

{“testDiv”:“表单已成功提交。”}

Firebug不报告任何错误与任何脚本。请帮助。谢谢你的推荐

同样可以在http://174.132.194.155/~kunal17/devbuzzr/deals/5-discount-on-all-guitars看到。点击“抓取优惠券”链接,然后点击弹出窗口中的提交

1 个答案:

答案 0 :(得分:0)

我转到你提供的链接,但是我发现的coupon.js脚本以“return true”结尾,而不是“return false”。您是否尝试将其更改为“返回错误”?