php - 根据 php session 值自动选择两个下拉列表值

Question

我有两个下拉列表。第二个是根据第一个中选择的值填充的。我正在使用 JavaScript Kit 的 Double Combo Script Credit 来做到这一点(我对 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= "";
    };

我可以根据 session 值在第一个下拉列表中回显选定的，但页面刷新时不会生成第二个下拉列表，我不知道应该在哪里生成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");
     }

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

 // 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

现在，一旦提交了表单，您就可以照常获取选定的值，并重新填充菜单，一旦您完成了 cookie，就可以删除它们。