Twitter bootstrap 如何提交twitter引导javascript按钮?

Twitter bootstrap 如何提交twitter引导javascript按钮?,twitter-bootstrap,validation,Twitter Bootstrap,Validation,我在这里谈论的是Twitter Boostrap单选按钮: 我在我的视图文件中使用了它们,如下所示: <div class="btn-group" data-toggle="buttons-radio"> <input type="button" name="type" class="btn" value="Car"> <input type="button" name="type" class="btn" value="Bicycle">

我在这里谈论的是Twitter Boostrap单选按钮:

我在我的视图文件中使用了它们,如下所示:

<div class="btn-group" data-toggle="buttons-radio">
     <input type="button" name="type" class="btn" value="Car">
     <input type="button" name="type" class="btn" value="Bicycle">
</div>

但是当我提交表单并试图验证这些时,我无法得到它们的值


echo$_POST['type']为空。。。那么,我应该如何访问和验证上述“单选”按钮呢?

这实际上与Twitter引导无关。你应该考虑对“名称”属性有唯一的名称。

插件只为外观工作:它不设置任何东西(除了类)。您必须使用自己的JS来设置一些真正的单选按钮,或者一个独特的隐藏输入

$('data toggle=“buttons radio”]>.btn')。在('click',function()上{
$('#someHiddenInput').val($(this.val());
});

似乎
type=“button”
无论如何都没有提交(在我的Firefox上)



这是一种方法,另一种方法是检查submit中哪个类具有
.active
类。

这是一种从Sherbrow的答案中衍生出来的优雅解决方案。它可以让你有几个引导式单选按钮,并且只需一行代码就可以使它们与隐藏的输入保持同步。您需要做的就是始终在.btn组中放置一个隐藏的输入

HTML:

演示:

在实时设置中,您希望将其中一个按钮设置为默认活动按钮(.active),并为隐藏字段提供默认值


我希望它能帮助别人

嗯,不。按钮的名称相同是有原因的。谢谢这个。。。我对您的代码做了一些修改,因此当单击这些按钮时,javascript函数正在隐藏的输入中设置一个值
:)
。谢谢你给我指明了正确的方向。
        <!-- Vehicle
        ================================================== -->
        <div class="control-group">
            <label class="control-label" for="selectRecipients">Vehicle</label>
            <div class="controls">
                <div class="btn-group" data-toggle="buttons-radio">
                    <button type="button" class="btn" value="car">Car</button>
                    <button type="button" class="btn" value="bicyle">Bicycle</button>
                    <input type="hidden" name="vehicle" value=""></input>
                </div>
            </div>
        </div>

        <!-- Food
        ================================================== -->
        <div class="control-group">
            <label class="control-label" for="selectRecipients">Vehicle</label>
            <div class="controls">
                <div class="btn-group" data-toggle="buttons-radio">
                    <button type="button" class="btn" value="apples">Apples</button>
                    <button type="button" class="btn" value="oranges">Oranges</button>
                    <input type="hidden" name="food" value=""></input>
                </div>
            </div>
        </div>
    /** Associate UI-only radio buttons with hidden fields **/
    $('[data-toggle="buttons-radio"] > button').on('click', function() {
        $(this).parent().find('input[type=hidden]').val( $(this).val() );
        alert( $(this).parent().find('input[type=hidden]').val() );
    });