2015-05-19 50 views
0

我想根据我在另一select元素(下拉框)中选择的内容更改select元素中的选项。JQUERY根据另一个select元素的输入动态地填充“Select”选项

我在我的PHP页面上有两个选择框(RUNS和SAMPLES)。我打算做的是在第二个选择框中根据使用第一个选择框中选择的选项对数据库执行的查询更改选项。

我在我的数据库中有一个连接“SAMPLES”到“RUNS”的表格。第一个选择框在页面加载时由一组“RUNS”填充。我希望属于所选RUN的'SAMPLES'填充到SAMPLES框中。

的HTML会是这样的

<select name='run_id' id='run_id> 
    <option value='1'>RUN 1</option> 
    <option value='2'>RUN 2</option> 
    <option value='4'>RUN 3</option> 
    <option value='5'>RUN 4</option> 
</select> 

后端表 “sample_runs” 已列run_id和sample_name。我有一个PHP脚本如下,

<?php 
mysql_connect("localhost","uname","pwwd"); 
mysql_select_db("dbname"); 
$run_id = $_GET['run_id']; 
$sql = "select distinct sample_name from samples where run_id = '$run_id'"; 
$rsd = mysql_query($sql); 
while($rs = mysql_fetch_array($rsd)){ 
    echo '<option value='.$rs['sample_name'],'>'.$rs['sample_name']."</option>"; 
} 
?> 

我可以修改的PHP脚本(容易的部分),但能有人与我分享一些代码如何基于在操作中选出的run_id填充样品名称选项框。

非常感谢您的帮助。

+0

不推荐使用'mysql'方法,并且允许原始输入到您的查询中,这很危险,因为它会冒SQL注入的风险。 –

+0

猜猜我应该使用PDO,但jQuery部分的解决方法是什么 – chuckg1979

+0

你有一个小的错字在你的HTML - 你忘了''' –

回答

0

如果您的数据集足够小,您可以在页面加载时发送所有数据。通过构建一个代表PHP中的整个数据集的JSON对象来实现这一点。您可以使用PHP的json_encode函数来执行此操作:http://php.net/manual/en/function.json-encode.php

一旦建立了一个JSON字符串,就需要将它发送给一些JavaScript来处理基于所选run_id的样本名称选项的填充。这里有一个很好的讨论:How to pass variables and data from PHP to JavaScript?

最后,您需要编写JavaScript来执行必要的DOM操作来更改第二个HTML选择框的内容。以下是一个示例:Adding options to select with javascript

如果您的数据集太大而无法在单个请求中发送,则需要构建REST API以在选择每个运行时为其提供数据。

祝你好运!

相关问题