动态下拉列表选择使用ajax从db填充文本字段

时间:2013-08-19 16:50:15

标签: php mysql ajax

我有2个文件。 html.php和getuser.php

在html.php中,我有一个动态下拉列表,其中包含来自mysql数据库的id。 在getuser.php中,我的代码应该采用所选的下拉值并返回公司名称,其中id与下拉列表中的id值相同。

你可以在jsfiddle中看到文件(在js区域!):

 html.php 

http://jsfiddle.net/qHvZM/1/

 getuser.php 

http://jsfiddle.net/Ez9Hs/


我想要达到的目标: db具有以下详细信息:

cb_dealerid = 001,002,003,004

cb_bedrijfsnaam = Joop BV,Kelly Ltd,Johan Ltd,Peter BV

当您从下拉值002中选择时,它应该在适当的区域Kelly有限公司中说明。

感谢您的帮助!

1 个答案:

答案 0 :(得分:0)

  

您有一个带有选择字段的表单,其中填充了用户数据库,然后在选择用户时,您希望该用户的公司名称显示在同一页面上而不重新加载表单。

html.php:

<script>
//AJAX request function
function createRequestObject(){
    var requestObject;
    requestObject = (window.ActiveXObject) ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();
    return requestObject;
}

//AJAX needed var for request object
var http = createRequestObject();

//AJAX check for exsiting value for column in table in the database
function showUser(str){
    if (str==""){
        document.getElementById("txtHint").innerHTML="";
        return;
    }
    http.open("get","getuser.php?q="+str);//you may need to put in full path to your page such as "http://youdomain.com/getuser.php?q="
    http.onreadystatechange = AJAXresponseAction;
    http.send(null);
}

//AJAX function to run on status change
function AJAXresponseAction(){
    if(http.readyState == 4){
        var response = http.responseText;
        //update element with AJAX response text
        document.getElementById("txtHint").innerHTML=response;
    }
}
</script>
<?php
// Load Joomla! configuration file
require_once('configuration.php');
// Create a JConfig object
$config = new JConfig();
// Get the required codes from the configuration file
$server = $config->host;
$username   = $config->user;
$password   = $config->password;
$database = $config->db;
// Tools dropdown
$con = mysql_connect($server,$username,$password);
mysql_select_db($database);
$sql = "SELECT cb_dealerid FROM cypg8_comprofiler";
$result = mysql_query($sql);
?>
<form>
    <select name='cb_dealerid' onchange='showUser(this.value)'>
        <?php while ($row = mysql_fetch_array($result)) { ?>
        <option value="<?php print $row['cb_dealerid'];?>"><?php print $row['cb_dealerid'];?></option>
        <?php } ?>
    </select>
</form>
<br>
<div id="txtHint"><b>Person info will be listed here.</b></div>

getuser.php:

<?php
$q=$_GET["q"];
// Load Joomla! configuration file
require_once('configuration.php');
// Create a JConfig object
$config = new JConfig();
// Get the required codes from the configuration file
$server = $config->host;
$username   = $config->user;
$password   = $config->password;
$database = $config->db;

$con = mysqli_connect($server,$username,$password,$database);
if (!$con){
    die('Could not connect: ' . mysqli_error($con));
}

mysqli_select_db($con,$database);

//********************************************************************//
// ALWAYS MAKE SURE TO ESCPAE STRINGS WHEN USING VARIABLES IN QUERIES //
//********************************************************************//

$q = mysqli_real_escape_string($con,$q);

$sql="SELECT * FROM cypg8_comprofiler WHERE cb_dealerid = '".$q."' LIMIT 1";

$result = mysqli_query($con,$sql);

$row = mysqli_fetch_array($result);

//If a table is needed build it on the html page for easier coding.
print $row['cb_dealerbedrijfsnaam'];

mysqli_close($con);
?>