问题描述
< div class =radio>是否可以将下一个代码转换为bootsfaces标签?
< label>< input type =radioname =optradio/>选项1< / label>
< / div>
< div class =radio>
< label>< input type =radioname =optradio/>选项2< / label>
< / div>
谢谢!
< b:radiobutton />
组件比它的标准JSF组件更灵活。它将与BootsFaces的下一个版本一起发布 - 可能是1.0,这是JavaOne 2016的原因。在此之前,请遵循下面的配方。 我们没有实现< b:radioButton />
但是,您可以通过添加隐藏的输入字段和一些JavaScript代码来模拟它:
< b:panel title =Surveylook =primary>
< p>您使用哪个Java版本?< / p>
< div class =radio>
< label onclick =$('。hidden-optradio')。val(7)>
< input type =radioname =optradiovalue =7/>
Java 7
< / label>
< / div>
< div class =radio>
< label onclick =$('。hidden-optradio')。val(8)>
< input type =radioname =optradiovalue =8/>
Java 8
< / label>
< / div>
< h:inputText value =#{radiobuttonBean.javaVersion}styleClass =hidden-optradiopt:type =hidden/>
< script> $('input [name = optradio] [value =#{radiobuttonBean.javaVersion}]')。attr(checked,checked);< / script>
< b:messages />
< / b:面板>
如果您需要AJAX,请通过添加一个隐藏的< b: commandButton update =someRegiononclick =ajax:myBean.myMethod()/>
并调用此按钮的 click()
方法在标签 onclick
处理程序中: $( '隐藏optradio。')VAL(8); $(Ajax的按钮)。单击(); >
< input type =radioname =optradiovalue =8/>
Java 8
< / label>
< / div>
...
action =#{radiobuttonBean.submit}look =primary
update =@ form
style-class =隐藏ajax-button
/>
Is it possible to transform the next code to bootsfaces labels?
<div class="radio">
<label><input type="radio" name="optradio"/>Option 1</label>
</div>
<div class="radio">
<label><input type="radio" name="optradio"/>Option 2</label>
</div>
Thank you!
Update July 18, 2016: Inspired by your question, I've started to implement a <b:radiobutton />
component that's more flexible than its standard JSF counterpart. It will be published with the next version of BootsFaces - probably 1.0, which is due to JavaOne 2016. Until then, follow the recipe below.
We didn't implement <b:radioButton />
yet, but you can simulate it by adding a hidden input field and some JavaScript code:
<b:panel title="Survey" look="primary">
<p>Which Java version do you use?</p>
<div class="radio">
<label onclick="$('.hidden-optradio').val(7)">
<input type="radio" name="optradio" value="7" />
Java 7
</label>
</div>
<div class="radio">
<label onclick="$('.hidden-optradio').val(8)">
<input type="radio" name="optradio" value="8" />
Java 8
</label>
</div>
<h:inputText value="#{radiobuttonBean.javaVersion}" styleClass="hidden-optradio" pt:type="hidden" />
<script>$('input[name=optradio][value=#{radiobuttonBean.javaVersion}]').attr("checked", "checked");</script>
<b:commandButton value="submit your choice" action="#{radiobuttonBean.submit}" look="primary" />
<b:messages />
</b:panel>
If you need AJAX, implement it by adding a hidden <b:commandButton update="someRegion" onclick="ajax:myBean.myMethod()" />
and call the click()
method of this button in the onclick
handlers of the labels:
<label onclick="$('.hidden-optradio').val(8);$(.ajax-button).click();">
<input type="radio" name="optradio" value="8" />
Java 8
</label>
</div>
...
<b:commandButton value="submit your choice"
action="#{radiobuttonBean.submit}" look="primary"
update="@form"
style-class="hidden ajax-button"
/>
这篇关于如何将无线电输入形式转换为无线电输入bootsfaces形式?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!