根据下拉列表中的选定值从数据库填写表单值
I've a form like this and if the user selected any value from the dropdown then I want to fetch the details from the database based on that value. Suppose say if the user selected Name 2 from the dropdown then I should automatically fill the fields address & phone that are relevant to Name 2. Also I'm unable to get the value $_POST['name']. I've tried but no luck. Here is my code. Please suggest me if is there any other way to achieve it. Thank you.
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();
?>
我有一个这样的表单,如果用户从下拉列表中选择了任何值,那么我想获取详细信息 来自基于该值的数据库。 假设用户从下拉列表中选择了名称2 strong>,那么我应该自动填写字段地址&amp; 与名称2 strong>相关的手机 strong>。 此外,我无法获得值 $ _ POST ['name'] strong>。
我尝试过但没有运气。 这是我的代码。 请建议我是否有任何其他方法来实现它。 谢谢。 p>
HTML p>
jQuery p>
PHP P>
&lt; select id =“name”name =“name”&gt;
&lt; option value =“1”&gt;名称1&lt; /选项&gt;
&lt;选项值=“2”&gt;名称2&lt; /选项&gt;
&lt;选项值=“3”&gt;名称3&lt; / option&gt;
&lt; option value =“4”&gt;名称4&lt; / option&gt;
&lt; option value =“5”&gt;名称5&lt; / option&gt;
&lt; / select&gt;
&lt; input type =“text “name =”address“id =”address“/&gt;
&lt; input type =”text“name =”phone“id =”phone“/&gt;
code> pre>
$(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);
}
});
});
});
代码> PRE>
&LT; PHP
ini_set( '的display_errors',1); //启用php错误显示,以便轻松解决问题
error_reporting(E_ALL); //将错误显示设置为全部
include“connect.php”;
if(ISSET($ _ POST ['name'])){
$ ref = $ _POST ['name']; \ n
$ query = $ con&gt; query(“SELECT * FROM test WHERE id ='$ ref'LIMIT 1”);
$ row = $ query-&gt; fetch_assoc();
$ address = $ row ['address'];
$ phone = $ row ['phone'];
$ json = array('address'=&gt; $ address,'phone'=&gt; $ phone);
echo json_encode($ json);
}
$ con&gt; close();
?&gt;
code> pre>
div>
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);
}
?>
You should use another method to display the values, .val(value)
just sets a value in the element's tag.
You could use .text(value)
, .html(value)
instead.
Change this
dataType: json,
$('#address').val(data.address);
$('#phone').val(data.phone);
to
dataType: 'json',
$('#address').html(data.address);
$('#phone').html(data.phone);
dataType: json,
needs to be dataType: "json",
Showing the retrieved data using val() will work perfectly fine; I'll just question whether an <input>
is suitable for output.