Два выпадающих списка, второй заполненный значениями в базе данных

Мне нужно сделать два выпадающих списка. Скажем, первый из них содержит категории продуктов питания: мороженое, пиццу, лапшу, молочные коктейли.Два выпадающих списка, второй заполненный значениями в базе данных

Так что, если я выберу мороженое, второй выпадающий список будет содержать: шоколад, ваниль, монетный двор и так далее. И если я возьму Пиццу на первом, я хочу, чтобы эта вторая менялась динамически, чтобы она содержала: Pepperoni, All Meat и т. Д.

Однако мне нужен второй раскрывающийся список, который будет заполнен значениями, которые у меня уже есть в моей базе данных. Итак, скажем, если я не из шоколадного мороженого, во втором выпадающем списке не будет шоколада. Это мой желаемый результат.

Я использую HTML, PHP, JavaScript/jQuery и MySQL, поэтому в настоящее время это webapp, и эти два раскрывающихся списка предназначены для удаления значений из базы данных. Итак, скажем, я хочу удалить Pepperoni из Pizzas, я бы выбрал Pizzas в первом выпадающем списке, а затем Pepperoni во втором выпадающем списке. Затем я бы нажал delete, который выполнил бы функцию js для передачи параметров с помощью ajax для PHP, а затем можно выполнить запрос на удаление.

Я застрял в заполнении второго выпадающего списка динамически, любая помощь по этому поводу? То, что я сделал до сих пор для ниспадающего только:

    <select id="tester_type"> 
        <option value=""></option> 
        <option value="LMX">LMX</option> 
        <option value="LCX">LCX</option> 
        <option value="CAT">CAT</option> 
        <option value="J750">J750</option> 
        <option value="HPPS">HPPS</option> 
        <option value="HP93K">HP93K</option> 
        <option value="UFLEX">UFLEX</option> 
        <option value="IFLEX">IFLEX</option> 
        <option value="QRT">QUARTET</option> 
        <option value="TGR">TIGER</option> 
        <option value="ETS">ETS</option> 
        <option value="LEX">LEX</option> 
        <option value="HPLC">HPLC</option> 
        <option value="HPSS">HPSS</option> 
       </select> 
      </td> 
     </tr> 
     <tr> 
      <td>New Tester Name:</td> 
     <td> 
      <select id="tester_type"> 
       <!--Update list of available testers--> 
      </select> 
     </td>

Примечание: Я только что заменил первый выпадающий список в качестве пищевой категории для лучшего понимания моего вопроса, кстати. Просто возьмите первый как категории продуктов, а второй будет его типом/ароматом.

EDIT:

Он ничего в соответствующем разделе/дел в окне не отображается. Просто пустой, за исключением заголовка, который я добавил в свой HTML и другие две кнопки.

То, что я сделал в соответствии с ответом Брэндона:

В HTML:

<html> 
    <head> 
     <title>Delete Tester</title> 
     <link rel="stylesheet" type="text/css" href="style.css"/> 
     <script language="javascript" type="text/javascript" src="jquery.js"></script> 
     <script type="text/javascript" src="function.js"></script> 
     <script type="text/javascript">displayDropDown();</script> 
    </head> 

    <body> 
     <h3>Delete Tester</h3> 
     <div id="drop_two_list"></div> 
     <table class="deleteTable"> 
      <tr> 
       <td/><td><br> 
        <input type="button" value="Cancel" onclick="window.close();"/> 
        <input type="button" name="send" value="Delete" onclick="deleteTester();"/> 
       </td> 
      </tr> 
    </table> 
    </body> 
</html>

В внешних файла JavaScript:

function dislplayDropDown() 
{ 
var page = "database.php"; 

$.post(page, { 
    action : "dislplayDropDown" 
    }, function(data) { 
    $("div#drop_two_list").html(data); 
    alert(data); 
});

В PHP:

function displayDropDown() 
{ 
    $tester_info = "dummy_tester_list"; 
    $query_string = "select * from $tester_info"; 
    $result = @mysql_query($query_string) or die (mysql_error()); 
    $data = mysql_fetch_array($result) or die (mysql_error()); 

    echo "<select id=\"tester_type\">"; 
    while($data) 
    { 
     echo "<option value='$data['tester_type']'>$data['tester_type']</option>"; // first drop down 
    } 
    echo "</select>"; 

    $selected_tester_type = $_REQUEST['tester_type']; 

    $query_string = "select * from $tester_info where tester_type = $selected_tester_type"; 
    $result = @mysql_query($query_string) or die (mysql_error()); 
    $data = mysql_fetch_array($result) or die (mysql_error()); 

    echo "<select>"; 
    while($data) 
    { 
     echo "option id=\"tester_name\" value='$data['tester_name']'>$data['tester_name']</option>"// second drop down 
    } 
    echo "</select>"; 
} 

?> 
<?php 

$action = rtrim($_REQUEST['action']); 

if($action=="insert")//This is for some other function 
{ 
    $tester_type = rtrim($_REQUEST['tester_type']); 
    $tester_name = rtrim($_REQUEST['tester_name']); 

    echo checkDuplicateTesterName($tester_type, $tester_name); 
} 
else if($action=="displayDropDown") 
{ 
    echo displayDropDown(); 
} 


?>

структура таблицы в соответствии с просьбой Kentot, это только первые пять строк, потому что есть более чем 500 строк, так что я бы не хотел, чтобы положить все это здесь:

id tester_type tester_name 
    1  LMX   LMX-01 
    2  LMX   LMX-04 
    3  LMX   LMX-05 
    4  LMX   LMX-06 
    5  LMX   LMX-07

источник

2015-05-27 hzq

вы можете разместить вашу MySQL структуру таблицы? – Kentot

Хорошо, только что написал. – hzq

Обратите внимание, что если имеется очень большой набор опций, может быть более эффективным захватить весь набор данных в одном запросе и обработать все остальное в коде приложения (либо php, либо JavaScript) - пока кнопка отправки не будет нажата в любом случае – Strawberry

вы можете создать эту таблицу сказать мы будем называть «меню»

food_id  | food_type_flavor | food_category 
-------------------------------------------- 
1   | chocolate   | ice cream 
2   | vanilla   | ice cream 
3   | lemon    | juice

и в своем коде вы можете создать этот

$query = mysql_query("Select * from menu"); 
echo "<select name='food_category' >"; 
while($test = mysql_fetch_array($query)) 
{ 
    echo "<option value='$test['food_category']'>$test['food_category']</option>"; // first drop down 
} 
echo "</select>";

тогда, когда вы выбираете категорию, которую вы можете получить то, что был food_category выбран, и вы можете использовать это переменная, чтобы сделать вторую снизу

источник

2015-05-27 00:50:02

В вашем коде есть некоторая ошибка. Вы имеете в виду 'echo '"; // первый выпадающий'? – hzq

@hzq да, это будет значение = '' not value = "" –

, или вы могли бы эхом ответить следующим образом: echo " "; – Kentot

вы можете попробовать этот ..

<?php 
function displayDropDown() 
{ 
    $tester_info = "dummy_tester_list"; 
    $query_string = "select * from $tester_info"; 
    $result = @mysql_query($query_string) or die (mysql_error()); 
    $data = mysql_fetch_array($result) or die (mysql_error()); 

    echo "<select id=\"tester_type\">"; 
    while($data) 
    { 
     ?> 
     <option><?php echo $data['tester_type']; ?></option> 
    <?php 
    } 
    echo "</select>"; 

    $selected_tester_type = $_REQUEST['tester_type']; 

    $query_string = "select * from $tester_info where tester_type = $selected_tester_type"; 
    $result = @mysql_query($query_string) or die (mysql_error()); 
    $data = mysql_fetch_array($result) or die (mysql_error()); 

    echo "<select>"; 
    while($data) 
    { 
    ?> 
     <option><?php echo $data['tester_name']; ?></option> 
    <?php 
    } 
    echo "</select>"; 
} 

?> 
<?php 

$action = rtrim($_REQUEST['action']); 

if($action=="insert")//This is for some other function 
{ 
    $tester_type = rtrim($_REQUEST['tester_type']); 
    $tester_name = rtrim($_REQUEST['tester_name']); 

    echo checkDuplicateTesterName($tester_type, $tester_name); 
} 
else if($action=="displayDropDown") 
{ 
    echo displayDropDown(); 
} 


?>

поэтому мы выделим тег, чтобы удалить ошибку

источник

2015-05-27 02:33:28

Хмм, похоже, никаких изменений нет, и ошибок нет. Функция 'displayDropDown();' в моем HTML-файле, похоже, не выполняется. Возможно, ошибка в моем javascript ajax? – hzq

Почему вы должны создать функцию js displayDropDown() и вызвать свой php, когда можете напрямую сделать это с помощью своего HTML? – Kentot

Я назвал это в своем HTML. Две функции в js и PHP имеют одно и то же имя. JQuery отправляет действие файлу PHP, в котором он будет читать и выполнять соответствующие функции, которые я хочу. Это потому, что у меня есть не только одна функция в моем PHP-файле, у меня есть другие функции, поэтому я использую переменную 'action', чтобы определить, какую функцию выполнить. – hzq

Hai hzq Я сделал изменения в коде для меня, чтобы ответить на него чище:

ваш HTML:

<?php 

     $result = mysql_query("select * from dummy_tester_list"); 
     $data = mysql_fetch_array($result); 

    ?> 

    <select id="tester_type"> 
     <?php foreach($data as $d): ?> 
     <option value="<?php echo $d["tester_type"]?>"><?php $d["tester_type"];?></option> 
     <?php endforeach ?>      
    </select> 
<section id="tester_name"> 

</section> 

    <h3>Delete Tester</h3> 
     <table class="deleteTable"> 
      <tr> 
       <td><div id="drop_two_list"></div></td> 
      </tr> 
      <tr> 

        <input type="button" value="Cancel" onclick="DELETE_TESTER_POPUP.close();"/> 
        <input type="button" name="send" value="Submit" onclick="deleteTester();"/> 
       </td> 
      </tr> 
    </table>

Ваш PHP, где вы хотите получить список выбранного типа тестера:

<?php 
    $tester_type = $_POST["tester_name"]; 
    $query = mysql_query("select * from tester_info where tester_type = {$tester_type}"); 
    $select_dropdown; 
    $select_dropdown .= "<select name='tester_lists'>"; 
    while($row = mysql_fetch_array($query)){ 
     $select_dropdown .= "<option>{$row["tester_name"]}</option>"; 
    } 
    $select_dropdown .= "</select>"; 

    echo $select_dropdown; 

?>

Вашего JQuery при изменении имени тестера и получить эквивалентный список тестера

$("body").on("change","#tester_type",function(){ 
     $.ajax({ 
      url: "dropdowns.php", // your php file 
      type: "POST", 
      data: tester_name: $(this).val(), 
      success: function(data){ 
       $("#tester_name").html(data); 
      } 
     }); 

    });

источник

2015-05-27 02:46:27 Kentot

Хмм, я не думаю, что смогу это сделать. Причина, по которой я отправляю «действие» в ajax (как показано в моем редактировании), заключается в том, что в моем PHP-файле есть и другие функции. «Действие» означает указать исполняемый файл PHP (как показано в последней части редактирования). Моя основная цель состоит в том, чтобы HTML-файл содержал только HTML-коды и чтобы он был намного безопаснее (?), Если пользователь просматривает источник в своем браузере. – hzq

ваши коды или сценарии не могли быть просмотрены, когда пользователь просматривает ваш исходный код – Kentot

О, я вижу. Но действительно ли способ поставить коды PHP только в файл PHP? Я действительно хочу, чтобы HTML-файл содержал только HTML-коды. Ответ Брэндона был бы самым близким к тому, что я желаю, но просто потому, что функция javascript моей функции ajax (в отредактированном вопросе), похоже, не выполняется. Может быть, ошибка там или что-то еще? – hzq

Два выпадающих списка, второй заполненный значениями в базе данных

ответ

Смежные вопросы