Adding run-time created <li></li> tags inbetween <ul>/ul> tags

I want to create a custom control which will create a unordered list and fill it with list items of which will be created at run-time. Currently I am using the following logic:

At my Default.aspx page:

<ai:ul_adder ID="ul_adder1" ListItemString="Page1 1,sf1.aspx,image/edit.gif; Page 2,sf2.aspx,image/colaps.gif" runat="server"/>
and at the ul_adder.ascx file
 
1        public string ListItemString 
2        {
3            set 
4            {
5                string[] itemlist = value.Split(';');
6                
7                for (int i = 0; i < itemlist.Length; i++)
8                {
9                    string[] itemattrib = itemlist[i].Split(',');
10                   
11                   ListItem l = new ListItem();
12                   l.Text = itemattrib[0].ToString();
13                   l.Value = itemattrib[1].ToString();
14                   l.Attributes.Add("bgimg", itemattrib[2].ToString());
15                   _items.Add(l);
16               }
17           }
18       }
19   
  which seperates the values I passed according to commas(,) and semi-columns (;) to get appropriate parameters in an ListItemCollection as _items
then I apply the parameters to the <li>'s as
  
1        override protected void OnLoad(EventArgs e)
2        {
3            int ObjCount = _items.Count;
4    
5            for (int i = 0; i < ObjCount; i++)
6            {
7                li_adder a = new li_adder();
8    
9                a.Image = _items[i].Attributes["bgimg"].ToString();
10               a.HRef = _items[i].Value.ToString();
11               a.Text = _items[i].Text;
12   
13               this.Controls.Add(a);
14           }
15       }
after the script ther <ul> is defined as:
<ul>
</ul>
 
And finally the li_adder.ascx where I create my ListItems is as :
 
 
1        string _img, _href, _txt;
2    
3        override protected void OnLoad(EventArgs e)
4        {
5            _li.Style["background-image"] = _img;
6            _li.Style["background-repeat"] = "no-repeat";
7            _ali.HRef = _href;
8            _ali.InnerText = _txt;
9    
10       }
 
and the html codes are:

 

<

li id="_li" runat="server">

<a id="_ali" runat="server">

</a>

</

li>

 

By doing this I am expecting a code as follows:

 

<ul>

 

<li id="ul_adder1_ctl00__li" style="background-image:url(image/edit.gif);background-repeat:no-repeat;">
<a href="sf1.aspx" id="ul_adder1_ctl00__ali">Page 1</a>
</li>

<li id="ul_adder1_ctl01__li" style="background-image:url(image/colaps.gif);background-repeat:no-repeat;">
<a href="sf2.aspx" id="ul_adder1_ctl01__ali">Page 2</a>
</li>
</ul>

 

But the codes seems to appear outside the <ul>&/ul> block as follows:

 

<ul>

 

</ul>


<li id="ul_adder1_ctl00__li" style="background-image:url(image/edit.gif);background-repeat:no-repeat;">
<a href="sf1.aspx" id="ul_adder1_ctl00__ali">Page 1</a>
</li>

<li id="ul_adder1_ctl01__li" style="background-image:url(image/colaps.gif);background-repeat:no-repeat;">
<a href="sf2.aspx" id="ul_adder1_ctl01__ali">Page 2</a>

</li>

 

Why does that happen? How did I go wrong? And how can I possibly fix this?

 

Regards...


Utku Ozan Γ‡ANKAYA
0
utkuozan
1/13/2007 10:52:15 AM
πŸ“ asp.net.web-forms
πŸ“ƒ 93655 articles.
⭐ 1 followers.

πŸ’¬ 1 Replies
πŸ‘οΈβ€πŸ—¨οΈ 240 Views

The main problem seems to be occuring at the adding control event.

<ul>&</ul> tags are created but I do not have any control on them. The problem is solved by declaring it as a control object and assignbing the control addition to that object.

1 - I have replaced

<ul>
</ul>
with 
<ul id="uladder1" runat="server">
and than replaced

this.Controls.Add(a);

with

ulr01.Controls.Add(a);

Yaps! Everything is fine.....


Utku Ozan Γ‡ANKAYA
0
utkuozan
1/13/2007 12:17:11 PM
Reply: