使用数据库查找插入表单值而不刷新页面答案

【问题标题】：insert form values with database lookup without refreshing the page使用数据库查找插入表单值而不刷新页面
【发布时间】：2013-11-23 15:40:27
【问题描述】：

我有一个包含 5 个字段的表单。姓名姓出生日期职业出生地

当用户填写姓名和姓氏时，我希望从数据库中填写表单的其余部分，而无需刷新页面或用户执行任何操作。

我正在使用 php 和 jquery。

这是我的html页面：

<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
<input type="text" name="name" id="name">
<input type="text" name="lastname" id="lastname">
<input type="text" name="occupation" id="occupation">
<input type="text" name="date_of_birth" id="date_of_birth">
<input type="text" name="place_of_birth" id="place_of_birth">
<script type="text/javascript">

$('#lastname').blur(function () 
    {
        var name = $("#name").val();
        var lastname = $("#lastname").val();

    $.ajax({
        url: "get.php",
        type: "POST", 
        data: "name="+name+"&lastname="+lastname,
        success: function(data)
        {
            if (data == "Error")
            {
                alert("error-1"+data);
            }
            else
            {
                var fields = data.split(",");
                if (fields.length < 3) 
                {
                    alert("error-2"+data);  
                }
                else
                {

                    $("#occupation").val(fields[0]);
                    $("#date_of_birth").val(fields[1]);
                    $("#place_of_birth").val(fields[2]);

                }
            }
        },
        error: function(xhr, status, error) 
        {
               alert("error-3"+data);    
        }   
    });
});
</script>
</body>
</html>

这里是php页面：

<?php
$name= $_REQUEST['name'];
$lastname= $_REQUEST['lastname'];
if($name == "mike" && $lastname = "brown")
{
    echo  "cook,1980-10-10,NYC";
}

?>

现在可以了。

【问题讨论】：

阅读api.jquery.com/jQuery.ajax

标签： php jquery mysql ajax forms

【解决方案1】：

-- 编辑 #1 也许这个例子可以帮助你理解如何使用它：

$.ajax({
    url: "phppage.php",
    type: "POST", // Or get as you like
    data: "name="+name+"&lastname="+lastname,
    success: function(data)
    {
        // As i said, here in "data" you have what the server returned
        // You can return the last field delimited with a , and do something like:
        if (data == "Error")
        {
            // If something went wrong in your Database or invalid "name" or "last name"
            // You can return "Error" in the PHP page so the Javascript know something is wrong
            // and handle this error
        }
        else
        {
            var fields = data.split(",");
            if (fields.length < 3) {
                // As above.
                // Something went wrong or invalid response
            }
            else
            {
                // In fields array you have what server said.
                            // Here you can reload the page, change page do what you want
            }
        }

    },
    error: function(xhr, status, error) 
    {
        // Error here
    }   
});

它将姓名和姓氏传递给服务器并等待响应，例如：字段1,字段2,字段3

PHP 页面应该类似于..

<?php

// Connect to the server
// Send query to the server

if ($isEverythingOK) {
    echo $field1 . "," . $field2 . "," . $field3;
}
else {
    echo "Error";
}

?>

Ajax - jQuery Ajax + PHP 页面

一个 php 页面，您可以在其中传递 5 个字段，将其添加到数据库中，如果一切正常，则返回“OK”之类的内容，如果出现问题，则返回错误。

例子

$.ajax({
    url : "URL to PHP page",
    success : function (data) {
          if (data === "OK") { /* all ok, here you can update the page to show the new field */ alert("OK"); }
          else { /* Error */ alert("Error"); }
    },
    error : function (xhr, status, error) {
        // Request error
        alert("Error");
    }
});

【讨论】：

我只需要将姓名和姓氏字段传递到 php 页面，然后从数据库中获取字段的其余值。
我添加了一个可以帮助你的例子
现在可以使用了，谢谢！我已经发布了上面的工作代码。出于某种原因，特殊字符不会通过 get.php 处的 if 语句