使用ajax提交表单来更新数据库

时间:2014-08-01 08:24:58

标签: php ajax forms mysqli

尝试传递单个隐藏数据以使用ajax更新我的sql。但它不起作用,也没有错误信息。

HTML

<form id="hidden_form">
<input type="hidden" id="id_hidden" name="id_hidden">
<input type="submit" value="Accept">
</form>

AJAX

$("#hidden_form").submit(function(){
    $.ajax({
        type: "GET",
        url: "milestoneAccept.php",
        data: $("#hidden_form").serialize(), // serializes the form's elements.
        success: function(data){

            $("#add_success").html(data);
            $("#add_err").html("");

        }
    });

});

PHP

$id = $_GET['id_hidden'];

$sql = "UPDATE projectmilestone SET accepted=1 WHERE ID='$id'";

if (mysqli_query($con,$sql)){
    echo "Project Accepted";
} else {
    echo mysqli_error();
}
?>

3 个答案:

答案 0 :(得分:2)

您没有阻止提交事件的默认行为,因此,在发送Ajax请求之前,表单正在提交并重新加载页面。

// Capture the event object argument
$("#hidden_form").submit(function(evt){
  $.ajax({…});
  // Prevent the default behaviour
  evt.preventDefault();

答案 1 :(得分:0)

我建议你试试这个:创建一个正确的表单标签(带有动作和方法),不要在JS中硬编码

HTML

<form id="hidden_form" method="GET" action="milestoneAccept.php">
    <input type="hidden" id="id_hidden" name="id_hidden">
    <input type="submit" value="Accept">
</form>

的JavaScript

$("#hidden_form").on('submit', function onSubmitForm(ev){

    var $form = $(this);

    $.ajax({
        // retrieve automatically values from the form itself, don't hardcode them in JavaScript
        type: $form.attr('method')
        url: $form.attr('action'),
        data: $form.serializeArray(),
        success: function(data){
            // use this to see what result you get in your console
            console.log(data);

            $("#add_success").html(data);
            $("#add_err").html("");
        }
    });

    // don't let the browser submit the form itself
    ev.preventDefault();

});

此外,请确保在页面中存在表单后执行JavaScript代码。如果您不确定(在xxx.submit(function(){ xxx })行之前),请尝试此操作:

console.log( $("#hidden_form").length );

如果你得0,那就不行了。尝试使用以下代码包装此代码:

$(document).ready(function onReady(){
    // your code goes here
});

此外,使用Firebug或Chrome DevTools并查看网络面板:您应该在那里看到您的请求,可能您有404错误(找不到页面)或其他。

答案 2 :(得分:-1)

试试这个

HTML

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<form id="hidden_form">
<input type="text" id="id_hidden" name="id_hidden">
<input type="button" value="Accept" onclick="saveform()">
</form>
<div id="add_success" >#</div>

AJAX

 <script type="text/javascript">
function saveform() {
    $.ajax({
        type: "GET",
        url: "milestoneAccept.php", 
        data: $("#hidden_form").serialize(), // serializes the form's elements.
        success: function(data){

            $("#add_success").html(data);
            $("#add_err").html("");

        }
    });
} 
</script>

PHP

$id = $_GET['id_hidden'];

$sql = "UPDATE projectmilestone SET accepted=1 WHERE ID='$id'";

if (mysqli_query($con,$sql)){
    echo "Project Accepted";
} else {
    echo mysqli_error();
}