使用Get或Post在表单中发送Bootstrap Button-Group值

时间:2016-01-12 23:44:25

标签: php twitter-bootstrap

我用bootstrap 3创建了这个表单:

                        <form role="form" method="get" target="_self" action="checkplayer.php">
                        <div class="input-group">
                            <input type="text" class="form-control input-lg" placeholder="Search player" name="player">
                            <span class="input-group-btn">
                                <button class="btn btn-primary btn-lg" type="submit">Search</button>
                            </span>
                        </div><br>
                        <div class="btn-group">
                            <button name="region" type="button" class="btn btn-primary" value="NA" autofocus="true">NA</button>
                            <button name="region" type="button" class="btn btn-primary" value="EUW">EUW</button>
                            <button name="region" type="button" class="btn btn-primary" value="EUNE">EUNE</button>
                            <button name="region" type="button" class="btn btn-primary" value="BR">BR</button>
                            <button name="region" type="button" class="btn btn-primary" value="TR">TR</button>
                            <button name="region" type="button" class="btn btn-primary" value="RU">RU</button>
                            <button name="region" type="button" class="btn btn-primary" value="LAN">LAN</button>
                        </div>
                    </form>

我正在使用按钮组,因为它看起来比dropdwon menue或只是复选框更好。

我试图通过_get方法发送btn-group值,但它不起作用。 那么如何使用我的_get方法将值提交到我的PHP文件中呢?

感谢您的帮助

2 个答案:

答案 0 :(得分:4)

我找到了解决方案

                            <div class="btn-group" data-toggle="buttons">
                            <label class="btn btn-primary">
                                <input type="radio" id="NA" name="region" value="NA" autofocus="true"/> NA
                            </label>
                            <label class="btn btn-primary">
                                <input type="radio" id="EUW" name="region" value="EUW" /> EUW
                            </label>
                            <label class="btn btn-primary">
                                <input type="radio" id="EUNE" name="region" value="EUNE" /> EUNE
                            </label>
                            <label class="btn btn-primary">
                                <input type="radio" id="BR" name="region" value="BR" /> BR
                            </label>
                            <label class="btn btn-primary">
                                <input type="radio" id="TR" name="region" value="TR" /> TR
                            </label>
                            <label class="btn btn-primary">
                                <input type="radio" id="RU" name="region" value="RU" /> RU
                            </label>
                            <label class="btn btn-primary">
                                <input type="radio" id="LAN" name="region" value="LAN" /> LAN
                            </label>
                            <label class="btn btn-primary">
                                <input type="radio" id="LAS" name="region" value="LAS" /> LAS
                            </label>
                            <label class="btn btn-primary">
                                <input type="radio" id="OCE" name="region" value="OCE" /> OCE
                            </label>
                        </div>

答案 1 :(得分:0)

除了在屏幕上显示一些按钮之外,'btn-group'div中的这些按钮没有做任何有用的事情。他们不知道任何“选定”属性(为了提交所选值)。

按钮并不意味着像单选按钮,复选框等一样。它们的目的是在单击时执行操作。

所以我推荐就是忘记按钮组,只需添加复选框。如果您担心样式,只需添加这个非常有用的库(http://icheck.fronteed.com/)。我认为线条皮肤对你来说很棒。

如果你真的想要这些按钮,你应该编写一些js代码(最好是jquery),然后在click事件中,将选定的值存储在一个将被提交的隐藏输入中。见这里:Change a hidden input's value with jquery/javascript