使用ajax提交表单

时间:2013-11-15 19:25:15

标签: php jquery ajax post

我正在尝试使用jquery向数据库提交值。我是ajax的新手,但我需要用ajax来做。

到目前为止,我已经完成了我的PHP代码

 function insertSeries()
{
    $options = array(
        'user' => $_POST['user'],
        'email' => $_POST['email'],
        'summary' => $_POST['summary'],
        'due_date' => $_POST['due_date'],
        'problem_type' => $_POST['problem_type'],
        'status' => $_POST['status']
    );

    $sql = "insert into ticket_summary('user','email','summary','due_date','problem_type','status') Values (?,?,?,?,?,?)";
    $result = mysql_query($sql, $options) or die('Could not insert data');


}

我的HTML代码是

  <?php
   include 'eric_api.php';
  ?>

  <!DOCTYPE html>

   <html>
<head>
    <title></title>
    <script src="js/jquery.js"></script>
    <script src="js/api_calls.js"></script>
    <link rel="stylesheet" href="css/normalizer.css" />
    <link rel="stylesheet" href="css/style.css" />
</head>

<body>
    <div class="wrapper">
        <h1>Ticketing System</h1>
        <div>
            <div id="ticket_form_wrapper">
                <form  id="insert_ticket" method="post" action="">
                    <p>
                        <label for="user">User</label>
                        <br />
                        <input type="user" id="user" class="post_fields" />
                    </p>
                    <p>
                        <label for="email">Email</label>
                        <br />
                        <input type="email" id="email" class="post_fields" />
                    </p>
                    <p>
                        <label for="summary">Summary</label>
                        <br />
                        <input type="summary" id="summary" class="post_fields" />
                    </p>
                    <p>
                        <label for="due_date">Due Date</label>
                        <br />
                        <input type="due_date" id="due_date" class="post_fields" />
                    </p>
                    <p>
                        <label for="problem_type">Problem Type</label>
                        <br />
                        <input type="problem_type" id="problem_type" class="post_fields" />
                    </p>
                    <p>
                        <label for="status">Status</label>
                        <br />
                        <input type="status" id="status" class="post_fields" />
                    </p>
                    <p>
                        <input type="submit" id="submit" value="Submit" />
                        <input type="button" onclick="window.location='index.php'" value="Go to List"/>
                        <div class="form_result"> </div>
                    </p>
                </form>
            </div>

        </div>
</body>
  </html>

这是我使用jquery的ajax

$('#insert_ticket').submit(function(e){
    var postData = $(this).serialize();
    alert(postData);

    $.ajax({
        type: 'POST',
        url: 'http://localhost/api/eric_api.php?q=insertseries',
        data: postData,
        success: function(response){
            $('#insert_ticket').find('.form_result').html(response);
        },
        error: function(){
            alert('error');
        }
    });
    e.preventDefault();
});

我不知道我做错了什么。任何帮助将不胜感激

2 个答案:

答案 0 :(得分:1)

不要干扰表单的提交事件,而是干扰点击事件。要对现有设置进行最小的更改,只需将单击处理程序添加到表单提交按钮即可。处理程序内部的第一件事,调用e.preventDefault()。您必须在处理程序中显式选择表单以序列化数据。然后,将现有的ajax调用移动到该处理程序中,它应该可以正常工作。另外,请确保您实际上在PHP代码中的某处调用了insertSeries()。

干杯

答案 1 :(得分:0)

请回复一些评论,以便我们帮助您找出问题所在。这是您使用正确的mysqli语法查看函数的方式。

注意:您创建的插入字符串就像用于mysqli一样,但您的参数绑定更像pdo。我不确定你想要使用哪一个,所以我选择mysqli。我个人更喜欢PDO,但是......所以如果你愿意,我可以用它来重写。 Link to the PDO Prepare Function that also shows some binding.

 // this is your database connection for mysqli 
 $mysqli = new mysqli('localhost', 'my_user', 'my_password', 'world');

 function insertSeries($mysqli)
 {
    $options = array(
        'user' => $_POST['user'],
        'email' => $_POST['email'],
        'summary' => $_POST['summary'],
        'due_date' => $_POST['due_date'],
        'problem_type' => $_POST['problem_type'],
        'status' => $_POST['status']
    );

    $sql = "insert into ticket_summary('user','email','summary','due_date','problem_type','status') 
                                    Values (?,     ?,        ?,         ?,            ?,        ?)";


    if ( $stmt = $mysqli->prepare($sql) )
    { 
        $stmt->bind_param("ssssss", $options['user'], $options['email'],
                                     $options['summary'], $options['due_date'], 
                                     $options['problem_type'], $options['status']);

        $success = $stmt->execute();

        if ($success) { print "query worked"; }
              else    { print "query failed"; }
    } 
 }