如何根据下拉菜单选择

时间:2015-08-13 09:05:54

标签: javascript php mysql

我正在开发一个MySQL更新表单并努力制作一个下拉选择框,它将使用来自mysql的数据自动填充表单的其余部分。基本上它是一个由用户及其凭据组成的表。当使用此表单更新第二个表时,我希望能够从下拉菜单中选择用户名,并让该选择自动填充其余凭据,然后再转到表单的其余部分。

以下是设置选择和输入的一些代码:

<?php 
//DB Connect
...
// Get array of users   
$select_users = "SELECT * FROM users";

if (!mysql_query($select_users)) {
die('Error: ' . mysql_error());
} //all good so far

$select_users_result = mysql_query($select_users);
?>

<select id="selectbox" name="navn" onchange="populateData(this.value)">
   <option>USER</option>
<?php   

$klubb = array();
$klasse = array();
while ($row = mysql_fetch_array($select_users_result, MYSQL_ASSOC)) {

 echo "<option value='" . $row['navn'] . "'>". $row['navn'] ."</option>";

//echoing these vars will output all rows for the column specified...
$klubb[] = $row['klubb'];   
$klasse[] = $row['klasse']; 

}

mysql_close();

?>  
</select>

<tr>
    <td>Klubb: </td>
    <td><input id="klubb" type="text" name="klubb" class="cred_input" />

    </td>
</tr>
<tr>
    <td>Klasse: </td>
    <td><input id="klasse" type="text" name="klasse" class="cred_input" /> </td>
</tr>

然后是一些javascript

<script>

function populateData()
        {
            //alert('in populateData');
            y = document.getElementById("selectbox");
         document.getElementById("klasse").value =  [y.selectedIndex];
        document.getElementById("klubb").value = [y.selectedIndex];

        }   
</script>

根据我在下拉菜单中的选择,此处的结果是<td>klubb<td>klasse中的数字。

如何在javascript中将数组与索引号连接起来,以便显示数组中的实际数据?

我一直在寻找几天的答案,但找不到任何能回答我问题的答案。

感谢您的帮助!

4 个答案:

答案 0 :(得分:1)

那么你可以使用AJAX。

有关如何使用Mysql This的AJAX和PHP脚本的教程可以帮助您。

首先,您需要创建一个PHP脚本,以收集填写表单所需的数据。

设置每次在下拉列表中选择内容时触发的AJAX,并在您创建的PHP脚本上传递其值。

在您的AJAX脚本上,将其配置为调用您为检索数据而创建的PHP脚本(将根据您的下拉列表在此脚本中抛出一个值)。

收到AJAX电话的回复后,只需使用简单的Javascript根据收到的数据填写表单。

另一个提示是使用JQuery,因为您可以更轻松地设置AJAX请求。

答案 1 :(得分:0)

在这里使用AJAX

populateData()函数中,使用ajax发送请求以检索用户凭据&amp;通过Javascript,使用检索到的值填充文本框。

答案 2 :(得分:0)

您可以将两个php数组作为javascript对象回显,然后访问populate函数中的那些(这是快速解决方案)。但更好的方法是在实际数据中使用ajax

<script>
  var klasse = <?=json_encode($klasse)?>
  var klubb = <?=json_encode($klubb)?>
</script>

答案 3 :(得分:0)

你可以使用Ajax。把它作为你的表格。

C:\Windows\assembly

您的AJAX请求: -

<?php 
//DB Connect
...
// Get array of users   
$select_users = "SELECT * FROM users";

if (!mysql_query($select_users)) {
die('Error: ' . mysql_error());
} //all good so far

$select_users_result = mysql_query($select_users);
?>

<select id="selectbox" name="navn" onchange="populateData(this.value)">
   <option>USER</option>
<?php   

$klubb = array();
$klasse = array();
while ($row = mysql_fetch_array($select_users_result, MYSQL_ASSOC)) {

 echo "<option value='" . $row['navn'] . "'>". $row['navn'] ."</option>";

//echoing these vars will output all rows for the column specified...
$klubb[] = $row['klubb'];   
$klasse[] = $row['klasse']; 

}

mysql_close();

?>  
</select>

<div id="some_container">
</div>

<强> file.php

<script type="text/javascript">
$('select').on('change', function() {
  var selectedVal = this.value; // or $(this).val()
   $(document).ready(function() {
      $.ajax({    //create an ajax request to load_page.php
        type: "GET",
        url: "file.php?selectedVal="+selectedVal,             
        dataType: "html",   //expect html to be returned                
        success: function(response){   
            $("#some_container").html(response);            
        }
    });
});
});
</script>

在你的file.php中,通过<?php echo ' <tr> <td>Klubb: </td> <td><input id="klubb" type="text" name="klubb" class="cred_input" value="$phpValueHere"/> </td> </tr> <tr> <td>Klasse: </td> <td><input id="klasse" type="text" name="klasse" class="cred_input" value="$phpValueHere> </td> </tr>'; ?> 获取selectedVal的值,然后在提取回显示这些输入框中的数据后从表中提取数据。