We have built our control (part 1, part 2, part 3, part 4) and now there is time to check it. Drag and drop on the WF_ListBoxes form our control (ListBoxesFT_C1) , three button controls (ButtonBack with the text "Back", ButtonJust with the text "PostBack" and ButtonTestDTOut with the text "Test DT_Out") and GridViewTestDT_Out (fig. 4).
Figure 4.
With the help of the ButtonBack we "redirect" our test page to the previous page. With the help of the ButtonJust we just "force to work" the PostBack event and, thus, have an opportunity to check up "behaviour" of the control. With the help of the ButtonTestDTOut and the GridViewTestDT_Out we check up "output" of our control (C_DataOut).
The code of the WF_ListBoxes is very simple:
public partial class WebForms_Test_WF_ListBoxes : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
GetData.GetDataHelp getData = new GetData.GetDataHelp();
if (!IsPostBack)
{
//ListBoxesFT_C1.C_Client = false;
//ListBoxesFT_C1.C_SortBy = 0;
//ListBoxesFT_C1.C_HeightLB = 200;
//ListBoxesFT_C1.C_WidthLB = 200;
//ListBoxesFT_C1.C_SortByText = false;
//ListBoxesFT_C1.C_LabelTo = "To";
//ListBoxesFT_C1.C_LabelFrom ="From";
ListBoxesFT_C1.C_DataIn =
getData.getDataSetCities(10).Tables[0];
}
}
protected void ButtonBack_Click(object sender, EventArgs e)
{
Response.Redirect("~/Default.aspx");
}
protected void ButtonTestDTOut_Click(object sender, EventArgs e)
{
GridViewTestDT_Out.DataSource = ListBoxesFT_C1.C_DataOut;
GridViewTestDT_Out.DataBind();
}
}
Now , for example , if your team leader chooses your control for checking up (fig. 5),
Figure 5.
he gets the following (fig 6.):
Figure 6.
He selects some items and clicks on the "Test DT_Out". The result is the following (fig. 7):
Figure 7.
He clicks on the "PostBack"! All is OK. He asks to change the C_Client property to "false" , the C_SortBy property to "0", the C_HeightLB and C_WidthLB properties to "200". He selects the same items and gets the result (fig. 8):
Figure 8.
OK! Your boss is satisfied by your work and authorizes to apply the control!
You can show the initiative and add such properties as : "C_Multiple" ,that allows to set selection mode of the ListBoxes to "multiple" ; "C_Validation", that allows to validate selected items with the help of a control (RangeValidator), added to the ListBoxesFT_C ; "C_Default", that allows to set default selected items ; etc.
We have built the control with the help of "clear server" and "clear client" technology. Such new features of ASP.Net 2.0 as the ICallbackEventHandler interface we will discuss in the next article.
CONCLUSION
I hope that this article will help you to recreate and test the ListBoxesFT_C control or to create and test your own web user control with your own requests in Visual Studio 2005.
Good luck in programming !
Luis CarroeditedPosted Oct 22, 2007, 11:34 AMEdited Oct 22, 2007, 11:38 AM
Easy to understand and very useful. I write just to thank you publish these articles. Were very helpful in my first job in ASP.NET and JavaScript. Congratulations on the job, is very good.
Luiz GuimaraesPosted Sep 28, 2007, 11:14 AM
Hi Michael, First of all, thanks a lot for this great article you shared with the community. I am getting an error when I click the button Test DT_Out tha says that _DT_In is null. I think I am loosing the DataTable after the PostBack action. I followed all steps you put in the article and I don't know what I am doing wrong. Maybe is a silly thing because I am new with VS and Web Design. Thanks, Luiz
Luiz GuimaraesPosted Sep 28, 2007, 11:13 AM
Hi Michael, First of all, thanks a lot for this great article you shared with the community. I am getting an error when I click the button Test DT_Out tha says that _DT_In is null. I think I am loosing the DataTable after the PostBack action. I followed all steps you put in the article and I don't know what I am doing wrong. Maybe is a silly thing because I am new with VS and Web Design. Thanks, Luiz
vidapuraeditedPosted Feb 8, 2007, 6:42 AMEdited Feb 8, 2007, 6:43 AM
Michael, Thank you very much for sharing your knowledge on this point. I have searched high and low on the web for a control like this. I have implemented your code and used it on a simple page and all worked well.. but when I incorporated this user control into an EditItemTemplate i found that the control is not showing the initial data that I supplied for the two listboxes... On my simple page I just implemented the pageload as follows: if (!IsPostBack) { ListBoxesFT_C1.C_Client = false; ListBoxesFT_C1.C_SortBy = 0; ListBoxesFT_C1.C_HeightLB = 200; ListBoxesFT_C1.C_WidthLB = 200; ListBoxesFT_C1.C_SortByText = true; MRSDATABASETableAdapters.CountryToCurrencyTableAdapter CountryAdapter = new MRSDATABASETableAdapters.CountryToCurrencyTableAdapter(); MRSDATABASE.CountryToCurrencyDataTable assignedCountryList; MRSDATABASE.CountryToCurrencyDataTable unassignedCountryList; assignedCountryList = CountryAdapter.GetCountryListIncluding("4,8,12,16"); unassignedCountryList = CountryAdapter.GetCountryListExcluding("4,8,12,16"); ListBoxesFT_C1.C_DataIn = CountryAdapter.GetCountryListExcluding("4,8,12,16"); ListBoxesFT_C1.C_DataOut = CountryAdapter.GetCountryListIncluding("4,8,12,16"); } else { Label1.Text = "postedback"; GridViewTestDT_Out.DataSource = ListBoxesFT_C1.C_DataOut; GridViewTestDT_Out.DataBind(); } and it works fine on the simple page.. but when the control is used as part of an edititem template I cannot figure out how to get it working... I presume there is something I ahve to do in relation to page lifecycle? Thanks Vida