Pretty much like the panel-control but with more style than a simple div.
I've managed to create a control that does this for simple text but when you add another serverside-control inside the box you can't access that child-control without using container.FindControl("controlToFind"); which means no intellisense and no typesafety :(
Doing this is no problem when you'r using the asp:Panel control.
My control looks like this:
[ParseChildren(true, "InnerXml")]
public partial class App_UserControls_RoundCornerBox : System.Web.UI.UserControl
{
private ITemplate _innerXml;
private int _width;
protected void Page_Load(object sender, EventArgs e)
{ }
[PersistenceMode(PersistenceMode.InnerProperty), TemplateContainer(typeof(TemplateControl))]
public ITemplate InnerXml
{
get { return _innerXml; }
set { _innerXml = value; }
}
public int Width
{
get { return _width; }
set { _width = value; }
}
protected override void OnInit(EventArgs e)
{
base.OnInit(e);
if (_innerXml != null)
_innerXml.InstantiateIn(contenthere);
topdiv.Style["Width"] = this.Width + "px";
contenthere.Style["Width"] = (this.Width - 10) + "px";
}
}
So my question is: How do i make a control that works like a Panel but looks better?
It doesn't necessarily have to be a asp usercontrol that does the job, as long as i don't have to write all those bloated divs and styles im happy, i use that box pretty much everywhere and i maybe even have to change the design of the page in the future.
I've also tried using clientside xml+xslt but got huge performance-issues in IE7 when i was updating the DOM-tree with javascript so that's not a good solution
Nha, if i just wanted to change some styles of the div that the panel produces i would simply created a div myself and set a css-class to it.
What i want to do is to create a containercontrol that has a more complex structure than a simple div. Almost like a masterpage but without the hassle of giving everything a masterpageid etc.
Inheriting from Panel seems like alot of hassle, if i've understood everything correctly you have to create an extra assembly and put the control in a namspace which IIRC doesn't work in the express-version of VSWD.
Whoa, required some search in reflector but now i've managed to fix it. Was simpler than i thought :)
Can't use the markup-editor though so i have to add the markup manually with the HtmlTextWriter...but i guess i'll have to accept that :/ Better than nothing.
Here's the control if anyone else need something similar:
tiomeg1
0 Points
3 Posts
Create container-control to get rid of all nested divs while coding.
Jan 17, 2008 12:57 PM|LINK
I'm trying to create a control so i simply can write
<uc:MyStyledBox width="150px">Some content</uc:MyStyledBox>
instead of
<div style="float: left;"> <div class="top" id="topdiv" style="width:160px;"> <img src="images/topleft.png" alt="" /> <img src="images/topright.png" alt="" style="float: right;" /> </div> <div class="rightborder"> <div class="leftborder" style="width:150px;"> Some content <</div> class=tag > </div>I've managed to create a control that does this for simple text but when you add another serverside-control inside the box you can't access that child-control without using container.FindControl("controlToFind"); which means no intellisense and no typesafety :(I've also tried using clientside xml+xslt but got huge performance-issues in IE7 when i was updating the DOM-tree with javascript so that's not a good solution
Nai-Dong Jin...
All-Star
41630 Points
3558 Posts
Re: Create container-control to get rid of all nested divs while coding.
Jan 21, 2008 01:50 AM|LINK
Hi,
From your description, you want to add a attribute in your Panel control, right?
If so, I think you do not need to create a custom control or user control, just add the attribute in your code behind.
this.Panel1.Attributes.Add("class","leftborder");
Also, if you want to create a custom control, just make your control be inherited from Panel class, and add the specific attribute before building it.
Thanks.
tiomeg1
0 Points
3 Posts
Re: Create container-control to get rid of all nested divs while coding.
Jan 31, 2008 06:22 PM|LINK
Nha, if i just wanted to change some styles of the div that the panel produces i would simply created a div myself and set a css-class to it.
What i want to do is to create a containercontrol that has a more complex structure than a simple div. Almost like a masterpage but without the hassle of giving everything a masterpageid etc.
Inheriting from Panel seems like alot of hassle, if i've understood everything correctly you have to create an extra assembly and put the control in a namspace which IIRC doesn't work in the express-version of VSWD.
tiomeg1
0 Points
3 Posts
Re: Create container-control to get rid of all nested divs while coding.
Feb 01, 2008 09:09 AM|LINK
Whoa, required some search in reflector but now i've managed to fix it. Was simpler than i thought :)
Can't use the markup-editor though so i have to add the markup manually with the HtmlTextWriter...but i guess i'll have to accept that :/ Better than nothing.
Here's the control if anyone else need something similar:
1 using System.Web.UI;
2
3 namespace MYControls
4 {
5 public class TestPanel : Control
6 {
7 protected override void Render(HtmlTextWriter writer)
8 {
9 writer.AddAttribute(HtmlTextWriterAttribute.Class, "TestDiv1");
10 writer.RenderBeginTag(HtmlTextWriterTag.Div);
11 writer.AddAttribute(HtmlTextWriterAttribute.Class, "TestDiv2");
12 writer.RenderBeginTag(HtmlTextWriterTag.Div);
13
14
15 base.RenderChildren(writer);
16
17
18 writer.RenderEndTag();
19 writer.RenderEndTag();
20 }
21 }
22 }