Custom Edit Button of DetailsView closes the ModalPopupExtender instead of going to DetailsViewMode.Edit (ASP.NET)

Question

0.00/5 (No votes)

See more:

, +

I have custom 'Edit' and 'Close' buttons inside a Panel that pops up with the ModalPopupExtender. The issue I am having is that when I click on the Edit button, instead of going to the DetailsViewMode.Edit mode, it just links back to the GridView Page.

Image showing the DetailsView with the ModalPopupExtender:
Image link

Screen fter clicking 'Edit' button:
Image link

I have no clue why it does that.

Could anyone please help me find what is wrong?

Many thanks in advance!

ASPX:

ASP.NET

<pre lang="xml"><asp:Button ID="btnShowPopup" runat="server" style="display:none" />
            <asp:ModalPopupExtender ID="mdlPopup" runat="server" TargetControlID="btnShowPopup" PopupControlID="pnlPopup"
                            CancelControlID="btnClose" BackgroundCssClass="modalBackground" />
            <asp:Panel ID="pnlPopup" runat="server" CssClass="detail" Width="500px">
                <asp:UpdatePanel ID="updPnlStockDetail" runat="server" UpdateMode="Conditional">
                    <ContentTemplate>
                        <asp:Label ID="lblStockDetail" runat="server" Text="Detail" BackColor="#7AB800" Width="95%" />
                        <asp:DetailsView ID="DetailsView1" runat="server" AutoGenerateRows="False" OnItemUpdated="DetailsView1_ItemUpdated" BackColor="White" Width="95%" FieldHeaderStyle-Width="200px" OnDataBound="DetailsView1_DataBound" OnItemCommand="DetailsView1_ItemCommand">
                            <FieldHeaderStyle Width="200px" />


                            <Fields>
</pre>
</Fields>
                            
                        </asp:DetailsView>
                    </ContentTemplate>
                </asp:UpdatePanel>
                <div align="right" style="width:95%">
                    <asp:Button ID="btnEdit" runat="server" Text="Edit" CommandName="Edit" Height="26px" Width="50px" BackColor="#7AB800" CssClass="viewdetailbutton" />
                    <asp:Button ID="btnClose" runat="server" Text="Close" CommandName="Close" Height="26px" Width="50px" BackColor="#FF9900" CssClass="viewdetailbutton" />
                </div>
            </asp:Panel>

Code behind:

C#

protected void DetailsView1_ItemCommand(object sender, DetailsViewCommandEventArgs e)
    {
        if (e.CommandName == "Edit")
        {
            this.DetailsView1.ChangeMode(DetailsViewMode.Edit);
            this.DetailsView1.DataBind();
        }
        else if (e.CommandName == "Close")
        {
            this.DetailsView1.ChangeMode(DetailsViewMode.ReadOnly);
            this.DetailsView1.DataBind();
        }
    }

Posted 22-Oct-14 4:40am

ThatGuy7

Updated 22-Oct-14 5:34am

v5

Add a Solution

Comments

ZurdoDev 22-Oct-14 10:49am

Way too much code. Please narrow it down to what the issue is.

ThatGuy7 22-Oct-14 11:36am

Sorry about that. I believe the issue is mainly caused by the DetailsView or the Edit button itself so I narrowed it down to those parts. Could you please have a look at it? Thanks!

ZurdoDev 22-Oct-14 11:44am

Put a breakpoint in DetailsView1_ItemCommand to make sure it is changing the mode. Also, I have not used DetailsView in a very long time but are you sure you need to call DataBind after changing the mode? I wonder if that is overwriting it.

ThatGuy7 22-Oct-14 11:57am

Ok so it turns out that after clicking on the 'Edit' button, it does not even reach the breakpoint in the ItemCommand first if statement.. I have tried with

BtnEdit_OnClick
{
DetailsView1.ChangeMode(DetailsViewMode.Edit);
}

but the output was the same..

ZurdoDev 22-Oct-14 12:03pm

I don't see anything in your detailsview. Fields is empty.

ThatGuy7 22-Oct-14 12:11pm

Well my fields area is almost 100 lines of code so as you suggested, I narrowed it down.

ZurdoDev 22-Oct-14 12:18pm

True. However, for ItemCommand to fire there needs to be a field that is a button in your detailsview.

I also notice you have an asp:button named btnEdit outside your detailsview but it does not have an event on it.

ThatGuy7 22-Oct-14 23:57pm

Hi Ryan, do I have to place the buttons in a particular field (TemplateField, ButtonField etc.)? I have just placed my buttons in the FooterTemplate, which is inside the DetailsView but just outside the Fields area. Now when I click on View Details button in the GridView, it doesn't fire up the ModalPopupExtender (the View Details button is supposed to bring up the all the details of the product that relates to the row you click in the DetailsView that is fired with the ModalPopup). Could you please give some advice?

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Tadit Dash (ତଡିତ୍ କୁମାର ଦାଶ) · Answer 1 · 2014-10-22T06:38:00

Solution 1

Ryan is correct. For ItemCommand, the Button should be inside the DetailsView.

As I can see, the Edit Button is outside the DetailsView, so add one Click event for that Button. Inside the Button Event, try like...

C#

protected void BtnEdit_OnClick(object sender, EventArgs e)
{
    DetailsView1.ChangeMode(DetailsViewMode.Edit);
    DetailsView1.DataBind();
}

Posted 22-Oct-14 6:38am

Tadit Dash (ତଡିତ୍ କୁମାର ଦାଶ)

Comments

ThatGuy7 22-Oct-14 23:50pm

Thanks for your advice!

Here I added those two buttons in the DetailsView1 inside the FooterTemplate.

<footertemplate>
<asp:Button ID="btnEdit" runat="server" Text="Edit" OnClick="BtnEdit_OnClick" CommandName="Edit" Height="26px" Width="50px" BackColor="#7AB800" CssClass="viewdetailbutton" />
<asp:Button ID="btnClose" runat="server" Text="Close" CommandName="Close" Height="26px" Width="50px" BackColor="#FF9900" CssClass="viewdetailbutton" />

I encountered another problem possibly caused by the code above.
The problem is that as soon as I added these buttons in the DetailsView1, my ModalPopupExtender no longer shows up. I have checked with a breakpoint inside the

protected void ViewDetails2_Click(object sender, EventArgs e)
{
Button btnDetails = sender as Button;
GridViewRow row = (GridViewRow)btnDetails.NamingContainer;

this.SqlDataSource2.SelectParameters.Clear();
this.SqlDataSource2.SelectParameters.Add("stock_ID", Convert.ToString(this.GridView2.DataKeys[row.RowIndex].Value));
this.DetailsView1.DataSource = this.SqlDataSource2;
this.DetailsView1.DataBind();

this.updPnlStockDetail.Update();
this.mdlPopup.Show();
}

It seems to reach .Show(). It works if I have those buttons outside the DetailsView. What could I do to solve this?

Tadit Dash (ତଡିତ୍ କୁମାର ଦାଶ) 23-Oct-14 0:42am

Okay first try like ... Just have show call before update.

this.mdlPopup.Show();
this.updPnlStockDetail.Update();

If it won't work, then go for ItemCommand. No need to have one different event for the Button, if that is inside the DetailsView.

ThatGuy7 23-Oct-14 5:05am

Hi Tadit thanks for the comment! I tried that but still the same issue no ModalPopup.. It seems like this issue occurs when I add things in FooterTemplate for some stupid reasons.

The bottom of my gridview is the following

FooterTemplate
<asp:Button ID="btnEdit" runat="server" Text="Edit" OnClick="BtnEdit_OnClick" CommandName="Edit" Height="26px" Width="50px" BackColor="#7AB800" CssClass="viewdetailbutton" />
<asp:Button ID="btnClose" runat="server" Text="Close" CommandName="Close" Height="26px" Width="50px" BackColor="#FF9900" CssClass="viewdetailbutton" />
/FooterTemplate

If I add for example a ButtonField for each button, it shows the modal but that saying I have these buttons in the different rows (which doesnt look very nice and professional).

I've also tried with the ItemCommand. No luck with that either..

ThatGuy7 23-Oct-14 5:08am

This is my ItemCommand:

protected void DetailsView1_ItemCommand(object sender, DetailsViewCommandEventArgs e)
{
if (DetailsView1.CurrentMode == DetailsViewMode.ReadOnly)
{
if (e.CommandName == "Edit")
{
this.DetailsView1.ChangeMode(DetailsViewMode.Edit);
this.DetailsView1.DataBind();
}
else if (e.CommandName == "Close")
{
this.DetailsView1.ChangeMode(DetailsViewMode.ReadOnly);
this.DetailsView1.DataBind();
}
}
else
{
if (e.CommandName == "Close")
{
this.DetailsView1.ChangeMode(DetailsViewMode.ReadOnly);
this.DetailsView1.DataBind();
}
}

}

Tadit Dash (ତଡିତ୍ କୁମାର ଦାଶ) 23-Oct-14 5:34am

Did you place the modal show code inside the ItemCommand instead of Button Click? First delete the event from markup and then try.