It’s my first article on Asp.net Web Parts. Basically it’s an introduction article how one can start to learn the high end feature of Asp.net web parts. As you knew that most of the portal contains several block. In general the end user can not change the page block orientation or positioning which is termed as personalization. The Asp.net Web Parts gives us the personalization facility with little code. That’s why the Web Parts is necessary to learn. In my below example I will show you how developers can provide the Drag & Drop facility to personalize end user UI.
To do that you have to understand only two things. The first one is WebPartManager & the second one is WebPartZone.
WebPartManager:
This Asp.net server control manages the state of the zones per user basis. The most important part is you must place an Asp.net WebPartManager server control in each page. But the situation is different for master page as we know. The another importance of the WebPartManager server control is to maintain the communication between different elements contained in a zone or within different zone. Let’s say in one zone you display the product list & in another zone you display the product details. Which means zones are dependent on each other. If you select a product in first zone then you must change the product details in next zone. For such type of cases communication is required done by WebPartManager.
WebPartZone:
WebPartZone contains the elements that you want to Drag & Drop. You can Drag & Drop contains from one zone to another zone. The WebPartManager just controls the zones. You cannot put zone contents into the rest of the pages which does not contain another zone.
Note:
Please note that by default Asp.net creates ASPNETDB.MDF and stores it in the App_Data folder.
Start Example:
Add an Aspx page in your project. Write the below HTML markup:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="WebParts.aspx.cs" Inherits="WebParts" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>An Example on Asp Web Parts</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:WebPartManager ID="WebPartManager1" runat="server" >
</asp:WebPartManager>
<table border="1">
<tr style="background:Blue">
<td colspan="3">
<h1 style="color:White">Welcome to shawpnendu.blogspot.com</h1>
</td>
</tr>
<tr>
<td>
<asp:WebPartZone ID="WebPartZone1" runat="server" HeaderText="Enter Name">
<ZoneTemplate>
<asp:TextBox runat="server" ID="txtLastName" Title="Enter Last Name:"></asp:TextBox>
</ZoneTemplate>
</asp:WebPartZone>
</td>
<td>
<asp:WebPartZone ID="WebPartZone2" runat="server" HeaderText="Enter Name">
<ZoneTemplate>
<asp:TextBox runat="server" ID="txtMiddleName" Title="Enter Middle Name:"></asp:TextBox>
</ZoneTemplate>
</asp:WebPartZone>
</td>
<td>
<asp:WebPartZone ID="WebPartZone3" runat="server" HeaderText="Enter Name">
<ZoneTemplate>
<asp:TextBox runat="server" ID="txtFirstName" Title="Enter First Name:"></asp:TextBox>
</ZoneTemplate>
</asp:WebPartZone>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
Please note that control Title property will represent the section name of a zone.
Now run the page & you will get the below output:
In this scenario you will not get the Drag & Drop facility. Only get Minimize & close option in each zone. Because the Drag & Drop facility based on WebPartManager DisplayMode property. The default value is "Browse". If you change the mode from "Browse" to "Design" mode then you will get Drag & Drop Facility like below:
To change the WebPartManager DisplayMode property just write the below code:
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
WebPartManager1.DisplayMode = WebPartManager1.SupportedDisplayModes[1];
Response.Write("Current MODE= " + WebPartManager1.SupportedDisplayModes[1].Name + "");
}
}
Ok now test the page & start to learn Asp.Net Web Parts. Drag one content & Drop the selected content into another zone. Now run the page again & the interesting thing is the page retain your last zone orientations. Because Asp.net stores your action into the ASPNETDB.MDF. Later on i will discuss zone to zone communication steps.
Subscribe
