Custom Webcontrol with Nodes

[STech]

Hi,

I would like to create a webcontrol where data for the control is contained
in the control itself. Example:

<foo:MyCustomControl id="Test0001">
<Data>
<item>
<itemcaption>Caption1</itemcaption>
<itembody>CaptionBody1</itembody>
</item>
<item>
<itemcaption>Caption2</itemcaption>
<itembody>CaptionBody2</itembody>
</item>
<item>
<itemcaption>Caption3</itemcaption>
<itembody>CaptionBody3</itembody>
</item>
</Data>
</foo:MyCustomControl>

The webcontrol must able to read this data nested within itself and render a
customized <table> with multiple rows. My problem is I do not know where to
start. How do I read the data in the "Render" method?

Thanks.

 

[Steven Cheng[MSFT]]

Hi Stech,

Thanks for your posting. As for the problem you mentioned, I think we need
to create a custom ControlBuilder for our custom control in such scenario.
Which is used to help parse the content inside our contro body.

Here is a very good codeproject article discussing this:

http://codeproject.com/aspnet/MikEllASPNetQuery.asp?df=100

In addition, here is a simple example control which parse the nested xml
data and load them as xmldocmente and retrieve the child nodes inside it :

===============================
namespace MyWebApp.customcontrols
{

public class XMLControlBuilder : ControlBuilder
{
public override Type GetChildControlType(String tagName,
IDictionary attributes)
{
if (String.Compare(tagName, "XMLDATA", true) == 0)
return typeof(XMLData);

return null;
}

}


[ControlBuilder(typeof(XMLControlBuilder))]
public class XMLControl : Control
{
private String header;
private XmlDocument xmldoc = null;

public String Header
{
get
{
return header;
}
set
{
header = value;
}
}



public XmlDocument XMLDoc
{
get
{
return xmldoc;
}
set
{
xmldoc = value;
}
}

protected override void AddParsedSubObject(Object obj)
{

if (obj is XMLData)
{
XMLData data = obj as XMLData;

if(data != null)
{
xmldoc = new XmlDocument();
xmldoc.LoadXml(data.Text);


}
}

}


protected override void CreateChildControls()
{



Table table = new Table();

TableRow htrTitle = new TableRow();

TableHeaderCell hcTitle = new TableHeaderCell();
Label label = new Label();
label.Text = Header;
label.BackColor = System.Drawing.Color.Beige;
label.ForeColor = System.Drawing.Color.Red;
hcTitle.Controls.Add(label);
htrTitle.Cells.Add(hcTitle);




TableRow htr = new TableRow();

TableHeaderCell hcell1 = new TableHeaderCell();
hcell1.Text = "itemcaption";
htr.Cells.Add(hcell1);

TableHeaderCell hcell2 = new TableHeaderCell();
hcell2.Text = "itembody";
htr.Cells.Add(hcell2);


table.Rows.Add(htr);

table.BorderWidth = 2;
table.BackColor = System.Drawing.Color.Beige;
table.ForeColor = System.Drawing.Color.Red;


XmlNodeList nodes = xmldoc.SelectNodes("/DATA/ITEM");

foreach(XmlNode node in nodes)
{
TableRow tr = new TableRow();

XmlNode caption = node.SelectSingleNode("ITEMCAPTION");
XmlNode body = node.SelectSingleNode("ITEMBODY");


TableCell cell1 = new TableCell();
cell1.Text = caption.InnerText;
tr.Cells.Add(cell1);

TableCell cell2 = new TableCell();
cell2.Text = body.InnerText;
tr.Cells.Add(cell2);


table.Rows.Add(tr);
}
Controls.Add(table);

}
}

public class XMLData : System.Web.UI.WebControls.Literal
{}
}
=====================================================

Then, we can use it like:


<%@ Register TagPrefix="cc" Namespace="MyWebApp.customcontrols" Assembly =
"MyWebApp" %>
..............
.................
<form id="Form1" method="post" runat="server">
<cc:XMLControl Header="Sample" id="prop" runat="server">
<XMLDATA>
<DATA>
<ITEM>
<ITEMCAPTION>Caption1</ITEMCAPTION>
<ITEMBODY>CaptionBody1</ITEMBODY>
</ITEM>
<ITEM>
<ITEMCAPTION>Caption2</ITEMCAPTION>
<ITEMBODY>CaptionBody2</ITEMBODY>
</ITEM>
<ITEM>
<ITEMCAPTION>Caption3</ITEMCAPTION>
<ITEMBODY>CaptionBody3</ITEMBODY>
</ITEM>
</DATA>
</XMLDATA>
</cc:XMLControl>
</form>



Hope helps. Thanks.


Regards,

Steven Cheng
Microsoft Online Support

Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)