如何根据驻留在updatePanel中的DataGrid中的行选择更新控件[DataGrid,TextBoxes和Label]?

时间:2011-05-10 12:44:40

标签: c# javascript asp.net asp.net-ajax updatepanel

我有一个网格[Grid1],当点击一个按钮[search]时构建它的dataRows,我设法通过将它放在UpdatePanel中进行Ajax化,它运行正常。在Ajax化Grid 1之前,当点击Grid 1中的一行时,另一个网格[Grid2]和一些其他控件[Text and Labels]用于填充/更新。

Grid2和其他控件用于在网格的OnItemCommand事件上填充/更新1.ItItemCommand中的代码将相关数据绑定到Grid2和其他控件。

将Grid 1放入更新面板后,他们停止了更新。如果我将Grid2和其他控件放在同一个更新面板中,但页面的设计方式使得我不能在与第一个Grid相同的UpdatePanel中使用这些控件,也不打算使用其他更新面板,那么它将正常工作。

我希望我有所作为。我是.Net的新手,所以请原谅。请找到以下代码。

 <asp:ScriptManager EnablePartialRendering="true" ID="ScriptManager1" runat="server"></asp:ScriptManager>
     <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers ="True">
      <ContentTemplate>
       <asp:DataGrid ID="grdJobs" runat="server" AllowPaging="true" 
        AlternatingItemStyle-CssClass="gridAltItemStyle"
        AutoGenerateColumns="False" CellPadding="0" 
        DataKeyField="code"
        CssClass="datagridBox" 
        GridLines="horizontal" 
        PagerStyle-Mode="NumericPages"
        HeaderStyle-CssClass="gridHeaderStyle" 
        ItemStyle-CssClass="gridItemStyle"
        PagerStyle-CssClass="gridPagerStyle" 
        Width="445px" OnPageIndexChanged="grdJobs_PageIndexChanged" OnItemCreated="grdJobs_ItemCreated" OnItemCommand="grdJobs_ItemCommand"             OnItemDataBound="grdJobs_ItemDataBound">
         <Columns>
          <asp:BoundColumn  DataField="J_ID" HeaderText="Job"></asp:BoundColumn>
          <asp:BoundColumn  DataField="Contract" HeaderText="Contract" ReadOnly="True"></asp:BoundColumn>
          <asp:BoundColumn  DataField="J_Fault_Line1" HeaderText="Fault" ReadOnly="True"></asp:BoundColumn>
          <asp:BoundColumn  DataField="j_p_id" HeaderText="Fault" Visible="false" ></asp:BoundColumn>
          <asp:ButtonColumn Text="<img src=images/addFeedback.gif style=border: 0px; alt=Add Feedback>" ButtonType="LinkButton"  HeaderText="Add"                   CommandName="Load" ItemStyle-cssClass="Col_9_Item_2"></asp:ButtonColumn>
         </Columns>
        </asp:DataGrid>
       <asp:ImageButton ID="cmdLkp"  ImageUrl="Images/search.gif" runat="server" OnClick="cmdLkp_Click" />

       </ContentTemplate>
      </asp:UpdatePanel>

后面代码中的代码停止工作

protected void grdJobs_ItemCommand(object source, DataGridCommandEventArgs e)
    {

        if (e.CommandName == "Load")
        {
            functionToBindDataToGrid2();
            functionToBindDataToOtherControls();
        }
}

 protected void grdJobs_ItemDataBound(object sender, DataGridItemEventArgs e)
    {
      e.Item.Attributes.Add("onclick", "javascript:__doPostBack('grdJobs$ctl" + ((Convert.ToInt32(e.Item.ItemIndex + 3).ToString("00"))) + "$ctl00','')");
     }

4 个答案:

答案 0 :(得分:4)

在UpdatePanel的属性中,将更新模式设置为“Conditional”,将ChildrenAsTriggers设置为“true”。

另一种选择是在更新面板内移动按钮,这样您就不必拥有触发器。

答案 1 :(得分:2)

GridView是一个复杂的asp.net服务器控件。在UpdatePanel内部更新Grid1后,您将很难更新Grid2。但是,在Grid1更新后,可以在客户端上执行JavaScript。您可以在更新面板内更新Grid1,在更新Grid1后执行JavaScript,这将更新页面上的HTML。问题是用Javascript更新Grid2将是一项噩梦般的工作量。

以下是我所谈论的一个例子:Ajax Enabled Gridview using JavaScript in ASP.NET。这是一个彻头彻尾的黑客,大量的工作,你的同事会在他们必须维护它时讨厌你。

如果你想更新标签或下拉列表,那么这是可能的,但是使用Javascript更新GridView并在回发中保持这些更新是一项艰巨的挑战。

答案 2 :(得分:1)

在一个页面上使用多个UpdatePanel。它不会影响布局。

然后,您可以使用触发器(对于面板)来影响您想要受影响的控件。

这是一个可以帮助您理解的页面。

http://www.asp.net/ajax/tutorials/understanding-asp-net-ajax-updatepanel-triggers

答案 3 :(得分:1)

您的问题取决于您在行点击时触发回发的方式,即:此方法

protected void grdJobs_ItemDataBound(object sender, DataGridItemEventArgs e)
{
  e.Item.Attributes.Add("onclick", "javascript:__doPostBack('grdJobs$ctl" + ((Convert.ToInt32(e.Item.ItemIndex + 3).ToString("00"))) + "$ctl00','')");
}

手动编写__doPostBack脚本通常总是一个坏主意。我相信你需要使用的是ClientScriptManager.GetPostBackEventReference,它会为你创建一个类似的回发脚本,但会考虑各种其他的东西,包括控件的AJAX化。

尝试这样的事情:

protected void grdJobs_ItemDataBound(object sender, DataGridItemEventArgs e)
{
  e.Item.Attributes.Add("onclick", ClientScriptManager.GetPostBackEventReference(e.Item, string.Empty);
}