如何確保只有一個h：selectOneRadio按鈕被選中

Question

我有一些JavaScript代碼（我從BalusC借來的），用於確保在表中選擇一個h：selectOneRadio按鈕。不幸的是，我從我的GlassFish服務器收到一個格式不正確的表達錯誤：

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:dataTable> 客戶

 <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>  

Answer 1

我試過（和我使用）的BalusC代碼和作品整齊。你有兩個問題：

1. 您沒有使用在所有的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 and Style elements使用XML CDATA用法：

   <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>