jQuery:保存已选择的选择元素选项

时间:2014-09-28 10:31:05

标签: javascript php jquery mysql

嘿伙计们我想保存用户在我的表单上选择的选项,但我不确定如何做到这一点。

我将简要解释一下我的设置......

我的主页上有这个表格:

<form class="form-home form-search">
<select class="form-control select-box">
                 <option value="make-any">Make (Any)</option>
                 <?php while($make = $makeFilter->fetch(PDO::FETCH_ASSOC))
                 {
                 echo '
                 <option value="'.$make["Make"].'">'.$make["Make"].'</option>
                 ';
                 } ?>
             </select>
 <button href="used-cars.php">Search</button>
</form>

正如您所看到的那样,它使用PHP / MySQL来显示可用的选项。

好吧所以我在另一个页面上有这个表单但是CSS样式略有不同,它包含一些不同的选择元素。

因此,当用户在主页上选择了一个元素时,所有按钮都是href到used-cars.php,其中列出了所有结果。

如何使jQuery保存用户在主页上选择的选项并加载used-cars.php并选择这些选项?

任何例子都会很棒。

EDITED 我的第二个表格示例:

<div class="container con-col-listing">
    <div class="row">
      <div class="col-md-4 col-sm-4">
       <form class="car-finder-container dflt-container">
         <h2 class="h2-finder">Car finder</h2>
         <ul class="toggle-view">
           <li class="li-toggle">
            <h4 class="h4-finder-toggle">Make<span class="glyphicon glyphicon-plus glyph-plus-toggle"></span></h4>
            <div class="panel">
             <select name="make" class="form-control select-box">
                 <option value="make-any">Make (Any)</option>
                 <?php while($make = $makeFilter->fetch(PDO::FETCH_ASSOC)){
                 $selected = $make['make'] == $_GET['make']?'selected="selected"':'';
                 echo '
                 <option value="'.$make["Make"].'">'.$make["Make"].'</option>
                 ';
                 } ?>
             </select>
             <select class="form-control last-select select-box">
                 <option value="model-any">Model (Any)</option>
                 <?php while($model = $modelFilter->fetch(PDO::FETCH_ASSOC))
                 {
                 echo '
                 <option value="'.$model["Model"].'">'.$model["Model"].'</option>
                 ';
                 } ?>
             </select>
            </div>
           </li>
           <li class="li-toggle">
            <h4 class="h4-finder-toggle">Body type<span class="glyphicon glyphicon-plus glyph-plus-toggle"></span></h4>
            <div class="panel">
             <input id="four-by-four-checkbox" class="float-checkbox" type="checkbox"/>
             <label for="four-by-four-checkbox" class="label-checkbox">4x4</label>
             <input id="convertible-checkbox" class="float-checkbox" type="checkbox"/>
             <label for="convertible-checkbox" class="label-checkbox">Convertible</label>
             <input id="coupe-checkbox" class="float-checkbox" type="checkbox"/>
             <label for="coupe-checkbox" class="label-checkbox">Coupe</label>
            </div>
          </li>
          <li class="li-toggle">
            <h4 class="h4-finder-toggle">Transmission<span class="glyphicon glyphicon-plus glyph-plus-toggle"></span></h4>
            <div class="panel">
             <input id="automatic-checkbox" class="float-checkbox" type="checkbox"/>
             <label for="automatic-checkbox" class="label-checkbox">Automatic</label>
             <input id="manual-checkbox" class="float-checkbox" type="checkbox"/>
             <label for="manual-checkbox" class="label-checkbox">Manual</label>
             <input id="semi-auto-checkbox" class="float-checkbox" type="checkbox"/>
             <label for="semi-auto-checkbox" class="label-checkbox">Semi automatic</label>
            </div>
          </li>
        </ul>
         <button href="#" class="btn btn-block car-search-button btn-lg btn-success"><span class="glyphicon car-search-g glyphicon-search"></span> Search cars 
         </button>
         <h4 class="h4-finder"><a href="#">Try our Smart Search </a><span class="glyphicon info-car-search-g glyphicon-info-sign"></span></h4>
       </form>
      </div>

1 个答案:

答案 0 :(得分:1)

最简单的方法是获取请求:

 <form class="form-home form-search" method="GET" action="used-cars.php">
  <select name="make" class="form-control select-box">
  .....
  <button type="submit">Search</button>
 </form>

和used-cars.php:

 var_dump($_GET['make']);

修改

让我们假设你在第一页的表格上:

  <option value="ford">ford</option>
  <option value="pontiac">pontiac</option>
  <option value="fiat">fiat</option>

当您点击used-cars.php上的提交按钮$_GET['make']时,将会选择任何内容,例如fiat

所以现在对used-cars.php你可以这样做:

 <?php while($make = $makeFilter->fetch(PDO::FETCH_ASSOC)){
    $selected = $make['Make'] == $_GET['make']?'selected="selected"':'';
    echo '
     <option '.$selected.' value="'.$make["Make"].'">'.$make["Make"].'</option>
        ';
  } ?>