[英]How do I find in jQuery whether a p:selectBooleanCheckbox has been checked or not
I need to know how to iterate through a list of primefaces p:selectBooleanCheckbox elements and find out rather or not they have been checked. 我需要知道如何遍历素数列表p:selectBooleanCheckbox元素,并找出它们是否已被检查。 I have found out how to find them but not how to actually get rather or not they are true or false, I was wondering if anyone here would be able to assist with this. 我已经找到了如何找到它们的方法,却没有找到实际上是正确还是错误的方法,我想知道这里是否有人可以帮助您。
In as little code as possible this is what I am currently doing to get the actual element returned to me, I have used the jquery :checked as well as .val() and a few other methods but none seem to work. 我正在使用尽可能少的代码来将实际元素返回给我,我使用了jquery:checked以及.val()和其他一些方法,但似乎没有任何作用。 I have also tried sifting through the code in the element object in the console looking for anything that stands out and I haven't been able to find anything either. 我还尝试过筛查控制台中element对象中的代码,以查找突出的内容,但我也找不到任何内容。 Any help would be greatly appreciated. 任何帮助将不胜感激。
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<body>
<ui:composition template="./../../WEB-INF/template.xhtml">
<ui:define name="content">
<div style="margin-bottom: 350px;">
<p:outputLabel for="coop_sent" value="CO-OP Sent"/>
<p:selectBooleanCheckbox name="coop_sent" styleClass="pc" widgetVar="coop_sent" id="coop_sent" value="#{editProjectsBean.pc.co_opSen}"/>
<script type="text/javascript">
for (var propertyName in PrimeFaces.widgets) {
if (PrimeFaces.widgets[propertyName] instanceof PrimeFaces.widget.SelectBooleanCheckbox){
if (PrimeFaces.widgets[propertyName].widgetVar === 'coop_sent') {
console.log($('PrimeFaces.widgets[propertyName].widgetVar.coop_sent'));
}
}
}
</script>
</div>
</ui:define>
</ui:composition>
</body>
</html>
As to the concrete question, the associated widget object has just a isChecked()
function. 对于具体问题,关联的窗口小部件对象只有一个isChecked()
函数。
<p:selectBooleanCheckbox widgetVar="foo" ... />
var checked = PF("foo").isChecked();
See also this blog for an introduction on how to explore the widget var and all available functions. 另请参阅此博客 ,以获取有关如何探索小部件var和所有可用功能的介绍。
As to the actual functional requirement, the question is a bit confusing and ambiguous as you seem to be interested in scanning through multiple checkbox components, but the jQuery code snippet is actually interested in only one. 至于实际的功能需求,这个问题有点令人困惑和模棱两可,因为您似乎对扫描多个复选框组件感兴趣,但是jQuery代码片段实际上只对其中一个感兴趣。 I guess that you're actually including this code snippet multiple times in an iteration, but you faced the problem that you ultimately found only one <p:selectBooleanCheckbox>
widget in PrimeFaces.widgets
which made you to ask this overly generic question. 我猜您实际上在一次迭代中多次包含了此代码段,但是您遇到的问题是,您最终在PrimeFaces.widgets
仅找到一个<p:selectBooleanCheckbox>
小部件,这使您不得不问这个过于笼统的问题。
You should be suffixing the widget var name with eg the iteration index or so. 您应该为小部件的var名称加上后缀,例如迭代索引。
<p:selectBooleanCheckbox widgetVar="foo_#{index}" ... />
A (better) alternative is to just give them all a common style class and traverse the HTML DOM tree instead. (更好的)替代方法是只给它们一个通用的样式类,然后遍历HTML DOM树。 There's a hidden <input type="checkbox">
which you could just grab and check the checked
state. 有一个隐藏的<input type="checkbox">
,您可以抓住它并检查checked
状态。
<p:selectBooleanCheckbox ... styleClass="pc" />
if ($(".ui-chkbox.pc input[type=checkbox]:checked").length) {
// At least one is checked.
}
Well from what I've tried, using this tag: 根据我的尝试,使用此标记:
<p:selectBooleanCheckbox value="#{Bean.checkbox}" styleClass="test"/>
the rendered html is this: 呈现的html是这样的:
<div id="tableForm:j_id868283402_33c0fe0b" class="ui-chkbox ui-widget test">
<div class="ui-helper-hidden-accessible">
<input id="tableForm:j_id868283402_33c0fe0b_input" type="checkbox" name="tableForm:j_id868283402_33c0fe0b_input">
</div>
<div class="ui-chkbox-box ui-widget ui-corner-all ui-state-default ui-state-active">
<span class="ui-chkbox-icon ui-icon ui-c ui-icon-blank"></span>
</div>
</div>
toggling the checkbox would just replace the ui-icon-blank
to ui-icon-check
in the <span>
tag and vice versa. 切换复选框只会将<span>
标记中的ui-icon-blank
替换为ui-icon-check
,反之亦然。
I added styleClass="test"
in the <p:selectBooleanCheckbox>
tag. 我在<p:selectBooleanCheckbox>
标记中添加了styleClass="test"
。 I think you can just use this .test .ui-chkbox-box > span
to select the <span>
tag and determine the values in its class attribute whether it's blank or checked. 我认为您可以只使用此.test .ui-chkbox-box > span
选择<span>
标记并确定其class属性中的值是空白还是选中。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.