Introduction
As a developer, I sometimes find myself going for the harder solution - when an easier one will do. This was certainly one of those times. I thought that this problem was harder than it was...ah well, live and learn.
I needed a way to change what information could be entered based on the value of a drop-down list. If the value of a drop-down was one thing, different information needed to be entered compared with another.
This was my thinking:
- different information was needed - so use a user control for each different type of information.
- show these user controls based on what the selected value of the dropdown was (the dropdown in the same repeater item container) - so that whatever information was relevant was closest to the control on which it depended.
(I've put the code below rather than attaching it - it didn't seem to rate a demo.)
I came across these problems:
- If you try to dynamically load a user control using
AddAt
, then the Repeater
adds it to that place - replacing whatever control was at that position in the control hierarchy. I resolved this by not dynamically loading the control, but setting its Visible
property to false
- that way, you don't have to keep track of where it is in the control hierarchy - you can just use it Visible
property. - No nice way of finding the index of the control in the hierarchy - I used a regex pattern to look for its control number in
ControlID
- i.e., looking for ctl1
, ctl2
and getting the control index that way. (I suppose you could build a control tree structure and have each leaf have control ID, absolute index, relative index, name and gettypeof()
- build the tree using recursion - it's better than a whole bunch of nested foreach
loops...ugh! - The controls had to initialised before showing the list for the first time (not really a problem, but something that needed to be done in this case.) - easy enough to do - just place the initialisation code in the
Repeater
databound event. - Since there could be any number of dropdown controls in the
Repeater
- and since they will have different things selected, we needed a way to find the control and make it visible - I used the SelectedIndexChanged
event of the drop-down for this.
All of these solutions are both far from ideal.
My advice is to go and have a coffee and write down exactly what you need to do in order to achieve some developer goal. And then work through each of those things systematically. Design only as much as you need in order to get the job done. (Unless you're an agile developer :)
If you can think of a better way that uses the Observer pattern - where each user control subscribes to the events of the extended control - or some other approach - I'd love to hear about it.
Background
Originally, I took a more complex approach and created an extended drop-down list with additional events and properties. Created two user controls to dynamically load based on events firing on changes to this property. And, coupled this to using the Observer pattern. I also thought of going down the route of creating a custom template that implements ITemplate
. Both attempts came up with too many problems to overcome in what was a very simple problem - so I went back to the way I thought of first - even though it didn't feel nice and certainly wasn't smart.
Using the Code
- Create a web project in VS.NET 2003/2005
- Create two user controls using the default name
- Add webform1.aspx and wire up - you'll need to change the register sections to suit
- Add a project to this solution and add the business classes - in this case, licenses - but could also be ASCX etc.
The licenses code is a very simple collection (change it to using a generic dictionary if you are using C# 2.0). Here is Licences.cs:
namespace ControlLibrary1
{
using System;
using System.Collections;
public class Licences : CollectionBase
{
public Licences(){}
public int Add(Licence Licence)
{
return List.Add(Licence);
}
public void Remove(Licence Licence)
{
List.Remove(Licence);
}
public class Licence
{
private string LicenceName;
public Licence(string Name)
{
LicenceName = Name;
}
public string Name
{
get
{
return LicenceName;
}
set
{
LicenceName = value;
}
}
}
}
}
WebForm1.aspx.cs
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Text.RegularExpressions;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using WindowsControlLibrary1;
namespace WebApplication1
{
public class WebForm1 : System.Web.UI.Page
{
protected System.Web.UI.WebControls.Repeater Repeater1;
protected ArrayList items;
protected DropDownList ddlExtended;
protected int index = 0;
protected WebUserControl1 webUserControl1;
protected WebUserControl2 webUserControl2;
private void Page_Load(object sender, System.EventArgs e)
{
Licences.Licence l1 = new Licences.Licence("Licence1");
Licences.Licence l2 = new Licences.Licence("Licence2");
Licences.Licence l3 = new Licences.Licence("Licence3");
Licences.Licence l4 = new Licences.Licence("Licence4");
Licences Licences = new Licences();
Licences.Add(l1);
Licences.Add(l2);
Licences.Add(l3);
Licences.Add(l4);
if (!IsPostBack)
{
Repeater1.DataSource = Licences;
Repeater1.DataBind();
}
}
#region Web Form Designer generated code
override protected void OnInit(EventArgs e)
{
InitializeComponent();
base.OnInit(e);
}
private void InitializeComponent()
{
this.Load += new System.EventHandler(this.Page_Load);
this.Repeater1.ItemDataBound +=
new RepeaterItemEventHandler(Repeater1_ItemDataBound);
}
#endregion
private void Repeater1_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
DropDownList list = (DropDownList)e.Item.FindControl("ddlExtended");
if(list!=null)
{
items = new ArrayList();
items.Add("One Country");
items.Add("Region");
list.DataSource = items;
list.DataBind();
}
WebUserControl1 cont1 =
(WebUserControl1)e.Item.FindControl("webUserControl1");
WebUserControl2 cont2 =
(WebUserControl2)e.Item.FindControl("webUserControl2");
if(cont1 != null | cont2 != null)
{
if(list.SelectedValue == "One Country")
{
cont1.Visible = true;
}
else
{
cont2.Visible = true;
}
}
}
protected void ddlExtended_SelectedIndexChanged(object sender, EventArgs e)
{
WebUserControl1 control1 = (WebUserControl1)Repeater1.Items[GetControlIndex(
(((DropDownList)sender).ClientID))].FindControl("webUserControl1");
WebUserControl2 control2 = (WebUserControl2)Repeater1.Items[GetControlIndex(
(((DropDownList)sender).ClientID))].FindControl("webUserControl2");
if(((DropDownList)sender).SelectedValue == "One Country")
{
control1.Visible = true;
control2.Visible = false;
}
else
{
control2.Visible = true;
control1.Visible = false;
}
}
public int GetControlIndex(String controlID)
{
Regex regex =new Regex("([0-9.*])", RegexOptions.RightToLeft);
Match match = regex.Match(controlID);
return Convert.ToInt32(match.Value);
}
}
}
WebForm1.aspx
- Use
Register
tags for each user control - Set user control
visible=false
and add to ItemTemplate
of the Repeater
- Add
Databinder.eval
and bind to each public property in the collection - Add a
DropDownList
to the ItemTemplate
and set OnSelectedIndexChanged
to the code that will handle it, and set AutoPostback
to true
(Missing the Register
tags at the top and the ItemTemplate
tags wrapping the DropDownList
and the user controls.)
By the way, my advice is to always add events to your user controls - I think someone else on this site gave the same advice. I'd go one step further and say that custom objects should implement IFormattable
, have a Notify event, throw custom errors, and override ToString()
, GetHashCode()
, and Equals()
- because not all code is perfect, and it'll save you hours in debugging time (if you give enough information). Perhaps use something like GetHashCode(){return Mash(this);}
- make sure that Equals
and GetHashCode
work together :-)
<html />
<head></head>
<form id="Form1" method="post" runat="server">
<repeater id="Repeater1" runat="server" />
<itemtemplate>
<dropdownlist id="ddlExtended" runat="server"
onselectedindexchanged="ddlExtended_SelectedIndexChanged"
autopostback="True" />
<webusercontrol1 id="webUserControl1"
runat="server" visible="false" />
<webusercontrol2 id="webUserControl2"
runat="server" visible="false" />
</itemtemplate>
</repeater />
</form>
Points of Interest
The FindControl
and Visible
properties were pretty much the only things needed for this problem in the end. I'd like to hear what your improvements would be.
History
This is not nice code, it is not good code - but it got the job done. I'll add other ways of doing this that will demonstrate best-practices, at a later stage.
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.