提交表单而不刷新页面

时间:2014-08-14 12:09:17

标签: php jquery ajax

我知道这是一个转发版,我已经查看了大多数关于这个主题的所有其他帖子都使用Ajax,jQuery和那些没有在表单中使用提交按钮的帖子,但是没有一个答案似乎没有工作在我的具体代码上。

我有以下表格:

<ul id="btn_MyJobs" data-role="listview" data-inset="true">
<li id="MyJobs_List" class="push">
  <form name="MyJobs" id="MyJobsForm" action="" method="post">
  <?php do { ?>
    <input type="hidden" name="MyJob" value="<?php echo $row_Recordset1['cargo']; ?>">
    <input type="submit" name="submit" value="<?php echo $row_Recordset1['cargo']; ?>"><br/><br/>
    <?php } while ($row_Recordset1 = mysql_fetch_assoc($Recordset1)); ?>
</form>
</li>
</ul>

我希望将表单提交到下面的代码(在同一页面上),以便我可以在我的WHERE子句中使用SQL Value String:

mysql_select_db($database_Connection, $Connection);
$query_Recordset_MyJobs = "SELECT * FROM jobs WHERE cargo = ".GetSQLValueString($_POST['MyJob'], 'text');
$Recordset_MyJobs = mysql_query($query_Recordset_MyJobs, $Connection) or die(mysql_error());
$row_Recordset_MyJobs = mysql_fetch_assoc($Recordset_MyJobs);
$totalRows_Recordset_MyJobs = mysql_num_rows($Recordset_MyJobs);

但是我想提交表单而不刷新页面,所以当单击提交按钮时,表单将被发送到SQL值字符串,但页面没有刷新或加载。 所以我尝试使用Ajax如下:

<script>
$(function () {
    $('#MyJobsForm').on('submit', function (e) {    

        e.preventDefault();

        $.ajax(
        {
            type: 'post',
            data: $('#MyJobsForm').serialize(),
            success: function (data) 
            {
                alert('form was submitted');
            }
        });
    });
});
</script>

当我运行代码时,它会向我显示警报消息,但是对数据库的调用没有从表单接收数据。我认为Ajax代码有问题,但我无法弄清楚是什么。有人可以帮我提交表格而不刷新页面吗? Ajax不是必需品。

1 个答案:

答案 0 :(得分:0)

下面是一个使用select更改提交表单的ajax调用示例,它将从更改中收到的响应中更改整个页面。你可以使用这样的东西。您不必拥有正式的提交代码。你甚至不需要有表格。您所需要的只是您要提交的数据的值。我建议使用单独的PHP文件实际调用代码,只替换页面的特定部分。

$(document).on('change', '#insurecode', function(){
        var val = $('#groupnumtxt').val(), insure = $('#insurecode').val(), mbid = $('#mbid').val();

        $.ajax({
            type: "POST",
            data: { groupnum: val, insurecode: insure, mbid: mbid }, // serializes the form's elements.
            success: function(data){
                switch(data){
                    $(document).html(data);
                }
            }
        });
    });

$(document).html(data);替换为alert(data),如果它能让您对我所说的内容更加满意。