如何确保只选择了一个h:selectOneRadio按钮

How to make sure only one h:selectOneRadio button is selected

本文关键字:一个 按钮 selectOneRadio 选择 何确保 确保      更新时间:2023-09-26

我有一些javascript代码(我从BalusC借来的),用于确保在表中只选择一个h:selectOneRadio按钮。不幸的是,我从我的玻璃鱼服务器得到了一个格式错误的表达式:

Error Parsing /ClientSearch.xhtml: Error Traced[line: 13] The content of elements must consist of well-formed character data or markup.

注:

 if (elements[i].name.substring(elements[i].name.lastIndexOf(':')) == id) {

似乎是的问题

我也不完全理解javascript(我是一个新手),我希望有人能向我解释一下

以下是完整的javascript:

 function dataTableSelectOneRadio(radio) {
    var id = radio.name.substring(radio.name.lastIndexOf(':'));
    var elements = radio.form.elements;
    for (var i = 0; i < elements.length; i++) {
        if (elements[i].name.substring(elements[i].name.lastIndexOf(':')) == id) {
            elements[i].checked = false;
        }
    }
    radio.checked = true;
}
 </script>  

为什么我会出错?而且,剧本本身似乎是错误的。如果代码不等于id,那么应该是false吗(如下所示)。

 if (elements[i].name.substring(elements[i].name.lastIndexOf(':')) != id) {
    elements[i].checked = false;
 }

显然我不明白。

下面是表的facelets代码:客户端

        <h:column headerText="First Name"  >
            <f:facet name="header"><h:outputText value="First Name" /></f:facet>
            #{client.firstName}
        </h:column>
        <h:column headerText="Last Name"  >
            <f:facet name="header"><h:outputText value="Last Name" /></f:facet>
            #{client.lastName}
        </h:column>
        <h:column headerText="Select"  >
            <f:facet name="header"><h:outputText value="Last Name" /></f:facet>
            <h:selectOneRadio valueChangeListener="#{clientSearchBean.setSelectedItem}" >
                <f:selectItem itemValue="null" />
            </h:selectOneRadio>
        </h:column>
        <h:column headerText="Address"  >
            <f:facet name="header"><h:outputText value="Address" /></f:facet>
            #{client.address}
        </h:column>
        <h:column headerText="Cell"  >
            <f:facet name="header"><h:outputText value="Cell" /></f:facet>
            #{client.cell}
        </h:column>
        <h:column headerText="Phone"  >
            <f:facet name="header"><h:outputText value="Phone" /></f:facet>
            #{client.phone}
        </h:column>
    </h:dataTable>      

我已经尝试过(并且正在使用)<h:dataTable>中的BalusC代码,并且工作得很好。你有两个问题:

  1. 您根本没有使用JavaScript函数(或代码中的JavaScript函数):

    <h:column headerText="Select">
        <f:facet name="header">
            <h:outputText value="Last Name" />
        </f:facet>
        <!-- you forgot to add the onclick -->
        <h:selectOneRadio valueChangeListener="#{clientSearchBean.setSelectedItem}"
            onclick="dataTableSelectOneRadio(this);">
            <f:selectItem itemValue="null" />
        </h:selectOneRadio>
    </h:column>
    
  2. 您的JavaScript代码具有<符号。Facelets对这个符号的使用非常严格。为了使它发挥作用,您应该在Script和Style元素中使用XMLCDATA用法:

    <script type="text/javascript">
    //the CDATA must be used with JavaScript comments
    //<![CDATA[
        function dataTableSelectOneRadio(radio) {
            var id = radio.name.substring(radio.name.lastIndexOf(':'));
            var elements = radio.form.elements;
            for (var i = 0; i < elements.length; i++) {
                if (elements[i].name.substring(elements[i].name.lastIndexOf(':')) == id) {
                    elements[i].checked = false;
                }
            }
            radio.checked = true;
        }
    //]]>
    </script>