PHP页面:下拉总是选择第一个值

时间:2013-12-26 05:13:14

标签: javascript php mysql

我的PHP页面上有多个下拉列表,所有内容都是这样创建的:

<?php
//Select values from MySQL Database
$query = "SELECT name FROM Player";
$result = mysql_query($query);

//Show DropDownList
echo '<select name="players" onclick="sortlist(this)">';
while($row = mysql_fetch_assoc( $result ))
{ 
        echo '<option value="'.$row['name'].'">' . $row['name'] . '</option>';   
}
echo '</select>';
?>

现在万一你没注意到我在每个下拉列表上调用了一个javascript函数“sortlist(this)”。此功能只是按字母顺序排序值。您可以查看脚本:

<script>

function sortlist(selElem) {
        var tmpAry = new Array();
        for (var i=0;i<selElem.options.length;i++) {
            tmpAry[i] = new Array();
            tmpAry[i][0] = selElem.options[i].text;
            tmpAry[i][1] = selElem.options[i].value;
        }
        tmpAry.sort();
        while (selElem.options.length > 0) {
            selElem.options[0] = null;
        }
        for (var i=0;i<tmpAry.length;i++) {
            var op = new Option(tmpAry[i][0], tmpAry[i][1]);
            selElem.options[i] = op;
        }
        return;
    }
</script>

我的所有下拉列表都在这样的表单标记内:

<form accept-charset="utf-8" action="" method="post">

脚本运行正常,我按字母顺序排列下拉列表,但每当我选择一个值时,它总是会显示第一个值。

2 个答案:

答案 0 :(得分:3)

尝试这样的事情

<body>
    <select id="select_id" >
        <option value="B">B</option>
        <option value="Z">Z</option>
        <option value="C">C</option>
        <option value="E">E</option>
        <option value="A">A</option>
    </select>
</body> 
<script type="text/javascript">
    function sortlist(selElem) {
        var tmpAry = new Array();
        for (var i=0;i<selElem.options.length;i++) {
            tmpAry[i] = new Array();
            tmpAry[i][0] = selElem.options[i].text;
            tmpAry[i][1] = selElem.options[i].value;
        }
        tmpAry.sort();
        while (selElem.options.length > 0) {
            selElem.options[0] = null;
        }
        for (var i=0;i<tmpAry.length;i++) {
            var op = new Option(tmpAry[i][0], tmpAry[i][1]);
            selElem.options[i] = op;
        }
    return;
    }
    sortlist(document.getElementById('select_id'));
</script>

原因:无论您是选择值还是正在排序并重置所选值,您的脚本始终会对onclick上的选择进行排序。

因此,在渲染选择元素

后,只需调用一次脚本进行排序

答案 1 :(得分:1)

为什么不

$query = "SELECT name FROM Player ORDER BY name ASC";

这个怎么样

function sortlist(elem) {
  arrTexts = new Array();
  for(i=0; i<elem.length; i++)  {
    arrTexts[i] = elem.options[i].text;
  }

  arrTexts.sort();

  for(i=0; i<elem.length; i++)  {
    elem.options[i].text = arrTexts[i];
    elem.options[i].value = arrTexts[i];
  }
}