2014年7月13日 星期日

[RESOLVED] changing div css class in user control from parent page


i have a page, that has a button on it that changes the css of the page, amending the layout.


because of the layout change, i also want to switch a user control on the page from a horizontal to a vertical layout. 


the div in the user control is set up as follows



and the code behind loads the control and places it in a placeholder.


when the button is pressed to switch the css of the parent page, my code clears the control and places it elsewhere. i then want to find the div and style it. 


my code behind for that is:


plcBrandTop.Controls.Clear();
plcBrandHead.Controls.Clear();
plcLeftArea.Controls.Clear();
Control branding = (Control)Page.LoadControl("~/ContentControls/BrandContainer.ascx");//loads brand control
Control menu = (Control)Page.LoadControl("~/ContentControls/VerticalMenu.ascx");//loads menu control (vertical)
Control socialmedia = (Control)Page.LoadControl("~/ContentControls/SocialMediaBar.ascx");//loads social media links
plcBrandHead.Controls.Add(branding);
plcLeftArea.Controls.Add(menu);
plcLeftArea.Controls.Add(socialmedia);
HtmlGenericControl ctrlSocialMedia = this.Page.FindControl("SocialMediaBar") as HtmlGenericControl;
ctrlSocialMedia.Attributes["class"] = "vertical";

But it is returning an error. I have checked and the problem is ctrlSocialMedia is Null - i.e. it is not finding the "SocialMediaBar" div in the user control.


any suggesttions as to how i can find it/access it?





dcgate


my code clears the control and places it elsewhere


How are you doing this and in which event?



on the button click (button is in the parent page) - in the code above, i first clear all the existing controls (because once the layout changes, some needs to be moved)


            plcBrandTop.Controls.Clear();
plcBrandHead.Controls.Clear();
plcLeftArea.Controls.Clear();

then reload and add the required controls 


            Control branding = (Control)Page.LoadControl("~/ContentControls/BrandContainer.ascx");//loads brand control
Control menu = (Control)Page.LoadControl("~/ContentControls/VerticalMenu.ascx");//loads menu control (vertical)
Control socialmedia = (Control)Page.LoadControl("~/ContentControls/SocialMediaBar.ascx");//loads social media links
plcBrandHead.Controls.Add(branding);
plcLeftArea.Controls.Add(menu);
plcLeftArea.Controls.Add(socialmedia);

and finally i want to access a div ("SocialMediaBar") in one of the controls i just added, and change it's css class, but 


HtmlGenericControl ctrlSocialMedia = this.Page.FindControl("SocialMediaBar") as HtmlGenericControl;

is not finding the div, so is null and 


ctrlSocialMedia.Attributes["class"] = "vertical";

throws an error.


so i am wondering how i can make sure i can find that div.





dcgate



plcBrandHead.Controls.Add(branding);
plcLeftArea.Controls.Add(menu);
plcLeftArea.Controls.Add(socialmedia);




Are remaining two not null, have you checked, as there can be two reasons;


When you add controls dynamically, you must re-add them when the page posts back (In Page_Init is a good place). See How to persist a dynamic control


The other is that Page.FindControl() only goes one level down, you need to recursively search down the list. See Better way to find control in ASP.NET


URL 


You can also try to give ID to your dynamic controls



all the controls are added and display fine, including the one containing the div i am trying to access... for some reason though i can't actually find the div.


thanks i will check out the links.


--------------------------


Edit - so the key is, as you point out that "Page.FindControl() only goes one level down" - the div I am trying to find is 2 levels down, being inside the control "socialmedia", not the Page. so switching the find control to


            HtmlGenericControl ctrlSocialMedia = socialmedia.FindControl("SocialMediaBar") as HtmlGenericControl;            

means that now ctrlSocialMedia isn't returning Null. So 


ctrlSocialMedia.Attributes["class"] = "vertical";

can work.


thanks!


沒有留言:

張貼留言