I have used checkboxes for checking the mails in my mailing system which is developed in Java.

I want to check all the checkboxes on the click of upper checkbox, but the problem is there that checkboxes are displayed in the the loop according to number of mails retrieved.

Please help me where should i put the javascript code to solve this problem.

The loop code of inbox is given below:

<tr >
        <% for(int i=0;i<messageList.size();i++) { message = (Message)messageList.get(i);%>
        <td width="10%" height="33" align="left"   valign="top" bgcolor="#EEE" >
        <!--This link display the full message-->


        <input name="Mark_Mail" id="mark_mail" onclick="myfunction(this);" type="checkbox" value="<%=message.getMailId()%>" width="50" height="30" align="top" >
        <span id="space1" style="padding:2px"></span>

        <!--Check all the Checkboxes-->
        <script type="text/javascript">
        function checkAll()
        {
            document.getElementById('mark_mail').checked = "true";
        }

        </script>

        <img  src="Images/UnStarred.jpg" height="15" border="0"  id="image1" onclick="swapImage()" />
        <span id="space1" style="padding:2px"></span>
        </td>
        <td width="90%" height="33" align="left" colspan="7"  valign="bottom" bgcolor="#EEE" >
        <!--This link display the full message-->
        <a  id="link" href="viewMail.jsp?mailId=<%=message.getMailId()%>&isAttach=<%=message.getAttachmentFlag()%>">
        <!--Display Sender Address-->
        <font color="#000000" size="1"><strong><%=message.getSenderAddress()%></strong></font>
        <span id="space1" style="padding:6px"></span>

        <!--For Display Message Subject-->
        <font color="#000000" size="1"><strong><%=message.getSubject()%></strong></font>
        <span id="space1" style="padding:6px"></span>

        <!--For Display Attachment Image-->
        <%if(message.getAttachmentFlag().equals("1")){%><input type="hidden" name="filename" id="filename" value="<%=message.getFileName()%>" /><input type="hidden" name="filesize" id="filesize" value="<%=message.getFileSize()%> /><img src ="Images/attachment.jpg" style="bgcolor: #EEE" /><%}else{%><span style="padding-left:12px" ></span><%}%>
        <span id="space1" style="padding:6px"></span>

        <!--For Display Time and Date of messaging-->
        <font color="#000000" size="1"><strong><%=message.getTimestamp()%><span style="padding-left:5px"></span><%=message.getDate()%><input type="hidden" name="label" value="<%=message.getLabel()%>"></strong></font>
        </a></td>
        </tr><% } %>

I have used checkboxes for checking the mails in my mailing system which is developed in Java.

I want to check all the checkboxes on the click of upper checkbox, but the problem is there that checkboxes are displayed in the the loop according to number of mails retrieved.

Please help me where should i put the javascript code to solve this problem.

The loop code of inbox is given below:

<tr >
        <% for(int i=0;i<messageList.size();i++) { message = (Message)messageList.get(i);%>
        <td width="10%" height="33" align="left"   valign="top" bgcolor="#EEE" >
        <!--This link display the full message-->


        <input name="Mark_Mail" id="mark_mail" onclick="myfunction(this);" type="checkbox" value="<%=message.getMailId()%>" width="50" height="30" align="top" >
        <span id="space1" style="padding:2px"></span>

        <!--Check all the Checkboxes-->
        <script type="text/javascript">
        function checkAll()
        {
            document.getElementById('mark_mail').checked = "true";
        }

        </script>

        <img  src="Images/UnStarred.jpg" height="15" border="0"  id="image1" onclick="swapImage()" />
        <span id="space1" style="padding:2px"></span>
        </td>
        <td width="90%" height="33" align="left" colspan="7"  valign="bottom" bgcolor="#EEE" >
        <!--This link display the full message-->
        <a  id="link" href="viewMail.jsp?mailId=<%=message.getMailId()%>&isAttach=<%=message.getAttachmentFlag()%>">
        <!--Display Sender Address-->
        <font color="#000000" size="1"><strong><%=message.getSenderAddress()%></strong></font>
        <span id="space1" style="padding:6px"></span>

        <!--For Display Message Subject-->
        <font color="#000000" size="1"><strong><%=message.getSubject()%></strong></font>
        <span id="space1" style="padding:6px"></span>

        <!--For Display Attachment Image-->
        <%if(message.getAttachmentFlag().equals("1")){%><input type="hidden" name="filename" id="filename" value="<%=message.getFileName()%>" /><input type="hidden" name="filesize" id="filesize" value="<%=message.getFileSize()%> /><img src ="Images/attachment.jpg" style="bgcolor: #EEE" /><%}else{%><span style="padding-left:12px" ></span><%}%>
        <span id="space1" style="padding:6px"></span>

        <!--For Display Time and Date of messaging-->
        <font color="#000000" size="1"><strong><%=message.getTimestamp()%><span style="padding-left:5px"></span><%=message.getDate()%><input type="hidden" name="label" value="<%=message.getLabel()%>"></strong></font>
        </a></td>
        </tr><% } %>

• javascript
• jsp

• 8 Please, for your own safety: Java is not JavaScript. – Kobi Commented May 15, 2011 at 10:39
• 1 @Kobi the real question here is indeed JavaScript, however it's hard to see this indeed. – Shadow Wizzard Commented May 15, 2011 at 10:46
• 2 Next time, please show your markup and code as it is sent to the browser (use ‘View Source’), so we don't have to figure out what the resulting HTML will look like. After all, this is what JavaScript will see. – Marcel Korpel Commented May 15, 2011 at 11:13

1 Answer 1

You need to get the elements by their name, as ID must be unique:

function checkAll() {
   var arrMarkMail = document.getElementsByName("mark_mail");
   for (var i = 0; i < arrMarkMail.length; i++) {
      arrMarkMail[i].checked = true;
   }
}

Just place this code in the <head> section of the page.

To call it, have such checkbox wherever you like: Master: <input type="checkbox" onclick="checkAll();" />
However this better be done by a button:

<button type="button" onclick="checkAll();">Check All</button>