如何使用jQuery检查是否选中了p:selectMany复选框的第二个或第六个f:selectItem

我正在使用PrimeFaces 3.4 <p:selectManyCheckbox>。我想知道用户是否检查了第二个或第六个选择项目。

以下是相关代码：

<h:form id="signup-form">
    <p:commandButton type="button" value="Export" icon="ui-icon-extlink" onclick="exportChart()"/>  
    <p:selectManyCheckbox id="ja"  layout="pageDirection">  
        <f:selectItem id="hola" itemLabel="Importadores." itemValue="1" />  
        <f:selectItem itemLabel="Distribuidores nacionales o regionales." itemValue="1" />  
        <f:selectItem itemLabel="Cadenas de Supermercados." itemValue="1" /> 
        <f:selectItem itemLabel="Otros minoristas de venta a cliente final." itemValue="1" />  
        <f:selectItem itemLabel="Hoteles, restaurantes, cafeterías o similares." itemValue="1" />  
        <f:selectItem itemLabel="Cliente final particular." itemValue="2" /> 
        <f:selectItem itemLabel="Cliente final empresas." itemValue="2" />
    </p:selectManyCheckbox>
</h:form>

单击命令按钮时执行的exportChart()函数如下：

<script>
    function exportChart() {  
        alert($(PrimeFaces.escapeClientId('signup-form:ja:hola')).is(':checked'));
    }  
</script>

但是，它总是提醒false。如何检查用户是否已选中第二个或第六个选择项目？

你在那里的<p:selectManyCheckbox>基本上生成了以下 HTML（省略了所有 jQuery UI 幻想）：

<input id="signup-form:ja:0" name="signup-form:ja" type="checkbox" value="1">
<input id="signup-form:ja:1" name="signup-form:ja" type="checkbox" value="1">
<input id="signup-form:ja:2" name="signup-form:ja" type="checkbox" value="1">
<input id="signup-form:ja:3" name="signup-form:ja" type="checkbox" value="1">
<input id="signup-form:ja:4" name="signup-form:ja" type="checkbox" value="1">
<input id="signup-form:ja:5" name="signup-form:ja" type="checkbox" value="2">
<input id="signup-form:ja:6" name="signup-form:ja" type="checkbox" value="2">

因此，以下jQuery应该可以做到这一点：

if ($("input[name='signup-form:ja']:eq(1)").is(":checked")) {
    alert("The second item is checked");
}
if ($("input[name='signup-form:ja']:eq(5)").is(":checked")) {
    alert("The sixth item is checked");
}

请注意，索引从零开始。

与具体问题无关，但是我会相应地修复项目值，以便它们都是唯一的，否则您将在服务器端根本不知道确切检查了哪些项目——它是提交给服务器端的项目值，而不是项目标签。使用唯一项值，您还可以在 jQuery 中更可靠地确定选中的值。基于项目索引是很古怪的，因为它是不可维护的（例如，如果您需要根据某些业务需求重新排列或扩展项目，则必须修复所有脚本）。

您好，我解决了如何检查的问题，我做了 3 件事：

1-我放了一个id来选择ManyCheckBox，并为每个* selectItem创建了inputext type=hidden 。`

                                <p:selectManyCheckbox  id="many1" value="#{cuestionarioController.pd2Opciones}" layout="pageDirection">  
                                    <f:selectItem itemLabel="Centroamerica." itemValue="3" />  
                                    <f:selectItem itemLabel="Mexico." itemValue="4" />  
                                    <f:selectItem itemLabel="Estados Unidos/Canada." itemValue="5" /> 
                                    <f:selectItem itemLabel="Brasil." itemValue="5" />  
                                    <f:selectItem itemLabel="Sudamérica." itemValue="4" /> 
                                    <f:selectItem itemLabel="Caribe." itemValue="5" /> 
                                    <f:selectItem itemLabel="España." itemValue="5" /> 
                                    <f:selectItem itemLabel="Otros países europeos." itemValue="6" />
                                    <f:selectItem itemLabel="China." itemValue="6" />
                                    <f:selectItem itemLabel="Otros." itemValue="2" />
                                    <f:selectItem itemLabel="La empresa no ha comenzado a exportar de forma regular." itemValue="0" />
                                    <p:ajax listener="#{cuestionarioController.sumarOpciond2}"/>
                                </p:selectManyCheckbox>
                            </p:panelGrid>
                            <p:inputText id="texto1" type="hidden" value="#{cuestionarioController.pi.vali1D2}" /> 
                            <p:inputText id="texto2" type="hidden" value="#{cuestionarioController.pi.vali2D2}" />  
                            <p:inputText id="texto3" type="hidden" value="#{cuestionarioController.pi.vali3D2}" />  
                            <p:inputText id="texto4" type="hidden" value="#{cuestionarioController.pi.vali4D2}" />  
                            <p:inputText id="texto5" type="hidden" value="#{cuestionarioController.pi.vali5D2}" />  
                            <p:inputText id="texto6" type="hidden" value="#{cuestionarioController.pi.vali6D2}" />  
                            <p:inputText id="texto7" type="hidden" value="#{cuestionarioController.pi.vali7D2}" />  
                            <p:inputText id="texto8" type="hidden" value="#{cuestionarioController.pi.vali8D2}" />  
                            <p:inputText id="texto9" type="hidden" value="#{cuestionarioController.pi.vali9D2}" />  
                            <p:inputText id="texto10" type="hidden" value="#{cuestionarioController.pi.vali10D2}" />  
                            <p:inputText id="texto11" type="hidden" value="#{cuestionarioController.pi.vali11D2}" />  
                        </p:outputPanel>`

2-在javascript中调用函数的命令按钮。

<p:commandButton type="button" value="Resultado" onclick="validate()"/>

3-我调用的函数Javascript验证，在此我使用了primefaces的escapeClientId，这是jquery中他的组件的引用。重要的是引用，我查看了基本上由 HTML 中的素数生成的代码"formInternacionalizacion：tabPreg_Inter：many1：0"，第一个是表单，第二个是 TabView，第三个是 selectManyCheckBox，最后一个是 selectItem 的位置。因此，当复选框更改此设置输入文本时

function validate() {  
              //de2
            if($(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:many1:0')).is(':checked') == true){ 
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto1')).val("1");
            }else{
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto1')).val("0");
            }
            if($(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:many1:1')).is(':checked') == true){ 
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:text2')).val("1");
            }else{
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto2')).val("0");
            }
            if($(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:many1:2')).is(':checked') == true){ 
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto3')).val("1");
            }else{
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto3')).val("0");
            }
            if($(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:many1:3')).is(':checked') == true){ 
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto4')).val("1");
            }else{
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto4')).val("0");
            }
            if($(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:many1:4')).is(':checked') == true){ 
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto5')).val("1");
            }else{
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto5')).val("0");
            }
            if($(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:many1:5')).is(':checked') == true){ 
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto6')).val("1");
            }else{
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto6')).val("0");
            }
            if($(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:many1:6')).is(':checked') == true){ 
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto7')).val("1");
            }else{
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto7')).val("0");
            }
            if($(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:many1:7')).is(':checked') == true){ 
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto8')).val("1");
            }else{
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto8')).val("0");
            }
            if($(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:many1:8')).is(':checked') == true){ 
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto9')).val("1");
            }else{
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto9')).val("0");
            }
            if($(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:many1:9')).is(':checked') == true){ 
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto10')).val("1");
            }else{
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto10')).val("0");
            }
            if($(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:many1:10')).is(':checked') == true){ 
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto11')).val("1");
            }else{
                $(PrimeFaces.escapeClientId('formInternacionalizacion:tabPreg_Inter:texto11')).val("0");
            }
            location.href ="resultadoGraficoMedia.xhtml";
        }

相关内容

最新更新

热门标签：