Question

我有两个下拉列表。第二个是根据第一个中选择的值填充的。我正在使用Double Combo Script Credit by JavaScript Kit来做到这一点（我用javascript非常糟糕）。我用它来过滤我的Mysql数据库的结果。问题是，当用户应用过滤器时，我希望他看到他应用的内容（当页面刷新或用户转到其他页面时） - 这些值应该在两个下拉列表中被视为已选中。我无法弄清楚我应该在哪里举办活动或其他活动。

我在php session的第二个下拉列表中保存子类别值：

if (isset($_SESSION['subcat']) && !isset($_GET['subcat'])){
$color= $_SESSION['subcat'];
}
elseif (!isset($_SESSION['subcat']) && isset($_GET['subcat']))
{
    $_SESSION['subcat'] = mysql_real_escape_string($_GET['subcat']);
    $color= $_SESSION['subcat'];
    }
    elseif (isset($_SESSION['subcat']) && isset($_GET['subcat'])){
        unset($_SESSION['subcat']); 
        $_SESSION['subcat'] = mysql_real_escape_string($_GET['subcat']);
        $color= $_SESSION['subcat'];
        }
else {
    $color= "";
    };

我可以在第一个下拉列表中回显选择，基于会话值并且可以正常工作，但是当页面刷新并且我不知道我应该在哪里时，不会生成第二个下拉列表echo'selected =“selected”'或者一切只能用javascript完成？请帮忙。

代码：

<div class="filter">
<form method="get" name="doublecombo" action="" id="filterform"  >
<select name="example" id="exampl" size="1" onChange="redirect(this.options.selectedIndex)">
<option>All kinds</option>
<option>Women</option>
<option>Men</option>
</select>
<select name="subcat" size="1" id="subcategory">
<option value="lists.php">All colors</option>
</select>
<input type="button" name="test" value="Filter" onClick="go()">
</p>

  <script>
  <!--

  /*
  Double Combo Script Credit
  By JavaScript Kit (www.javascriptkit.com)
  Over 200+ free JavaScripts here!
   */

     var groups=document.doublecombo.example.options.length
     var group=new Array(groups)
     for (i=0; i<groups; i++)
     group[i]=new Array()
     group[0][0]=new Option("All colors","list.php")

     group[1][0]=new Option("Pink","list.php?subcat=1 ")
     group[1][1]=new Option("White","list.php?subcat=2")
     group[1][2]=new Option("Green","list.php?subcat=3")


        group[2][0]=new Option("Black","list.php?subcat=12")
        group[2][1]=new Option("Blue","list.php?subcat=13")
        group[2][2]=new Option("Grey","list.php?subcat=14")
        group[2][3]=new Option("Brown","list.php?subcat=15")



        var temp=document.doublecombo.subcat

        function redirect(x){
        for (m=temp.options.length-1;m>0;m--)
        temp.options[m]=null
        for (i=0;i<group[x].length;i++){
        temp.options[i]=new Option(group[x][i].text,group[x][i].value)
         }
        temp.options[0].selected=true
         }

      function go(){
     location=temp.options[temp.selectedIndex].value
      }
       //-->
       </script>
       </form></div>

Answer 1

您可以设置一个cookie来保存所选的值，因此如果用户选择了该选项并刷新，您将检查该cookie是否存在，然后相应地填充菜单。

更新

如果用户刷新页面，这将存储选定的值并重新填充选择菜单。

首先选择添加onkeup：

<select name="example" id="exampl" size="1" onchange="redirect(this.options.selectedIndex)" onkeyup="redirect(this.options.selectedIndex)">

用于第二次选择，并按如下方式检查更改

<select name="subcat" size="1" id="subcategory" onchange="checks(this)" onkeyup="checks(this)">

现在找到行temp.options[0].selected=true并在下面直接添加

    createCookie("selected_option_1", x, 0);
     if(x==0){
       eraseCookie("selected_option_2");
     }

然后在脚本块底部添加这两个新函数

 // checks if the Second Select has changed
 function checks(oWhich){
   createCookie("selected_option_2", oWhich.selectedIndex, 0);
 }

// repopulate the options base on selection thats saved in the cookies 
onload = function(){

if(readCookie("selected_option_1") != null) {

   redirect(document.doublecombo.example.options.selectedIndex = readCookie("selected_option_1"));

   if(readCookie("selected_option_2") != null) {
     document.doublecombo.subcat.options.selectedIndex = readCookie("selected_option_2");
  }
}

  }

最终要使这些函数/脚本工作，你需要

//我正在使用的功能的cookie脚本位于下面，包括这个，你可以。 http://www.quirksmode.org/js/cookies.html#script

现在，一旦表单像往常一样提交了GET所选的值，并且重新进行了菜单，一旦完成了cookie，就可以删除它们。

Answer 2

如果你使用的是jQuery，你可以在页面上尝试一个简短的PHP标签：

jQuery('#MyDropDown').val('<?php echo $_SESSION['MyStoredValue']; ?>');

如果您不使用jQuery而是直接使用JavaScript，则会产生相同的效果：

document.getElementById("MyDropDown").value = '<?php echo $_SESSION['MyStoredValue']; ?>'

根据php会话值自动选择两个下拉列表值

2 个答案: