Группы входа и кнопки Bootstrap не изменяются DOM

Я использую bootstrap для стилизации переключателя радио в качестве кнопок. Дисплей для пользователя в порядке, но при нажатии кнопки соответствующий объект радио не установлен в DOM. Поэтому, когда форма сериализации, это только когда-либо показывает, проверил селектор по умолчанию:Группы входа и кнопки Bootstrap не изменяются DOM

<div class='btn-group btn-group-sm' data-toggle='buttons'> 
    <label class='btn btn-default active> 
    <input type='radio' name='moveMeal' id='moveBreakfast' value='Breakfast' checked> Breakfast</label> 
    <label class='btn btn-default> 
    <input type='radio' name='moveMeal' id='moveLunch' value='Lunch'> Lunch</label>     
    <label class='btn btn-default> 
    <input type='radio' name='moveMeal' id='moveDinner' value='Dinner'> Dinner</label> 
</div>

Когда сериализовать с помощью JQuery с остальной частью формы, это всегда:

&moveMeal=Breakfast

независимо от того, что пользователь выбран.

Любые предложения очень ценятся, спасибо

Update: (. Исправлена опечатка от значения входного moveDinner радио Это была опечатка здесь, но хорошо в исходном коде)

Что-то Примечание. Я загружаю эту форму после загрузки начальной страницы с запросом .load(). После завершения запроса нагрузки(), я тогда я инициализация .btn класс:

$('.modal-content').load("movePlanModal.php?id=" + id, function() { 
    $('#modal').modal('show'); 
    $(".container").addClass("blur"); 
    xsNavSave(); 
    $(".btn").button(); 
});

источник

2014-10-17 jlommori

выглядит отлично - http://jsfiddle.net/arunpjohny/qkcy2eo1/1/ –

Вы повторили значение 'Breakfast' на кнопку третьего радио. Кроме того, как вы точно сериализуете форму? –

@winterblood onНажмите кнопку «Сохранить», я сохраняю данные в переменной, чтобы передать запрос .get(): results = $ («# modalForm»). Serialize(); – jlommori

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

<div class='btn-group btn-group-sm' data-toggle='buttons'> 
    <label for="moveBreakfast" class='btn btn-default active> 
    <input type='radio' name='moveMeal' id='moveBreakfast' value='Breakfast' checked> Breakfast</label> 
    <label for="moveLunch" class='btn btn-default> 
    <input type='radio' name='moveMeal' id='moveLunch' value='Lunch'> Lunch</label>     
    <label for="moveDinner" class='btn btn-default> 
    <input type='radio' name='moveMeal' id='moveDinner' value='Dinner'> Dinner</label> 
</div>

источник

2014-10-17 09:47:05 Pianoc

я не смог решить эту проблему, как он стоит, как я считаю, я встретив ошибку в Bootstrap.

Я переключил элемент на выделенный объект, и он функционально работает как ожидалось, просто не выглядит так хорошо, как изначально желаемого.

Спасибо за вход

источник

2014-10-18 04:00:06 jlommori

Группы входа и кнопки Bootstrap не изменяются DOM

ответ

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