使用AJAX和__doPostBack的datagrid中的Asp.net UserControls

Question

我正在使用帶有AJAX的ASP.NET構建類似於以下內容的網站

http://sanjosepizzaexpress.com/order-online/

如果向下滾動到食物菜單，然后單擊中間欄上的一個食物項目，您會看到該項目向下擴展，以便用戶提供要訂購的菜單項目詳細信息。 沒有頁面重新加載。

我正在嘗試在C＃中使用Javaccript使用帶有AJAX的ASP.NET獲得這種效果。 我有一些問題。

我想擴展每個食品菜單項並顯示數據庫中的項詳細數據，而無需重新加載完整的頁面。 在我的嘗試中（下面的代碼），每次我每次瀏覽單個項目時，總是會重新加載整個頁面，並擴展每個菜單項。

我的食物菜單由單列數據綁定的asp：datagird組成。 每個datagird項目都是一個用戶控件（OM：MnuItem）：

<asp:datagrid Runat="server">
   <Columns>
     <asp:TemplateColumn>
        <ItemTemplate>
          <OM:MenuItem ID="MenuItem1" ...  runat="server" />
        </ItemTemplate>
     </asp:TemplateColumn>
  </Columns>
</asp:datagrid>

MenuItem.ascx具有2個div。 一個div（menuItemDisplay）具有MenuItem的名稱，等等。它最初顯示在食物菜單數據網格中。 當用戶單擊菜單中的menuItemDisplay div時，javascript DisplayItem函數將顯示第二個div（itemDetails）。 MenuItem.ascx包含UpdatePanel和ContentTemplate：

<asp:UpdatePanel  ID="UpdatePanel1" UpdateMode="Always" ChildrenAsTriggers="true" runat="server">

<ContentTemplate>

<div id="menuItemDisplay" onclick="DisplayDetails();">
<table   >
    <tr>
        <td align="left" style="width:90%;">
            <table >
               <tr>
                 <td >
                     <asp:Label ID="nameLbl" runat="server" />
                </td>
       ... etc ...
    </tr>
</table>

<div id="itemDetails" style="visibility:hidden;" runat="server">
  ... item details ...
</div>
</div>

</ContentTemplate>

</asp:UpdatePanel>

JavaScript DisplayDetails函數：

function DisplayDetails() 
{
    __doPostBack("DisplayDetails", "");

}

MenuItem.ascx.cs Page_Load：

protected void Page_Load(object sender, EventArgs e)
{
   if (IsPostBack)
  {
       if (Request.Form["__EVENTTARGET"] == "DisplayDetails")
       {
           itemDetails.Style.Value = "visibility:visible";
        }
   }
}

MenuItem.ascx.cs Page_Load：

protected void Page_Load(object sender, EventArgs e)
{
   if (IsPostBack)
  {
       if (Request.Form["__EVENTTARGET"] == "DisplayDetails")
       {
           itemDetails.Style.Value = "visibility:visible";
        }
   }
}

ScriptManager在default.aspx中：

<asp:ScriptManager EnablePartialRendering="true"
 ID="ScriptManager1"  runat="server"></asp:ScriptManager>

同樣，我的問題是：每次我重讀單個項目時，總是會重新加載整個頁面，並且會擴展每個菜單項。

有人有什么想法嗎？ 謝謝帶。

Answer 1

如果您以UpdatePanel本身為目標，則可以使用__doPostBack（）刷新UpdatePanel 。

這是Dave Ward的工作方式：

<div id="Container" onclick="__doPostBack('UpdatePanel1', '');">