多个菜单中的下拉脚本

时间:2011-06-24 16:07:24

标签: php javascript sql

找不到错误。我有三个连接到SQL服务器的下拉菜单。当我加载页面时,第一个下拉列表已经填满。从第一个下拉列表中选择一个值后,页面将从脚本中调用函数“reload(form)”,并在第二个值中显示新索引。直到它工作正常,但是当我从第二个下拉列表中选择一个值以调用函数“reload2(form)”时,它会刷新整个页面,从第一个和第二个下拉列表中选择的值消失,并且dird下拉列表没有什么都没有。 这是脚本代码:

    <script language=JavaScript>
    function reload(form)
    {
    var  val=document.form.cliente.options[form.cliente.options.selectedIndex].value;
    self.location='indexmm.php?cliente=' + val ;
    }
    function reload2(form)
    {
    var val=document.form.cliente.options[form.cliente.options.selectedIndex].value;
    var val2=document.form.equipos.options[form.equipos.options.selectedIndex].value;
    self.location='indexmm.php?cliente=' + val + '&equipos=' + val2 ;
    }
    </script>

这是我的PHP代码:

    <form method="post" name="form" id="form" action="post.php"> 

<h1>Cliente:
<?php
    echo "<select name='cliente' onchange=\"reload(this.form)\"><option value=''>Seleccione...</option>";   
    while($busq1 = mysql_fetch_array($consultacliente)) { 
        if($busq1['IdCln']==@$cliente){echo utf8_encode("<option selected value='$busq[IdCln]'>$busq1[Cliente]</option>"."<BR>");}
        else{echo utf8_encode("<option value='$busq1[IdCln]'>$busq1[Cliente]</option>");}
        }   
    echo "</select>"
?> 
</h1>


<h1>Equipos:</br></h1>
<?php
echo "<select name='equipos' size='5' style='width:400px' onchange=\"reload2(this.form)\">";
    while($busq3 = mysql_fetch_array($consultaequipos)) {
        if($busq3['IdGn']==@$refaccioness){
            echo utf8_encode("<option selected value='$busq3[IdGn]'>$busq3[Generador]</option>"."<BR>");}
        else{echo utf8_encode("<option value='$busq3[IdGn]'>$busq3[Generador]</option>");}
    }   
echo "</select>"
?>
</h1>

<h1>Refacciones:</br></h1>
<?php
echo "<select name='refacciones' size='20' style='width:400px'>";
    while($busq4 = mysql_fetch_array($consultarefac)) { 
        echo utf8_encode("<option value='$busq4[Descripcion]'>$busq2[Descripcion]</option>");
    }
echo "</select>"
?>

变量$ consultarefac,$ consultacliente,$ consultaequipos是SQL查询。 有什么建议吗?

1 个答案:

答案 0 :(得分:0)

我建议每次有人更改下拉列表时不重新加载页面。我建议只使用AJAX更新当前下拉列表下方的下拉列表。

简单的AJAX调用将用一段html替换围绕以下下拉列表的div。第一个选择将替换div'second'的内容(包括清除第三个下拉列表。第二个选择将替换div'third'的内容。

使用ajax抓取的页面将仅返回适当部分的html代码段。替换函数将对适当的页面使用ajax来替换相应div的内容。

<div id="first">
    <select name=first onchange="replace1()"></select>
    <div id="second">
        <select name=second onchange="replace2()"></select>
        <div id="third">
            <select name=third></select>
        </div>
    </div>
</div>