使用选择从数据库自动填充创建下拉列表

Question

我正在编写一个保险表格：您选择您拥有的公司，然后它将访问数据库中的电话号码和其他值并填写下面的表格。然后他们只需要输入他们需要的信息。

$hostname = "";
$username = "";
$password = "";
$database = "";

mysql_connect($hostname,$username,$password);
@mysql_select_db($database) or die( "Unable to select database");

//getFN();
function getFN()
{
    $query = "SELECT first FROM contacts";
    $FNresult = mysql_query($query); 


    $dropdown = "<select name='contacts'>";

    while( $row = mysql_fetch_assoc($FNresult) )
    {
        $dropdown .= "\r\n<option value='{$row['first']}'>{$row['first']}</option>";
        echo getLN();
        //$last .="\r\n<option value='{$row['last']}'>{$row['last']}</option>";
        //echo $last;
    }

    $dropdown .= "\r\n</select>";

    echo $dropdown;
}

// Get last name
function getLN()
{
    $query = "SELECT last FROM contacts";
    $LNresult=mysql_query($query);

    $last;
    while($row = mysql_fetch_assoc($LNresult))
    {
        $last = "{$row['last']}";
    }
    echo $last;
} //end getLN


mysql_close();
?>

<select name="fdsfd" onchange="document.getElementById('first').value = this.value">
    <!-- <option value="<?//php echo $first; ?>"></option>-->
</select>

<form action="insert.php" method="post">
    First Name: <input type="text" id="first" value=""><br>
    Last Name: <input type="text" id="last"><br>
    Phone: <input type="text" id="phone"><br>
    Mobile: <input type="text" id="mobile"><br>
    Fax: <input type="text" id="fax"><br>
    E-mail: <input type="text" id="email"><br>
    Web: <input type="text" id="web"><br>
    <input type="Submit">
</form>

Answer 1

您需要结合使用 AJAX 和 PHP，并根据来自服务器的响应 (DHTML) 动态修改页面源代码。

首先，您需要了解 AJAX：SO question on how AJAX works

其次，你需要了解 jQuery：tutorial here

现在，

您需要一种让 javascript 唯一标识您的元素的方法。给它一个 id 属性，以及你给它的名字。

一旦元素具有id 属性，jQuery 就可以使用 ID 选择器访问它

$("#[id]")...

您的后台脚本应该从您的下拉列表中获取一个唯一标识符，从您的数据库中获取数据并填充一个 JSON 编码的数组。

然后您可以填充表单元素。

<?php
// background script

// retrieve data based on $_POST variable, set to $returnArray

/****************************
 * the structure of returnArray should look something like
 *     array(
 *         'first' => firstName,
 *         'last' => lastName,
 *         etc.
 *     )
 */

echo json_encode($returnArray);

===========================

<!-- javascript on client-side -->
<script language="javascript" type="text/javascript">
    $("#dropdown").on('change', function() {
        $.post("backgroundScript.php", {
                uid: $(this).val()
            } function(data) {
               $("#first").val(data.first);
               $("#last").val(data.last);
               // etc.
            }, 'json'
        );
    });
</script>