Display/hide control in Webpart based on edit/browse mode

I have a Visual Studio project in which I have created a Visual Webpart. In the user control I have a panel which I want to display in edit mode and hide in browse mode.

ASP.NET code snippet:

<asp:panel runat="server" ID="myControl">

C# code snippet in user control code behind:

protected override void OnPreRender(EventArgs e)
{
    base.OnPreRender(e);
    WebPartManager wpm = WebPartManager.GetCurrentWebPartManager(this.Page);
    if (wpm.DisplayMode == WebPartManager.BrowseDisplayMode)
    {
        myControl.Attributes.Add("style", "display: none");
    }
    else if (wpm.DisplayMode == WebPartManager.EditDisplayMode)
    {
        myControl.Attributes.Add("style", "display: block");
    }
}

This works, but if I have two webparts on same page and put on webpart is edit mode it shows the panel in both webparts. I even tried writing code as this.myControl.Attributes.Add("style", "display: block"); but it still didn't work.

How can I resolve this? Is there any better (or preferred) way to do it?

NOTE: I need to use display: none because the panel would be accessed via JavaScript. 

August 24th, 2015 3:16am

Hi,

Would you please explain the line "but if I have two webparts on same page and put on webpart is edit mode it shows the panel in both webparts. I even tried writing code as this.myControl.Attributes.Add("style", "display: block"); but it still didn't work." meaning ?

I tested the code in my environment, I placed the two web part in a page and in the edit mode of web part the control will both display in the two web parts as the screen capture below:

Did you want to display the control in  edit mode of the both web parts ?

If I misunderstand, please correct me.

Thanks

Best Regards

Free Windows Admin Tool Kit Click here and download it now
August 25th, 2015 2:37am

I create a web part and add the OnPreRender event code as described in my question. The code shows the control, say a textbox, when I edit the webpart and hides the control when I go back to browse mode.

Now if I add two webparts on my page and put one webpart in edit mode, the OnPreRender event code makes the textbox in both webparts visible. But I only want my code to run on the textbox which is in edit mode.

As seen in your screenshot, the textbox is visible on both webpart when I edit any one the webpart. 

I hope this clarifies my question. Let me know if you require additional information.

August 26th, 2015 8:13am

Hi,

Did you want to display the only one textbox control in the corresponding web part when editing any one web part ?

Based on my research, webpart manager class will manage the all web parts in the page, if there are multiple web parts in the page, the class will check if the whole web parts are in the edit mode or display mode to display the control.

However in the webpart class object, there is no property to check if a stand alone web part is in the edit mode.

As a workaround, I suggest you can use some Jquery code to change the html display property to show or hide control. 

Thanks

Best Regards

Free Windows Admin Tool Kit Click here and download it now
September 1st, 2015 1:58am

This topic is archived. No further replies will be accepted.

Other recent topics Other recent topics