asp.net转发器和jQuery datables分页和复选框不工作

我正在使用jQuery数据表插件以及asp.net转发器。我只是在转发器的第一列中有一个复选框，以允许用户检查他们想要保存到数据库的记录。我有中继器，jquery插件与分页工作100％。我无法解决的问题是，当我在多个页面上选中一个框并点击提交时，我只能获取当前页面复选框，因为所有其他复选框都未选中。asp.net转发器和jQuery datables分页和复选框不工作

.NET标记

<script type="text/javascript"> 
var oTable; 
$(document).ready(function() { 

    oTable = $('#tblList').dataTable({ 
     "bJQueryUI": true, 
     "sPaginationType": "full_numbers", 
     "bServerSide": false, 
     "iDisplayLength": 7, 
     "aaSorting": [[1, "asc"]], 
     "bFilter": true, 
     "bLengthChange": false, 
     "aoColumns": [ 
     /* other columns */null, null, null, null], 
     "sDom": 'T<"toolbar">lrtip' 
    }); 
}); 
</script> 
<asp:Panel ID="pnlPages" runat="server" Visible="false"> 
<asp:Repeater ID="rptList" runat="server" OnItemDataBound="RptList_ItemDataBound"> 
     <HeaderTemplate> 
      <table id="tblList" cellpadding="0" cellspacing="0" border="0" class="display"> 
       <thead> 
        <tr>         
         <th></th>         
         <th>Name</th>           
         <th>Status</th>        
         <th>Modified</th> 
        </tr> 
       </thead> 
      <tbody> 
     </HeaderTemplate> 
     <ItemTemplate> 
       <tr> 
        <asp:HiddenField ID="hdnID" runat="server" Value='<%# Eval("ID") %>' /> 
        <td style="width: 5%"><asp:CheckBox ID="chkSelected" runat="server" OnCheckedChanged="Save_OnChecked" AutoPostBack="true" value='<%# Eval("ID") %>' /></td> 
        <td style="width: 47%"><%# Eval("Name")%></td> 
        <td style="width: 7%"><%# Eval("Status") %></td> 
        <td style="width: 25%"><%# ((DateTime)Eval("DateModified")).ToShortDateString() %></td> 
       </tr> 
     </ItemTemplate> 
     <FooterTemplate> 
      </tbody> 
     </table> 
     </FooterTemplate> 
    </asp:Repeater> 
    </asp:Panel>

在页面加载我叫下面的方法，并提供清单

public void DisplayList(List<MyPages> list) 
    { 
     rptList.DataSource = list; 
     rptList.DataBind(); 
     pnlPages.Visible = true; 
    }

这这种方法从数据库中检查框

protected void RptList_ItemDataBound(Object Sender, RepeaterItemEventArgs e) 
    { 
     string groupID = !string.IsNullOrEmpty(Request.QueryString["id"]) ? Request.QueryString["id"] : string.Empty; 
     if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem) 
     { 
      HiddenField pageID = (HiddenField)e.Item.FindControl("hdnID"); 
      GroupPage groupPage = groupsPresenter.GetByKeys(new Guid(groupID), new Guid(pageID.Value)); 

      if (groupPage != null) 
      { 
       CheckBox chk = (CheckBox)e.Item.FindControl("chkSelected"); 
       chk.Checked = true; 
      } 
     } 
    }

所有上述代码的作品。这是停止工作的地方。当用户选中一个框时，将执行以下代码。

protected void Save_OnChecked(object sender, EventArgs e) 
    { 
     CheckBox chk = (CheckBox)sender; 
     string id = chk.Attributes["value"].ToString(); 
    }

我在调试的时候，如果我有4行第1页上的检查，我去到第2页，并取消一箱Save_OnChecked事件被称为所有的复选框的主页成为选中的注意。所以Save_OnChecked总共被调用5次。

如果我没有使用数据表分页和第一页上的所有记录，那么它工作得很好。希望这是有道理的，我希望有人能帮助我。

来源

2012-02-02 Joe

jquery datatables插件在发生分页事件时完全替换所有的DOM元素。上一页的数据被完全删除，因此丢失。

您可能需要在jQuery插件更改页面时发送AJAX帖子，或将数据保存在您自己的JavaScript中以保留在其他页面上选择了哪些复选框。两种解决方案都可以工作。这取决于你想要做什么样的节约。在更换页面时自动保存，或者将列表保存在内存中，直到他们点击保存/发布按钮。

然后，您将通过您的C＃代码隐藏（Save_OnChecked）将读入的自定义AJAX/POST参数将您保存在JavaScript内存中的所有选中项目发送到您的服务器，而不是直接读取表单复选框值，因为这些只会显示最近显示的页面的数据。

datatables插件的fnPageChange（API documentation）似乎没有onchange类型的挂钩来绑定您的JavaScript函数以保存JS中页面更改事件的数据。您可能需要修改插件才能调用您的自定义代码。或者你可以设置一个jQuery委托来监视页面上的所有点击变化链接插件动态创建。

来源

2012-02-02 23:48:40

asp.net转发器和jQuery datables分页和复选框不工作

回答

相关问题