Начальная загрузка Twitter: Получение состояния кнопок флажка начальной загрузки

Question

Начальная загрузка Twitter: Получение состояния кнопок флажка начальной загрузки

Как мне получить "состояние" кнопок, которые были нажаты в начальной загрузке?

Т.е. я использую этот код, который делает кнопки "переключающимися", как флажок:

<div class="btn-group" data-toggle="buttons-checkbox">
  <button type="button" class="btn btn-primary">Left</button>
  <button type="button" class="btn btn-primary">Middle</button>
  <button type="button" class="btn btn-primary">Right</button>
</div>

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

Но затем я нажимаю кнопку "Отправить" - в $_POST нет данных. Как мне узнать, какие кнопки были выбраны?

Я попытался добавить 'value="1" name="1"' и т. Д. Также к кнопкам - но все равно ничего.

Редактировать: Здесь это полное решение, которое я смог создать, используя помощь Феликса ниже.

<form method="post" action="" id="mform" class="form-horizontal">
 <div class="btn-group" data-toggle="buttons-checkbox">
   <button type="button" name="left"   value="1" class="btn btn-primary">Left</button>
   <button type="button" name="middle" value="1" class="btn btn-primary">Middle</button>
   <button type="button" name="right"  value="1" class="btn btn-primary">Right</button>
 </div>
 <button type="submit" class="btn">Submit</button>
</form>

<script>
    $('#mform').submit(function() {
        $('#mform .btn.active').each(function() {
             var input = document.createElement("input");
             input.setAttribute("type", "hidden");
             input.setAttribute("name", this.name);
             input.setAttribute("value", this.value);
             document.getElementById("mform").appendChild(input);
         });
    });
 </script>

5

php button twitter-bootstrap

Author: Laurence, 2012-12-26

Source

1 answers

score 15 · Accepted Answer

Кнопки, которые "выбраны", будут иметь класс active, прикрепленный к ним. Затем вы можете использовать jQuery только для выбора этих кнопок. Поскольку button являются элементами формы, они могут иметь атрибуты name и value, и, вероятно, лучше всего их использовать.

Пример:

var data = {};

$('#myButtonGroup .btn.active').each(function() {
    data[this.name] = this.value;
});

Чтобы отправить данные на сервер, вы могли бы использовать Ajax и установить данные вручную / объединить их с другими данными формы (если они существуют).

Вы также можете попытаться отразить значения в скрытых элементах формы при отправке, если вы хотите использовать "традиционную" отправку формы (см. Изменение значений формы после нажатия кнопки "Отправить").