根据下拉列表中的选定值从数据库填写表单值

时间:2016-08-23 11:09:24

标签: javascript php jquery ajax

我有这样的表单,如果用户从下拉列表中选择了任何值,那么我想根据该值从数据库中获取详细信息。假设用户从下拉列表中选择了名称2 ,那么我应该自动填写字段地址&与名称2 相关的手机。此外,我无法获得 $ _ POST [' name'] 的值。 我试过但没有运气。这是我的代码。请建议我是否有任何其他方法来实现它。谢谢。

HTML

<select id="name" name="name">
    <option value="1">Name 1</option>
    <option value="2">Name 2</option>
    <option value="3">Name 3</option>
    <option value="4">Name 4</option>
    <option value="5">Name 5</option>
</select>

<input type="text" name="address" id="address" />
<input type="text" name="phone" id="phone" />

的jQuery

$(document).ready(function () {
    $('#name').change(function(){
        var name = $(this).val();
        var dataString = "name=" + name;
        alert (dataString);
        $.ajax ({
            type: "POST",
            url: "test.php",
            data: dataString,
            dataType: json,
            success: function(data) {
                $('#address').val(data.address);
                $('#phone').val(data.phone);
            }
        });
    });
});

PHP

<?php

ini_set('display_errors',1); // enable php error display for easy trouble shooting
error_reporting(E_ALL); // set error display to all

include "connect.php";

if (ISSET($_POST['name'])) {

    $ref = $_POST['name'];

    $query = $con->query("SELECT * FROM test WHERE id = '$ref' LIMIT 1");
    $row = $query->fetch_assoc();

    $address = $row['address'];
    $phone = $row['phone'];

    $json = array('address' => $address, 'phone' => $phone);
    echo json_encode($json);
}

$con->close();
?>

4 个答案:

答案 0 :(得分:3)

HTML

<form>
<select id="name" name="name">
    <option value="1">Name 1</option>
    <option value="2">Name 2</option>
    <option value="3">Name 3</option>
    <option value="4">Name 4</option>
    <option value="5">Name 5</option>
</select>
</form>

<input type="text" name="address" id="address" />
<input type="text" name="phone" id="phone" />

的jQuery

$('#account_head').change(function(){
    var name = $(this).val();
    var dataString = "name=" + name;
    $.ajax ({
        type: "POST",
        url: "get_results.php",
        data: dataString,
        dataType: 'json',
        success: function(data) {
            // console.debug(data);
            $('#agent').val(data.agent);
            $('#tin').val(data.tin);
            $('#address').val(data.address);
        }
    });
});

PHP

<?php
if (ISSET($_POST)) {
    $ref = $_POST['name'];

    $query = $con->query("SELECT * FROM test WHERE id = '$ref' LIMIT 1");
    $row = $query->fetch_assoc();

    $address = $row['address'];
    $phone = $row['phone'];
    $json = array('address' => $address, 'phone' => $phone);
    echo json_encode($json);
}
?>

答案 1 :(得分:1)

您应该使用另一种方法来显示值,.val(value)只需在元素的标记中设置一个值。 您可以改用.text(value).html(value)

答案 2 :(得分:0)

更改此

where Date >= date_trunc('month', now() - ('12 months'::interval))


    0 CoreFoundation    CFRelease + 1128
    1 cardloan  __37+[AddressBookPage getAddressBookList]_block_invoke     (AddressBookPage.m:92)
    2 cardloan  __37+[AddressBookPage getAddressBookList]_block_invoke   (AddressBookPage.m:92)
    3 libdispatch.dylib __dispatch_call_block_and_release + 24
    4 libdispatch.dylib __dispatch_client_callout + 16
    5 libdispatch.dylib __dispatch_root_queue_drain + 2140
6 libdispatch.dylib __dispatch_worker_thread3 + 112
7 libsystem_pthread.dylib   _pthread_wqthread + 1092

答案 3 :(得分:0)

dataType: json,必须为dataType: "json",

使用val()显示检索到的数据将完美无缺;我只会质疑<input>是否适合输出