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分頁和複選框不工作

回答

相關問題