У меня есть 1 Drop Down, который используется для категории (еда, напитки и т. Д.)
В моей таблице MYSQL (t_menu_category) У меня:
+----+---------------+-------------------+----------------------+ | ID | category_name | sub_category_name | category_description | +----+---------------+-------------------+----------------------+ | 1 | Food | Curries | Spicy Curries | | 2 | Food | Meat | Lamb, Pork, Chicken | | 3 | Drinks | Alcohol | Fine Tasting Lager | | 4 | Desserts | Cakes | Chocolate Cake | +----+---------------+-------------------+----------------------+ У меня есть первое раскрывающееся меню, показывающее значения «category_name», но то, что я хочу, – это когда я выбираю пищу, я хочу обновить второй раскрывающийся список и просто показать значения «sub_category_name», где первый выбор, например. «Продовольствие» в базе данных равно «Продовольствие».
Поэтому, если я выбрал «Продовольствие» в первом раскрывающемся списке, во втором раскрывающемся списке будет отображаться только «Curries» и «Meat».
HTML:
<form method="post" action="<?php $_SERVER['PHP_SELF'] ?>"> <p> <label for="item_name">Item Name</label> <input id="item_name" name="item_name" required="required" type="text" placeholder="Item Name" /> </p> <p> <label for="item_description">Item Description</label> <textarea rows="3" cols="100%" required="required" name="item_description">Item Description</textarea> </p> <p> <label for="item_category">Item Category</label> <select id="item_category" name="item_category" required="required"> <option selected="selected">-- Select Category --</option> <?php $sql = mysql_query("SELECT category_name FROM t_menu_category"); while ($row = mysql_fetch_array($sql)){ ?> <option value="<?php echo $row['category_name']; ?>"><?php echo $row['category_name']; ?></option> <?php // close while loop } ?> </select> </p> <p class="center"><input class="submit" type="submit" name="submit" value="Add Menu Item"/></p> </form>
Любая помощь будет высоко оценена 🙂
вы можете создать файл PHP с запросом и вызвать его с помощью AJAX.
getSubCategory.php
<?php $category = ""; if(isset($_GET['category'])){ $category = $_GET['category']; } /* Connect to the database, I'm using PDO but you could use mysqli */ $dsn = 'mysql:dbname=my_database;host=127.0.0.1'; $user = 'my_user'; $password = 'my_pass'; try { $dbh = new PDO($dsn, $user, $password); } catch (PDOException $e) { echo 'Connection failed: ' . $e->getMessage(); } $sql = 'SELECT sub_category_name as subCategory FROM t_menu_category WHERE category_name = :category'; $stmt = $dbh->prepare($sql); $stmt->bindValue(':category', $category); $stmt->execute(); return json_encode($stmt->fetchAll());
и добавить некоторый jquery, чтобы поймать, когда выбрана категория, и спросить сервер для соответствующей подкатегории:
<script> $(document).ready(function () { $('#item_category').on('change', function () { //get selected value from category drop down var category = $(this).val(); //select subcategory drop down var selectSubCat = $('#item_sub_category'); if ( category != -1 ) { // ask server for sub-categories $.getJSON( "getSubCategory.php?category="+category) .done(function( result) { // append each sub-category to second drop down $.each(result, function(item) { selectSubCat.append($("<option />").val(item.subCategory).text(item.subCategory)); }); // enable sub-category drop down selectSubCat.prop('disabled', false); }); } else { // disable sub-category drop down selectSubCat.prop('disabled', 'disabled'); } }); }); </script>
также добавьте значение в свой первый вариант:
<option value="-1" selected="selected">-- Select Category --</option>