Question

我可以使用jQuery和PHP脚本向MYSQL数据库添加和删除表单中的记录，但是我无法更新从数据库中检索到的数据。文件结构如下：

index.php是一个带有jQuery函数的文件，它显示使用save.php文件向MYSQL添加新数据的表单，并且所有记录的列表都是视图而没有刷新页面（调用load-list.php来查看索引中的所有记录） .php工作正常，save.php保存表单中的数据）

- ＆GT;删除是一个从index.php调用的函数，用于从MySQL数据库中删除记录（函数调用delete.php工作正常）

- ＆GT; Update是一个从index.php调用的函数，通过从MySQL表中恢复特定记录，使用update-form.php更新数据，（工作正常）

问题在于更新数据 update-form.php到update.php（in 写入更新查询 MySQL的）

我已经尝试了很多方面 - 最后我发现数据没有从update-form.php转移到update.php; jQuery AJAX函数中存在一个小问题，即它没有将数据传输到update.php页面。在调用update.php页面时，它没有进入该页面。

请在下面找到链接下载35kb（无病毒保证）的所有文件：

download mysmallform files in ZIPped format, including mysql query

<pre>
<body>
<div class="container">  
    <form id="submit" method="post">  
        <fieldset>  
            <legend>Enter Information</legend>  
            <label for="Name">Name    : </label>  
        <input id="name" class="text" name="name" size="20" type="text">
            <label for="gender">Gender : </label>  
            <input id="gender" class="text" name="gender" size="20" type="text">
            <label for="dob">DoB     : </label>  
            <input id="dob" class="date" name="dob" size="20" type="text">  <button> Add  </button>  
        </fieldset>
    </form>  
    <div class="name_list"></div>
    <div class="update_form"></div>  
</div>

<script type="text/javascript">
$(document).ready(function(){
    function loadList(){
        $.ajax({
            url: "load-list.php",
            cache: false,
            success : function(html){
                $(".name_list").html(html);
            }
        });
    }
    loadList();

    $("form#submit").submit(function() {
        // we want to store the values from the form input box, then send via ajax below
        var x=window.confirm("Are you sure you want to delete this item?")
        var name = $('#name').attr('value');
        var gender = $('#gender').attr('value');
        var dob = $('#dob').attr('value');
        if (x==true){
                     $.ajax({
                type: "POST",
                url: "save.php",
                data: "name="+ name +"& gender="+ gender +"& dob="+ dob,
                success: function(){
                    loadList();
                               }
                 });
                 }
        return false;
    });

    $(".delete_button").live("click", function(){
        //this deletes the row clicked on with an alert and then reloads the list
        var id = $(this).attr("id");
        var x=window.confirm("Are you sure you want to delete this item?")
        if (x==true){
            $.ajax({
                type: "POST",
                url: "delete.php",
                data: "id="+ id,
                success: function(){
                    loadList();
                }
            });
        }
        return false;
    });

    $(".update_button").live("click", function(){
        //this loads the update form
        var id = $(this).attr("id");
        $.ajax({
            url: "update-form.php",
            data: "id="+ id,
            cache: false,
            success: function(html){
                $(".update_form").html(html);
            }
        });
        return false;
    });

      $("#updateform").ajaxform("submit",function(){
    //$("form#update").live("submit",(function() {
    // we want to send via ajax and empty the html from the update_form element
        var name = $('#name_update').attr('value');
        var gender = $('#gender_update').attr('value');
        var dob = $('#dob_update').attr('value');
        var id = $('#id').attr('value');
        alert (name);
            $.ajax({

                url: "update.php",
                type: "POST",
                data: "name="+ name +"& gender="+ gender +"& dob="+ dob,
                error: function(){
                    alert('Error loading document');
                             },
                success: function(){
                alert (" i  am  in success below load list ");
                    $(".update_form").empty();
                    loadList();

                        }

            });
        return false;
    });
});
</script> </body>
</pre>

Answer 1

我将您的代码复制粘贴到php文件中，并在javascript中获得“$ is not defined”错误。我看看你的代码告诉我你还没有包含jquery文件。尝试使用firefox作为浏览器和firebug进行调试，以避免出现这样的小问题。

Answer 2

你知道，JQuery也有一个post函数。使用普通的html处理请求没有错。并非一切都必须通过听众来运行。

function updateQuery(){

    var name = $('#name_update').attr('value');
    var gender = $('#gender_update').attr('value');
    var dob = $('#dob_update').attr('value');

    $.post('update.php', { name:name, gender:gender, dob:dob }, function(data){
        if(data == 'success')
            {
                $(".update_form").empty();
                loadList();

            }
            else
            {
                alert('fail');
            }
    });
}

Answer 3

有时jquery不喜欢单变量$ .post请求。你试过传递第二个空变量吗？

我没看过你的代码。如果添加和删除工作，那么更新也应该除非你忽略了一些明显的东西，或者你只是因为我发生的同一个变量垃圾而崩溃。

我无法使用PHP和jQuery将表单数据更新到MySQL

3 个答案: