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

Posted

技术标签:

【中文标题】我无法使用 PHP 和 jQuery 将表单数据更新到 MySQL【英文标题】:I am not able to update form data to MySQL using PHP and jQuery 【发布时间】:2011-02-04 16:15:22 【问题描述】:

发生的情况是,我能够使用 jQuery 和 php 脚本向 mysql 数据库添加和删除表单中的记录,但我无法更新从数据库中检索到的数据。文件结构如下:

index.php 是一个带有 jQ​​uery 函数的文件,其中显示了使用 save.php 文件将新数据添加到 MYSQL 的表单,所有记录的列表无需刷新页面即可查看(调用 load-list.php 以查看索引中的所有记录.php 可以正常工作,并且 save.php 可以保存表单中的数据)

-> Delete 是一个从 index.php 调用的函数,用于从 MySQL 数据库中删除记录(调用 delete.php 的函数可以正常工作)

-> Update 是一个从 index.php 调用的函数,通过从 MySQL 表中检索特定记录来使用 update-form.php 更新数据,(工作正常)

问题在于从 update-form.php 到 update.php(在 为哪个更新查询编写 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>

【问题讨论】:

最好将代码放在这里,而不是放在压缩文件中。 嘘,最近这里的新手很讨厌。 我们需要一个新的关闭理由:“帮助吸血鬼”(slash7.com/2006/12/22/vampires)。 @Jimson:请不要一遍又一遍地问同样的问题。 @Alan:当 OP 没有提供太多帮助时,这并不讨厌。这不是一个好问题。没有什么私人的。 找到问题并粘贴可能导致问题的代码? 【参考方案1】:

我将您的代码复制粘贴到一个 php 文件中,并在 javascript 中收到“$ 未定义”错误。我看你的代码告诉我你没有包含 jquery 文件。尝试使用 firefox 作为浏览器并使用 firebug 作为调试器以避免此类小问题。

【讨论】:

是的,这已经奏效了!非常感谢。对于延迟回复,我深表歉意。【参考方案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');
            
    );

【讨论】:

【参考方案3】:

有时 jquery 不喜欢单变量 $.post 请求。您是否尝试过传递第二个空变量?

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

【讨论】:

但是先生,您能建议或指导我完成这项工作吗,有什么方法可以完成我的工作...请先生 @Jimson,你是 OP 吗?停止抱怨并开始编程:catb.org/~esr/faqs/hacker-howto.html 请注意,我并不是在坚持,据我所知,我只是为此寻求帮助。如果我的英语伤害了你,我感到非常抱歉。无论如何 Mr.pinaki 帮助我解决了这个问题。非常感谢。

以上是关于我无法使用 PHP 和 jQuery 将表单数据更新到 MySQL的主要内容,如果未能解决你的问题,请参考以下文章

Php / Jquery 表单和数据表

表单提交后如何防止页面重新加载 - JQuery

jQuery Mobile:如何正确提交表单数据

将 AJAX/jQuery 添加到简单的 PHP 表单

jQuery 将多维表单数据发送到 PHP 脚本

使用 javascript 没有 jQuery 的简单 ajax 表单