我可以将按钮目标控件ID放在asp.net的Modal Popup更新面板之外吗?

时间:2013-07-30 14:20:51

标签: asp.net ajax updatepanel postback modalpopupextender

让我准确地解释一下我的问题。

我在网格视图中有一个按钮。我想要做的是在点击该按钮时显示模态弹出窗口。

因为,我不能将模态弹出扩展器放在gridview中,而是将它放在gridview之外。因为我将它放在gridview之外,所以gridview按钮无法访问它。为此,我在gridview外部创建了一个虚拟按钮,并从Gridview按钮的click事件中调用模态弹出窗口。

让我向您展示我的网格视图(其telerik)

<telerik:RadGrid ID="GridView2" runat="server" AutoGenerateColumns="false" Width="400"
                    GridLines="None" >
            <MasterTableView >
                    <Columns>
                    <telerik:GridBoundColumn DataField="fname" HeaderText="First Name" />
                    <telerik:GridBoundColumn DataField="mname" HeaderText="Middle Name" />
                    <telerik:GridBoundColumn DataField="lname" HeaderText="Last Name" />
                    <telerik:GridTemplateColumn>
                    <ItemTemplate>
                    <asp:CheckBox ID="checkselect" runat="server" />
                    </ItemTemplate>
                    <HeaderTemplate>
                    <asp:Button ID="Button4" runat="server" Text="Remove"  CommandName="Split" OnClick="Button4_Click" />
                    </HeaderTemplate>
                    </telerik:GridTemplateColumn>
                    </Columns>
                    </MasterTableView >
             </telerik:RadGrid>
             </div>
             </td>
             </tr>
 </ItemTemplate>
 </telerik:GridTemplateColumn>
 </Columns>
 </MasterTableView>
 </telerik:RadGrid>

现在我的模态弹出窗口

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="Button5" runat="server" Text="Button" style="display:none"/>
<asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="Button5" CancelControlID="Button1" PopupControlID="Panel1">
 </asp:ModalPopupExtender>
   <asp:Panel ID="Panel1" runat="server" Height="65px" style="display:none" >
    <p>
    Thank You for Removing records
    </p>
    </asp:TextBox> <asp:Button ID="Button3" runat="server" Text="Submit"  />
    <asp:Button ID="Button1" runat="server" Text="Cancel" />
     </asp:Panel>
  </ContentTemplate>
  </asp:UpdatePanel>

问题是当我点击gridview按钮(Button4)时它会抛出无效的回发错误。我认为那是因为我将Modalpopup置于更新面板和gridview外部。有人能告诉我如何处理这个问题吗?我无法将Gridview放在更新面板中,因为它正在停止按钮单击事件,这会导致模式弹出扩展器显示。

按钮单击事件:

 protected void Button4_Click(object sender, EventArgs e)
    {
    ModalPopupExtender1.Show();
    }

2 个答案:

答案 0 :(得分:2)

更新: 以下是点击按钮时显示确认消息和收集用户输入的方式。

然后从后面的代码中收集所选的复选框ID。

请注意,您需要将PrimaryKey / UniqueKey分配给RadGrid的DataKeyName。

enter image description here

<asp:ScriptManager runat="server" ID="ScriptManager"></asp:ScriptManager>
<telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="false" 
    Width="400" GridLines="None" OnNeedDataSource="RadGrid1_NeedDataSource">
    <MasterTableView DataKeyNames="Id">
        <Columns>
          <telerik:GridBoundColumn DataField="FirstName" HeaderText="First Name" />
          <telerik:GridBoundColumn DataField="MiddelName" HeaderText="Middle Name" />
          <telerik:GridBoundColumn DataField="LastName" HeaderText="Last Name" />
          <telerik:GridTemplateColumn>
                <ItemTemplate>
                    <asp:CheckBox ID="SelectCheckBox" runat="server" />
                </ItemTemplate>
                <HeaderTemplate>
                    <asp:Button ID="Button4" runat="server" Text="Remove"
                        OnClientClick="return showWindow();" />
                </HeaderTemplate>
            </telerik:GridTemplateColumn>
        </Columns>
    </MasterTableView>
</telerik:RadGrid>
<telerik:RadWindow ID="RadWindow1" runat="server" Width="400" Height="200">
    <ContentTemplate>
        Enter a reason to delete:<br />
        <asp:TextBox runat="server" ID="ReasonTextBox" TextMode="MultiLine" Rows="5" 
            Width="350" /><br />
        <asp:Button runat="server" ID="DeleteButton" Text="Delete" 
            OnClick="DeleteButton_Click" />
    </ContentTemplate>
</telerik:RadWindow>
<script type="text/javascript">
    function showWindow() {
        var wnd = $find("<%=RadWindow1.ClientID %>");
        wnd.show();
        return false;
    }
</script>

public class User
{
    public int Id { get; set; }
    public string FirstName { get; set; }
    public string MiddelName { get; set; }
    public string LastName { get; set; }
}

protected void RadGrid1_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)
{
    RadGrid1.DataSource = new List<User>()
    {
        new User {Id = 1, FirstName = "Jon", LastName = "Doe"},
        new User {Id = 2, FirstName = "Eric", LastName = "Newton"},
        new User {Id = 3, FirstName = "One", LastName = "Two"},
    };
}

protected void DeleteButton_Click(object sender, EventArgs e)
{
    var ids = new List<int>();
    foreach (GridDataItem item in RadGrid1.Items)
    {
        var selectCheckBox = item.FindControl("SelectCheckBox") as CheckBox;
        if (selectCheckBox.Checked)
        {
            int id = Convert.ToInt32(item.GetDataKeyValue("Id"));
            ids.Add(id);
        }
    }
}

答案 1 :(得分:0)

如果在GridView中单击了一个按钮,则会引发一个名为“RowCommand”的事件。您可以通过标记指定它使用的方法:

<telerik:RadGrid ..attributes.. OnRowCommand="DoThisMethod">

然后在后面的代码中:

protected void DoThisMethod(object sender, EventArgs e)
{
    //Do your stuff
}

这意味着您现在可以将GridView放入面板中,因为无论如何它仍应引发行命令事件。

我不确定RadGrid,但GridViews确实如此