根据第一个结果填充第二个下拉列表 [英] Populate 2nd dropdown based on results of 1st
问题描述
此刻，我使用动态选择填充下拉列表.我想做的是显示第二个下拉列表，并根据第一个下拉列表的结果显示结果.我不知道该怎么办，一直在寻找答案，但无济于事.我已经包含了用于填充第一个菜单的代码，如果您需要其他代码，请告诉我.如果有人可以帮助编写代码，我非常愿意看一下jQuery或javascript.非常感谢
<form id="boxform" method="post" class="webform" name="boxform" />
<label for="company">Select a Company:</label>
<select name="company" id="company" />
<option SELECTED VALUE="">Select a Company</option>
<?php
do {
?>
<option value="<?php echo $row_Recordsetcust['customer']?>"><?php echo $row_Recordsetcust['customer']?></option>
<?php
}
while ($row_Recordsetcust = mysql_fetch_assoc($Recordsetcust));
$rows = mysql_num_rows($Recordsetcust);
if($rows > 0)
{
mysql_data_seek($Recordsetcust, 0);
$row_Recordsetcust = mysql_fetch_assoc($Recordsetcust);
}
?>
</select>
更新:
这是我目前拥有的php格式的第二个下拉列表的代码，如果可以帮助继续进行下去，谢谢
<label for="boxrtnaddress">Select Address</label>
<select name="boxrtnaddress" id="boxrtvaddress" />
<option SELECTED VALUE="">Select Delivery Address</option>
<?php
while ($row_rs_select_address2 = mysql_fetch_assoc($rs_select_address2))
{
$value=$row_rs_select_address2['address1_com']. " ". $row_rs_select_address2['address2_com']. " ". $row_rs_select_address2['address3_com']. " ". $row_rs_select_address2['town_com']. " ". $row_rs_select_address2['postcode_com'];
$caption=$row_rs_select_address2['address1_com']. " ". $row_rs_select_address2['address2_com']. " ". $row_rs_select_address2['address3_com']. " ". $row_rs_select_address2['town_com']. " ". $row_rs_select_address2['postcode_com'];
echo "<option value=\"", $value, "\">", $caption, "</option>";
}
?>
</select>
+++++++++++++解决方案++++++++++
<script language="javascript" type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
<script language="javascript" type="text/javascript">
$(function() {
$("#company").change(function() {
if ($(this).val()!="") $.get("getOptions.php?customer=" + $(this).val(), function(data) {
$("#divId").html(data);
});
});
});
</script>
getOptions.php
<?php
$customer = mysql_real_escape_string( $_GET["customer"] ); // not used here, it's the customer choosen
$con = mysql_connect("localhost","root","");
$db = "sample";
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db($db, $con);
$query_rs_select_address2 = sprintf("SELECT * FROM company_com where idcode_com = '$customer'");
$rs_select_address2 = mysql_query($query_rs_select_address2, $con) or die(mysql_error());
$row_rs_select_address2 = mysql_fetch_assoc($rs_select_address2);
$totalRows_rs_select_address2 = mysql_num_rows($rs_select_address2);
$address=$row_rs_select_address2['address1_com']. " ". $row_rs_select_address2['address2_com']. " ". $row_rs_select_address2['address3_com']. " ". $row_rs_select_address2['town_com']. " ". $row_rs_select_address2['postcode_com'];
echo '<select name="customer">'.'<option value="">Select delivery address</option>'.'<option value="address">'.$address.'</option>'.'</select>';
?>
这可能有所帮助，这是一个小提琴
根据选择的第一个select动态添加select，代码杂乱无章，因此我不会将其发布在这里:)
您可以查看以下内容以更好地了解其工作原理
change 在select的选定值更改时触发
is(':empty')检查是否将新创建的div选择到div
将被添加为空为空
修改 我会给您提示，希望您可以填写其余的代码...
首先，您需要处理第一个下拉列表中的change事件，当值更改时，您可以对服务器执行ajax，get，post请求，获取结果并填充第二个下拉列表，这是一个有用的stackoverflow链接，可能会对您有所帮助
$("#firstDD").change(function(){
var value = $(this).val();//get the changed value of first dd(drop down)
//now do a post request
$.post("results.php",{data:value},function(data){
//get the values here and populate the second drop down
});
});
在您的results.php
从第一个下拉列表中获取值
$val = $_POST['data'];
//now do the sql queries to fetch desired result
//and echo the results back
echo $results ;
这是一些有用的链接
http://www.prodevtips.com/2008/08/15/jquery-json-with-php-json_encode-and-json_decode/
http://api.jquery.com/jQuery.post/
http://www.factsandpeople.com/facts-mainmenu-5/26-html-and-javascript/89-jquery-ajax-json-and-php
At the moment I using a dynamic select to populate a dropdown. What I would like to do is display a 2nd dropdown with results based on the selection of the first. I have no idea how to go about this and have searched for an answer but to no avail. I have included the code I using to populate the first menu, and if you need any further code, please let me know. I am quite willing to look at jQuery or javascript if someone could help with the code. Many thanks
<form id="boxform" method="post" class="webform" name="boxform" />
<label for="company">Select a Company:</label>
<select name="company" id="company" />
<option SELECTED VALUE="">Select a Company</option>
<?php
do {
?>
<option value="<?php echo $row_Recordsetcust['customer']?>"><?php echo $row_Recordsetcust['customer']?></option>
<?php
}
while ($row_Recordsetcust = mysql_fetch_assoc($Recordsetcust));
$rows = mysql_num_rows($Recordsetcust);
if($rows > 0)
{
mysql_data_seek($Recordsetcust, 0);
$row_Recordsetcust = mysql_fetch_assoc($Recordsetcust);
}
?>
</select>
UPDATE:
This is the code for the 2nd dropdown in php format that I have at the moment if it would help move on with this, thanks
<label for="boxrtnaddress">Select Address</label>
<select name="boxrtnaddress" id="boxrtvaddress" />
<option SELECTED VALUE="">Select Delivery Address</option>
<?php
while ($row_rs_select_address2 = mysql_fetch_assoc($rs_select_address2))
{
$value=$row_rs_select_address2['address1_com']. " ". $row_rs_select_address2['address2_com']. " ". $row_rs_select_address2['address3_com']. " ". $row_rs_select_address2['town_com']. " ". $row_rs_select_address2['postcode_com'];
$caption=$row_rs_select_address2['address1_com']. " ". $row_rs_select_address2['address2_com']. " ". $row_rs_select_address2['address3_com']. " ". $row_rs_select_address2['town_com']. " ". $row_rs_select_address2['postcode_com'];
echo "<option value=\"", $value, "\">", $caption, "</option>";
}
?>
</select>
+++++++++++++SOLUTION++++++++++
<script language="javascript" type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
<script language="javascript" type="text/javascript">
$(function() {
$("#company").change(function() {
if ($(this).val()!="") $.get("getOptions.php?customer=" + $(this).val(), function(data) {
$("#divId").html(data);
});
});
});
</script>
getOptions.php
<?php
$customer = mysql_real_escape_string( $_GET["customer"] ); // not used here, it's the customer choosen
$con = mysql_connect("localhost","root","");
$db = "sample";
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db($db, $con);
$query_rs_select_address2 = sprintf("SELECT * FROM company_com where idcode_com = '$customer'");
$rs_select_address2 = mysql_query($query_rs_select_address2, $con) or die(mysql_error());
$row_rs_select_address2 = mysql_fetch_assoc($rs_select_address2);
$totalRows_rs_select_address2 = mysql_num_rows($rs_select_address2);
$address=$row_rs_select_address2['address1_com']. " ". $row_rs_select_address2['address2_com']. " ". $row_rs_select_address2['address3_com']. " ". $row_rs_select_address2['town_com']. " ". $row_rs_select_address2['postcode_com'];
echo '<select name="customer">'.'<option value="">Select delivery address</option>'.'<option value="address">'.$address.'</option>'.'</select>';
?>
it may help, here is a fiddle
that dynamically appends a select based on the selection of first select the code is messy and dirty so im not gonna post it here :)
you can have a look at the following to better understand the working
change triggers when the selected value of a select is changed
is(':empty') checks whether the div to which the newly created `select
is to be appended is empty or not
Edit i'll give you hints hopefully you'll fill in the rest of code...
first of all what you need to do is handle the change event of your first drop down and when the value changes you can do an ajax, get, post request to your server, fetch the results and populate the second drop down, here is a useful stackoverflow link that may help you
$("#firstDD").change(function(){
var value = $(this).val();//get the changed value of first dd(drop down)
//now do a post request
$.post("results.php",{data:value},function(data){
//get the values here and populate the second drop down
});
});
in your results.php
get the value from first drop down
$val = $_POST['data'];
//now do the sql queries to fetch desired result
//and echo the results back
echo $results ;
here are some useful links
http://www.prodevtips.com/2008/08/15/jquery-json-with-php-json_encode-and-json_decode/
http://api.jquery.com/jQuery.post/
http://www.factsandpeople.com/facts-mainmenu-5/26-html-and-javascript/89-jquery-ajax-json-and-php
这篇关于根据第一个结果填充第二个下拉列表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
