|
|||||||||||||||
 |
 |
 
|
|
|
|
 |
||||||||||||||||||
|
|
 |
|
||||||||||||||||
|
|
|
|
|
||||||||||||||
|
|
||||||||||||||||||
|
Dynamically Adding Custom User Controls to a Web Part Catalog Zone / User Controls / ASP. NET |
|
|
IntroductionWelcome! This article shows how you can add custom user controls to your web page, dynamically, at run time. Adding custom user controls to a web page can be done by using web parts. As shown in the figure above, the page is divided into several partitions, and we have some zones called Some basics
Well, I have already talked about web parts, Now, what are web part zones? These zones are nothing but placeholders where you can place your web parts. The page can be divided into any number of zones, and you can place web parts onto whichever zones you want to. Now, coming to the modes of display - Note: We won't be using this import catalog part to import user controls because it requires files with extension *.webpart, but user controls have an extension *.ascx. So, if you try to import a user control using this import catalog part, it won't work!! Then, there is something called editor zone using which you can edit the properties of the webpart such as appearance, behavior etc., but that is beyond the scope of discussion in this article. If you are thinking about how to add these to your web page, don't worry, it's all available as a drag drop feature in your toolbox in Visual Studio 2005 (shown in the figure adjacent). Well, I guess that would have given you some insight into web parts. So, let's get ready to take off! Designing your pageBefore you start adding the web part zones to your page, you should first add something called the <html xmlns ="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Home Page</title>
</head>
<body bgcolor="lightsteelblue">
<form id="form1" runat="server">
<asp:WebPartManager ID="WebPartManager1"
Runat="Server" /></form>
</body>
</html>
I have added two web part zones to the page, and I have also added a catalog zone with a Writing your own custom controlThe process of writing your own custom control is very easy. Click on Add New Item on your project window, and choose Custom User Control. It will have an extension *.ascx. Now, a new page opens up, and you can place any control that you want to that best suits your needs. For simplicity, just place a Writing the code-behindThe code for switching between the modes is pretty simple: protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
{
switch (DropDownList1.SelectedValue)
{
case "Browse":
WebPartManager1.DisplayMode = WebPartManager.BrowseDisplayMode;
break;
case "Design":
WebPartManager1.DisplayMode = WebPartManager.DesignDisplayMode;
break;
case "Edit":
WebPartManager1.DisplayMode = WebPartManager.EditDisplayMode;
break;
case "Catalog":
WebPartManager1.DisplayMode = WebPartManager.CatalogDisplayMode;
break;
default:
break;
}
}
To upload files to your page dynamically, you need to write some piece of code behind the Upload button. Note that the Upload button should also take care of uploading files with the names that already exist on the server. Suppose you already have a file cal.ascx on your server, and still, if you upload another file with the same name, the older file will be overwritten with the new file. To avoid that from happening, we include a small piece of code to prefix an underscore (_) before the name of the file until we arrive at a unique filename. The code behind the Upload button is given below: protected void Upload_Click(object sender, EventArgs e)
{
string strFileName = MyFile.PostedFile.FileName;
strFName = System.IO.Path.GetFileName(strFileName);
Response.Write("upload : " + strFName);
try
{
while (System .IO.File .Exists ("D:\\intern\\webapp" +
"\\DynamicWebPart\\DynamicWebPart\\" + strFName))
{
strFName = "_" + strFName;
}
MyFile.PostedFile.SaveAs("D:\\intern\\webapp\\" +
"DynamicWebPart\\DynamicWebPart\\" + strFName);
Response.Write("File Upload Successful");
}
catch (Exception e1)
{
Response.Write("Exception : " + e1);
}
Label1.Visible = true;
TextBox1.Visible = true;
Button1.Visible = true;
}
Note that the path that I have given will save the file onto the directory of the file system specified. In your system, please modify the path as to where you need to store the uploaded file. The protected void Button1_Click(objectsender, EventArgs e)
{
try
{
Response.Write(strFName);
Control control = LoadControl(strFName);
control.ID = "control";
WebPart myWebPart = WebPartManager1.CreateWebPart(control);
myWebPart.Title = TextBox1.Text.ToString ();
WebPart newPart = WebPartManager1.AddWebPart(myWebPart,
WebPartManager1.Zones[0], 0);
if(WebPartManager1.WebParts .Contains (newPart ))
WebPartManager1.CloseWebPart(newPart);
else
Response.Write(WebPartManager1.Zones[0].WebParts.Contains(newPart));
}
catch (HttpExceptione2)
{
Response.Write("Exception e2 : " + e2);
}
Label1.Visible = falsefalse;
Button1.Visible = false;
}
Now, your web page is ready and fully functional. But there are some other key aspects to know before you get into trouble. Points of interestWhat if you want to reset all the changes that you have made to your page in the process of customizing it? What if you want the page to look like how it was during the design phase? There is a solution for this... The Reset button. No, not the Reset button you have on your HTML controls. This is an ASP button with the following code-behind: protected void LinkButton1_Click(object sender, EventArgs e)
{
PersonalizationAdministration.ResetAllState(PersonalizationScope.User);
Response.Redirect("default.aspx");
}
Another important thing to note is that, chances are that you may receive an error message stating that "Under Default conditions, SQL Server 2005 will not allow remote connections". If you get that error message, don't get perplexed that you have not used any database but why is that the error message is coming. It is because, you are personalizing the page, and this personalization is provided for every user who accesses this web page. So the server uses a database to store the changes or the customizations you have done to the page, under your user name or user ID. Hence comes the need of the database. When you get that error message, follow the link that tells you what is to be done to rectify the problem. That completes this article. Feel free to post your comments... I'll be more than glad to receive your remarks and suggestions! |
|
|
 |
|
|
|
