Показать выпадающий каждый клик в коде воспламенитель PHP
У меня есть веб-приложение, в котором пользователь может динамически добавлять имена домохозяйств и удалять их, если они этого хотят.
По-моему:
<tr>
<td>Add Household</td>
</tr>
<tr>
<td>
<div class="field_wrapper">
<div>
<select name="field_name[]" value="" id="drop2" style="color:black;">
<?php
foreach ($head as $row) {
echo "<option style='color:black;' value='".$row['hh_id']."'>".$row['hh_fname']." ".$row['hh_lname']."</option>";?>
</select>
<a href="javascript:void(0);" class="add_button" title="Add field"><img src="<?php echo base_url('dist/img/add-icon.png'); ?>" /></a>
</div>
</div>
</td>
</tr>
Автор сценария:
<script type="text/javascript">
$(document).ready(function(){
var maxField = 10; //Input fields increment limitation
var addButton = $('.add_button'); //Add button selector
var wrapper = $('.field_wrapper'); //Input field wrapper
var fieldHTML = '<div><select name="field_name[]"><option></option></select><a href="javascript:void(0);" class="remove_button" title="Remove field"><img src="<?php echo base_url("dist/img/remove-icon.png"); ?>" /></a></div>'; //New input field html
var x = 1; //Initial field counter is 1
$(addButton).click(function(){ //Once add button is clicked
if(x < maxField){ //Check maximum number of input fields
x++; //Increment field counter
$(wrapper).append(fieldHTML); // Add field html
}
});
$(wrapper).on('click', '.remove_button', function(e){ //Once remove button is clicked
e.preventDefault();
$(this).parent('div').remove(); //Remove field html
x--; //Decrement field counter
});
});
</script>
Я хочу, чтобы каждый раз, когда пользователь нажимал add
Кнопка, то же самое раскрывающееся меню должно отображаться, как и первое раскрывающееся меню. Как мне добиться этого в части сценария? Как заселить fieldHtml
к раскрытию тогда?
add
а также remove
функции работали хорошо. Просто когда будет добавление, должно отображаться выпадающее меню.
Большое спасибо за вашу помощь.
1 ответ
Существует обходной путь, который может вам помочь. Вместо того, чтобы снова открывать раскрывающийся список, вы можете выбрать несколько строк:
<select name="field_name[]" value="" id="drop2" style="color:black;" size="10">
С size
атрибут на вашем select
Если у вас нет тега, у вас не будет выпадающего списка, но у вас будет выпадающий элемент, который всегда виден.