Выбрать значение раскрывающегося списка начальной загрузки OnSubmit

Question

Выбрать значение раскрывающегося списка начальной загрузки OnSubmit

Выпадающий с использованием Bootstrap

<form id="search" action="" method="post" >
<div class="dropdown">
<button data-toggle="dropdown" id="dropdownMenu1" type="button" class="btn btn-default dropdown-toggle">Fixed <span class="caret"></span></button>

<ul aria-labelledby="dropdownMenu1" role="menu" class="dropdown-menu">
<li role="presentation"><a href="#" tabindex="-1" role="menuitem">Florida</a></li>
<li role="presentation"><a href="#" tabindex="-1" role="menuitem">Texas</a></li>
<li role="presentation"><a href="#" tabindex="-1" role="menuitem">Washington</a></li>
<li role="presentation"><a href="#" tabindex="-1" role="menuitem">New York</a></li>
<li role="presentation"><a href="#" tabindex="-1" role="menuitem">Ohio</a></li>
</ul>
</div>
</form>

jQuery для сохранения выбранной опции выпадающего

var jQee = jQuery.noConflict();
jQee(".dropdown-menu li").click(function(){
var selText = jQee(this).text();
jQee(this).parents('.dropdown').find('.dropdown-toggle').html(selText+' <span class="caret"></span>');
//jQee('#search').submit();
});

HTML Dropdown

<select onchange="form.submit()" name="template">
<option value="F" selected="true">Florida</option>
<option value="T">Texas</option>
<option value="W">Washington</option>
<option value="N">New York</option>
<option value="O">Ohio</option>
</select>

Для приведенного выше раскрывающегося списка, я получаю option value на основе выбора пользователя.

Делая это с BootstrapЯ могу сохранить выпадающее значение selected, но, как я использую его с PHPМне также нужно значение в $_POST переменная для выполнения SQL запрашивать и отображать результаты в зависимости от того, какое значение выбрано из выпадающего списка.

Как мне этого добиться?

3

drop-down-menu jquery php twitter-bootstrap

Решение

Другие решения

Других решений пока нет …

Источник

Accepted Answer

Используйте скрытое поле и заполните его, когда пользователь выбирает состояние.

HTML

<form id="search" action="" method="post" >
<input type="hidden" name="selection">
<div class="dropdown">
<button data-toggle="dropdown" id="dropdownMenu1" type="button" class="btn btn-default dropdown-toggle">Fixed <span class="caret"></span></button>

<ul aria-labelledby="dropdownMenu1" role="menu" class="dropdown-menu">
<li role="presentation"><a href="#" tabindex="-1" role="menuitem">Florida</a></li>
<li role="presentation"><a href="#" tabindex="-1" role="menuitem">Texas</a></li>
<li role="presentation"><a href="#" tabindex="-1" role="menuitem">Washington</a></li>
<li role="presentation"><a href="#" tabindex="-1" role="menuitem">New York</a></li>
<li role="presentation"><a href="#" tabindex="-1" role="menuitem">Ohio</a></li>
</ul>
</div>
</form>

JavaScript

$(document).ready(function() {
$("ul li a").click(function() {
text = $(this).closest("li").text();
$("input[name='selection']").val(text);
$(this).parents('.dropdown').find('.dropdown-toggle').html(text+' <span class="caret"></span>');
$("#search").submit();
});
});

Смотри jsfiddle Используйте элемент inspect для проверки значения скрытого поля.

0