Ajax CollapsiblePanelExtender在回發時保持狀態

Question

我有一個gridview。 里面有一個包含按鈕的CollapsiblePanelExtender。 當我按下按鈕時，這會導致回發並且CollapsiblePanelExtender關閉。 我正在嘗試撰寫一種解決方案，以使CollapsiblePanelExtender在發回郵件后保持打開狀態。 到目前為止，這是我嘗試過的：

function pageLoad(sender, args) {
   var objExtender;                
   var retval="";               

   if (document.getElementById(GridView1)) {
      retval = document.getElementById(GridView1);
   }
   var CollapsiblePanelExtender1 = retval.getElementsByTagName("CollapsiblePanelExtender1");

   if(CollapsiblePanelExtender1.get_Collapsed()) {
      CollapsiblePanelExtender1.set_Collapsed(true);
   }
   else {
      CollapsiblePanelExtender1.set_Collapsed(false);
   }
}

Answer 1

基本上，CollapsiblePanelExtender在回發期間保持其狀態。 但是在回發期間，我想您要執行數據綁定（我想您已經這樣做了）。 在數據綁定期間，將重新創建所有控件，這就是為什么它們會松動其內部狀態的原因。

為了解決您的問題，我建議您在執行數據綁定之前先保存CollapsiblePanelExtender的狀態，然后再恢復該狀態。 這可以在服務器端完成。 如果啟用了動畫，這也將有助於避免UI閃爍。

因此，要獲取CollapsiblePanelExtender的狀態，您只需記住它的客戶端狀態值即可。 然后，您將能夠恢復該值。 例如，以下代碼可用於在服務器端擴展/折疊CollapsiblePanelExtender：

// To collapse panel.
this.CollapsiblePanelExtender1.ClientState = "true";

// To Expand panel.
this.CollapsiblePanelExtender1.ClientState = "false";

如果您仍然想在客戶端折疊/展開CollapsiblePanelExtender，則需要以下代碼：

Sys.Application.add_load(function() {
    var extender = $find('<%= this.CollapsiblePanelExtender1.ClientID  %>');

    extender.expandPanel();

    extender.collapsePanel();
});

編輯這無濟於事，因為您嘗試在點擊處理程序中還原狀態。 當您調用網格視圖控件的databind時，不會立即重新創建行。 因此，如果要設置（還原）可折疊擴展器控件的狀態，最好在網格的RowCreated事件處理程序中進行。

例如，您可以使用類似於以下代碼：

    protected void GridView_OnRowCreated(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow && SomeValueToIdentifyThatThisPanelShouldBeExpanded)
        {
            CollapsiblePanelExtender extender =
                e.Row.FindControl("CollapsiblePanelExtender1") as CollapsiblePanelExtender;
            extender.ClientState = "false";
        }
    }

Answer 2

我實際上在我的博客上使用了這些控件，因為asp.net允許我通過中繼器控件使用可折疊面板進行拖放。

技巧是在打開面板時在內容中添加ajax。 您可以輕松地在內容中進行jQuery，以從Web服務中插入頁面或Ajax。

這是帶有可折疊內容的可折疊面板的示例。 面板由Web服務加載。 單擊以展開面板。

http://gosylvester.com/blog.aspx?id=39

Answer 3

您是否嘗試過在可折疊面板擴展器上設置SuppressPostBack =“ True”