0

カテゴリのドロップダウンがあります。ユーザーがドロップダウンから任意のカテゴリを選択すると、2番目のドロップダウンが表示されます。カテゴリに関連する製品のリストが表示されます（jQuery ajaxを介して）。

ユーザーが製品のドロップダウンから任意のエントリをクリックすると、同じページにリダイレクトされますが、GETクエリが表示されます。

例えば：

page.php?category=3&product=6

そのページのユーザーが、カテゴリのドロップダウンと製品のドロップダウンを自動選択するにはどうすればよいですか？

  <label>Category</label>
     <select id="category">
       <option value="0">Please select a category</option>
        <?php
           $SQL = "SELECT * FROM category";
           $query = mysql_query($SQL);
           while ($cat = mysql_fetch_assoc($query)) {
              echo "<option value='{$cat['id']}'>{$cat['name']}</option>";
             }
         ?>
     </select>
     <select id="product"> </select>

    $("#category").change(function() {
        var category =  $(this).val();
        $('#product').append($("<option></option>").attr("value","0").text("Please Select Product"));
        $.getJSON(host + "/ajax_select_product.php?categoryid=" + category, function(data) {
            $.each (data, function (index, element) {
                $('#product').append($("<option></option>").attr("value",data[index].id).text(data[index].name));
            });
        });
    });

​
    $("#product").change(function() {
        var product = $("#product :selected").val()
        var category =  $("#category :selected").val()
        window.location = "page.php?category=" + category + "?product=" + product;
    });
4

1 に答える 1

1

次の方法でこれを行うことができます。

<label>Category</label>
     <select id="category">
       <option value="0">Please select a category</option>
        <?php
        $currentCategory = 0;
        $curretProduct =0;

        if (!empty($_GET['category'])) {
            $currentCategory = $_GET['category'];   
        }

        if (!empty($_GET['product'])) {
            $currentProduct = $_GET['product']; 
        }
           $SQL = "SELECT * FROM category";
           $query = mysql_query($SQL);
           while ($cat = mysql_fetch_assoc($query)) {
              if ($cat['id'] == $currentCategory) {
                echo "<option value='{$cat['id']}' selected=\"selected\">{$cat['name']}</option>";
              } else {
                echo "<option value='{$cat['id']}'>{$cat['name']}</option>";
              }
             }
         ?>
     </select>
     <select id="product"> </select>
    var currentProduct = "<?php echo $currentProduct; ?>";
    $("#category").change(function() {
        var category =  $(this).val();
        $('#product').append($("<option></option>").attr("value","0").text("Please Select Product"));
        $.getJSON(host + "/ajax_select_product.php?categoryid=" + category, function(data) {
            $.each (data, function (index, element) {
                if (data[index].id == currentProduct) {
                    $('#product').append($("<option></option>").attr("value",data[index].id).attr("selected", "selected").text(data[index].name));
                } else {
                    $('#product').append($("<option></option>").attr("value",data[index].id).text(data[index].name));
                }

            });
        });
    });

​
    $("#product").change(function() {
        var product = $("#product :selected").text()
        var category =  $("#category :selected").text()
        window.location = "page.php?category=" + category + "?product=" + product;
    });
于 2012-04-22T13:06:45.987 に答える