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

Question

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

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

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= "";
    };

我可以根据会话值在第一个下拉列表中回显 selected 并且有效，但是当页面刷新时不会生成第二个下拉列表，我不知道我应该在哪里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)">

现在找到 Line 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']; ?>'