Комбинированные объекты на основе выбранного элемента в другом поле со списком

Если у меня есть combobox1 есть предметы: Фрукты и овощи.

Мне нужно показать более узкий combobox2 на основе выбранного элемента в combobox1 .

Если выбранным элементом в combobox1 является Fruits , то элементами combobox2 являются: apple, orange ..etc.

Если выбранным элементом в combobox1 является vegetables , то элементы combobox2 : редька, салат-латук и т. Д.

Как я могу это сделать с помощью PHP и HTML? ( Пожалуйста, учитывайте только «PHP и HTML» как условие ).

К сожалению, ваши условия (только PHP и HTML, а не javascript) означают, что вы должны перезагружать страницу / загружать другую страницу с помощью отправки формы после каждого изменения в своем поле со списком, так как это будет единственный способ понять, что такое выбранное значение, поскольку вы решили работать только на стороне сервера (PHP).

Если вы решите не использовать javascript (или фреймворк javascript, такой как jQuery), вы не сможете изменять содержимое своей страницы без отправки формы, поэтому вы не сможете изменить второй элемент списка со списком, если вы не сделали 'подал первый выбор combobox.

Вы можете сделать это:

 <html> <head> <script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script> <script type="text/javascript"> $(function(){ $('#combo').change(function(){ console.log($(this)); $.get( "ABC.php" , { option : $(this).val() } , function ( data ) { $ ( '#comboB' ) . html ( data ) ; } ) ; }); }); </script> </head> <body> <div id="comboBox"> <fieldset> <form> <select name="combo" id="combo"> <option value="">-- Select</option> <option value="1">Fruits</option> <option value="2">Vegetables</option> </select> <select name="comboB" id="comboB"> <option value="">--</option> </select> </form> </fieldset> </div> </body> </html> 

Затем на странице PHP вы получите массив с данными, которые будут добавлены в раскрывающийся список, конечно, вам также придется отправить вызов ajax для заполнения окна сбрасывания, а затем на php-странице у вас есть следующее:

 <?php $Options = Array ( 1 => Array ( 'Apple' , 'Orange' ) , 2 => Array ( 'Radish' , 'Lettuce' ) ) ; forEach ( $Options [ $_GET [ 'option' ] ] as $Item ) { printf ( '<option value="%s">%s</option>' , $Item , $Item ) ; } 

Теперь вам просто нужно настроить проверки и т. Д.

Вы можете сделать это с помощью jquery

Пример:

 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js" type="text/javascript" ></script> <select class="small-input" id="NameCombobox1" name="NameCombobox1"> <option value="0">Select one</option> <option value="1">Fruits</option> <option value="2">vegetables</option> </select> <div id="result"></div> <script type="text/javascript"> $('#NameCombobox1').change(function() { var NameCombobox1 = $(this).attr('value'); if( NameCombobox1> 0) { $.post( "PageWithSelect.php", { BRFLink: NameCombobox1 }, function(data) { $("#result").append(data); }, "html" ); } $('#result').show(); }); </script>