使用PHP(jQuery / AJAX)向MySQL插入数据

9
我看过很多教程,但它们都很混乱。为了做我想做的事情,我不知道如何使用这些教程中现有的东西并使它们按照我想要的方式工作。
我有一个非常简单的表单,包含一个文本框、标签和提交按钮。当用户输入表单后,点击提交,我想使用php和ajax(带有jquery)将表单结果插入到mysql数据库中。
请问有人能向我展示如何实现这一点吗?只需要一些非常基础的内容让我开始。感谢任何帮助。
谢谢。

就PHP而言,通过AJAX提交的数据与通过常规表单提交的数据是无法区分的。它只是一个GET/POST调用。 - Marc B
@Lucifer 请注意,Ajax 跨域请求有一定的复杂性。 - KJYe.Name
2个回答

20

嗨,这里只是一个快速的示例,展示了如何实现:

HTML 代码:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <title>Quick JQuery Ajax Request</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

        <!-- include the jquery lib -->
        <script type="text/javascript" src="jquery.js"></script>
        <script type="text/javascript">
            var ajaxSubmit = function(formEl) {
                // fetch where we want to submit the form to
                var url = $(formEl).attr('action');

                // fetch the data for the form
                var data = $(formEl).serializeArray();

                // setup the ajax request
                $.ajax({
                    url: url,
                    data: data,
                    dataType: 'json',
                    success: function() {
                        if(rsp.success) {
                            alert('form has been posted successfully');
                        }
                    }
                });

                // return false so the form does not actually
                // submit to the page
                return false;
            }
        </script>

    </head>
    <body>

        <form method="post" action="process.php"
              onSubmit="return ajaxSubmit(this);">
            Value: <input type="text" name="my_value" />
            <input type="submit" name="form_submit" value="Go" />
        </form>

    </body>
</html>

process.php脚本:

<?php

function post($key) {
    if (isset($_POST[$key]))
        return $_POST[$key];
    return false;
}

// setup the database connect
$cxn = mysql_connect('localhost', 'username_goes_here', 'password_goes_here');
if (!$cxn)
    exit;
mysql_select_db('your_database_name', $cxn);

// check if we can get hold of the form field
if (!post('my_value'))
    exit;

// let make sure we escape the data
$val = mysql_real_escape_string(post('my_value'), $cxn);

// lets setup our insert query
$sql = sprintf("INSERT INTO %s (column_name_goes_here) VALUES '%s';",
                'table_name_goes_here',
                $val
);

// lets run our query
$result = mysql_query($sql, $cxn);

// setup our response "object"
$resp = new stdClass();
$resp->success = false;
if($result) {
    $resp->success = true;
}

print json_encode($resp);
?>

请注意,这些内容都没有经过测试。但愿它能对你有所帮助。


2
哦哇!非常感谢,@ZeSimon。 :) - anon271334

4

jQuery 部分通常相当简单。它只是将普通的表单操作重定向到 Javascript 处理程序上。$.post 很容易使用,你只需使用 .serialize() 将现有表单值打包成字符串即可:

<form id="example">
<input name="textbox" ...>
<input type=submit name="submitbuttonname" value="submit"
   onClick="$.post('save.php', $('form#example').serialize())">

在 PHP 方面,您只需通过 $_POST 接收内容并将其保存到数据库中(使用旧的 mysql_ 函数也是可能的,只是更加繁琐):

$db = new PDO("mysql:...");

if ($_POST["submitbuttonname"]) {

   $q = $db->prepare("INSERT INTO save (textbox, label) VALUES (?, ?)";
   $q->execute(array($_POST["textbox"], $_POST["label"]));

你是认真的吗?这就像普通插入一样容易。谢谢!:-D - anon271334
@Lucifier:是的,jQuery将其转换为普通的POST请求。这就是为什么每个人都喜欢它的原因。 - mario
@Lucifier 我相信PDO支持的PHP版本是>= 5.1.0,请确保你的服务器支持它。 - KJYe.Name
@kjy112:自PHP 5.0以来,它作为PECL模块可用,并且还有一个针对PHP4(和PHP5.0)的PDO仿真。请参见http://xpdo.org/或upgradephp。 - mario
1
很酷,我只是在另一页上已经有的mysql东西上使用了它 ;) :) - anon271334
关于这个例子的后续部分,与常规表单提交有技术上的区别吗?我看不出任何区别。 - user2757572

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接