Question

在jsp中，我有两个表可供两种不同类型的用户（管理员和秘书）查看。这些表格有下载多个文件的复选框。

我有一个奇怪的（我认为）情况，只有一种类型的用户（管理员）可以通过点击第一个表格列附近的复选框来检查所有复选框。

我想首先向您展示有关这些表的代码。

<script type="text/javascript">
$(document).ready(function() {
$("#clickAll").click(function() {
    if($(this).is(':checked'))
       {
         $("input[name='chkdownload']").each(function() {
             $(this).attr("checked",true);
         });
       }
       else
       {
         $("input[name='chkdownload']").each(function() {
             $(this).attr("checked",false);
         });           
       }
    });
});
var countChecked = function() {
    var n = $( "input:checked" ).length; 
    if (n == 0) { 
        alert("Please click at least one record.");
        return false;
    } else {
        return true;
    }

}; 
</script>

<div class="content">
<s:form namespace="/DownloadFile" action="download_getSelectedFile" method="POST" enctype="multipart/form-data">

<!--for administrator users to view -->
<div class="usrAdmin usrAccess" style="display:none">
<display:table name="${equipmentList}" class="its" uid="row"
    sort="list" pagesize="10" requestURI="equipment_view" export="false" defaultsort="1" defaultorder="descending">
  <display:columntitle="<input type='checkbox' name='selectall' id='clickAll'/>"><s:checkbox theme="simple" name="chkdownload" fieldValue='%{#attr.row.recordId}' /></display:column>
  <display:column property="equipName" title="Equipment Name" />
  <display:column property="equipLocation" title="Equipment Location" />
  <display:column property="equipOfficer" title="Equipment Officer" />
  </display:table>
</div>

   <!--for secretary users to view -->
   <div class="usrSec usrAccess" style="display:none">
<!-- put row2 to make the table uid unique -->
<display:table name="${equipmentList}" class="its" uid="row2"
    sort="list" pagesize="10" requestURI="equipment_view" export="false" defaultsort="1" defaultorder="descending">
  <display:column title="<input type='checkbox' name='selectall' id='clickAll'/>"><s:checkbox theme="simple" name="chkdownload" fieldValue='%{#attr.row.recordId}' /></display:column>
  <display:column property="equipName" title="Equipment Name" />
  <display:column property="equipLocation" title="Equipment Location" />
  <display:column property="equipOfficer" title="Equipment Officer" />
</display:table>
</div>

<input type="submit" value="Download Selected"/>
</s:form>
</div>

当我运行程序时，如果我切换到秘书模式，我单击标题栏附近的复选框，它不会选中所有复选框。它只在复选框中显示“勾号”符号。但是，如果我切换到管理员模式，我单击复选框，它可以选中所有复选框。

一开始，我想也许我在jquery中错误输入了错误的名称，但我查看了代码，两个表都调用相同的输入“chkdownload”。

我已阅读this和this帖子中的解决方案，但我认为我的情况与他们不同。

我在代码中哪个部分做错了？似乎没有拼写错误。否则，管理员模式下的复选框也不起作用。

有人会让我知道我的错误吗？

更新

我按照@reporter的说明进行操作。我从Internet Explorer（IE）复制html源代码。我看到生成了更多代码，我想在下面显示它以供您审核。谢谢。

<div class="content">

<form id="download_getSelectedFile" name="download_getSelectedFile" onsubmit="return(countChecked());beginDownload();" action="/RIDW/Download/download_getSelectedFile.action" method="POST" enctype="multipart/form-data">
<!--for administrator users to view -->
<div class="usrAdmin usrAccess" style="display:none;">
<span class="pagebanner">2 records  found, displaying all pages.</span> 
<span class="pagelinks">Page 1</span>
<table id="row" class="its">
<thead>
<tr>
<th><input type='checkbox' name='selectall' id='clickAll'/></th>
<th class="sortable">
<a href="equipment_view?d-16544-s=1&amp;d-16544-o=2&amp;d-16544-p=1">Equipment Name</a></th>
<th class="sortable">
<a href="equipment_view?d-16544-s=2&amp;d-16544-o=2&amp;d-16544-
p=1">Location</a></th>
<th class="sortable sorted order2">
<a href="equipment_view?d-16544-s=3&amp;d-16544-o=2&amp;d-16544-
p=1">Equipment Officer</a></th></tr></thead>
<tbody>
<tr class="odd">
<td><input type="checkbox" name="chkdownload" value="427b0a45dd714d95bd11374b5a2d56b4" id="download_getSelectedFile_chkdownload"/><input type="hidden" id="__checkbox_download_getSelectedFile_chkdownload" name="__checkbox_chkdownload" value="427b0a45dd714d95bd11374b5a2d56b4" /></td>
<td>Equipment 001</td>
<td>Location A-1</td>
<td>Officer A</td></tr>
<tr class="even">
<td><input type="checkbox" name="chkdownload" 
value="76f888d5bb3740aabef70c5f50bea7d9" 
id="download_getSelectedFile_chkdownload"/><input type="hidden" 
id="__checkbox_download_getSelectedFile_chkdownload" 
name="__checkbox_chkdownload" value="76f888d5bb3740aabef70c5f50bea7d9" />
</td>
<td>Equipment 002</td>
<td>Location A-2</td>
<td >Officer S</td></tr>
</tbody></table>    
</div>

<!--for secretary users to view -->
<div class="usrSec usrAccess" style="display:none;">
<span class="pagebanner">2 records  found, displaying all pages.</span> 
<span class="pagelinks">Page 1</span>
<!-- put row2 to make the table id unique -->
<table id="row2" class="its">
<thead>
<tr>
<th><input type='checkbox' name='selectall' id='clickAll'/></th>
<th class="sortable">
<a href="equipment_view?d-16544-s=1&amp;d-16544-o=2&amp;d-16544-p=1">Equipment Name</a></th>
<th class="sortable">
<a href="equipment_view?d-16544-s=2&amp;d-16544-o=2&amp;d-16544-p=1">Location</a></th>
<th class="sortable sorted order2">
<a href="equipment_view?d-16544-s=3&amp;d-16544-o=2&amp;d-16544-p=1">Equipment Officer</a></th></tr></thead>
<tbody>
<tr class="odd">
<td ><input type="checkbox" name="chkdownload" value="427b0a45dd714d95bd11374b5a2d56b4" id="download_getSelectedFile_chkdownload"/><input type="hidden" id="__checkbox_download_getSelectedFile_chkdownload" name="__checkbox_chkdownload" value="427b0a45dd714d95bd11374b5a2d56b4" /></td>
<td >Equipment 001</td>
<td >Location A-1</td>
<td >Officer A</td></tr>
<tr class="even">
<td ><input type="checkbox" name="chkdownload" value="76f888d5bb3740aabef70c5f50bea7d9" id="download_getSelectedFile_chkdownload"/><input type="hidden" id="__checkbox_download_getSelectedFile_chkdownload" name="__checkbox_chkdownload" value="76f888d5bb3740aabef70c5f50bea7d9" /></td>
<td >Equipment 002</td>
<td>Location A-2</td>
<td >Officer S</td></tr>
</tbody></table>    

</div>
    <br>
    <input type="submit" value="Download Selected"/>    
 </form>
</div>

更新2

对于秘书表，在jsp代码中，我把row2用于uid，在html源代码中我把row2作为id。我运行应用程序，该表仍然无法检查所有复选框，而另一个表工作正常。

虽然我已更新内容中的代码，但我会提取下面有关id部分的完整代码，以便您快速查看。谢谢。

jsp中的代码

<!--for administrator users to view -->
<display:table name="${equipmentList}" class="its" uid="row"
sort="list" pagesize="10" requestURI="equipment_view" export="false" defaultsort="1" defaultorder="descending">

 <!--for secretary users to view -->
<display:table name="${equipmentList}" class="its" uid="row2"
sort="list" pagesize="10" requestURI="equipment_view" export="false" defaultsort="1" defaultorder="descending">

html源代码中的代码

<!--for administrator  users to view -->
<table id="row" class="its">

 <!--for secretary users to view -->
 <table id="row2" class="its">

Answer 1

不是最好的解决方案，但它有效。

只需复制该函数使用其他名称来定义将使用它的表。例如

 <display:columntitle="<input type='checkbox' name='selectall' id='clickAll_Admin'/>"><s:checkbox theme="simple" name="chkdownload_Admin" fieldValue='%{#attr.row.recordId}' /></display:column>


  <display:columntitle="<input type='checkbox' name='selectall' id='clickAll_Sec'/>"><s:checkbox theme="simple" name="chkdownload_Sec" fieldValue='%{#attr.row.recordId}' /></display:column>

使用<display：table>在jsp中为两个表应用复选框

1 个答案: