200 likes | 330 Views
Hands on Lab. ASP.NET Web Parts and Master Pages. Keith Bunge 9/6/2007. Lab 1: ASP.NET Interoperability The Old.
E N D
Hands on Lab ASP.NET Web Parts and Master Pages Keith Bunge 9/6/2007
Lab 1: ASP.NET InteroperabilityThe Old • Developing custom Web Parts for Windows SharePoint Services 2.0 provided an easy and powerful way to extend Windows SharePoint Services team sites and Microsoft Office SharePoint Portal Server 2003 portal sites • The Windows SharePoint Services 2.0 Web Part infrastructure was designed specifically for Microsoft SharePoint Products and Technologies and it provided a transparent layer of plumbing to manage required tasks such as serialization, storage, and retrieval of the data associated with Web Part customization and personalization
Lab 1:ASP.NET InteroperabilityThe New • Web Part Framework • Microsoft ASP.NET 2.0 introduces Web Part infrastructure • Part of the ASP.NET runtime • Standardizes Web Part development across more than SharePoint • SharePoint uses the ASP.NET 2.0 Web Part infrastructure • Derives directly from the ASP.NET Web Part class • This give developers two choices • Create a Windows SharePoint Services 3.0 Web Part • Create a “pure” ASP.NET 2.0 Web Part • It is important to note if you require some, or all, of the following SharePoint functionality, you must create a SharePoint Web Part. • Cross page connections • Connections between Web Parts that are outside of a Web Part zone • Client-side connections • Data caching infrastructure • Asynchronous Web Part processing
Exercise 1: Create an ASP.NET Web PartStage 1: Create a New Project • Login using the following credentials: • Username: administrator • Password: pass@word1 • Log on to: LITWAREINC • Wait for the Warmup Script to complete and the popup window to close. • Open Microsoft Visual Studio 2005 from the desktop shortcut. • Select File | New Project… • Select Visual C# | ClassLibrary and enter the following information: • Name: SimpleASPNETWebPart • Location: C:\HOL\ASPNET\ • Uncheck Create directory for solution check box • Click OK. • Select Project | Add Reference… • Select the first System.Web • Click OK.
Exercise 1: Create an ASP.NET Web PartStage 2: Setup Declarations and Class • Add declarations for SQL Server data connections and ASP.NET 2.0 Web Parts by clicking in the window after the following • using System; • using System.Collections.Generic; • using System.Text; • Right-click and choose Insert Snippet… • From the selection box, choose ASPNet > Declarations • Highlight the Class1 class • Right-click and choose Insert Snippet… • Choose ASPNet > Class to insert the new SimpleASPNETWebPart class. This class will inherit System.Web.UI.WebControls.WebParts.WebPart and override RenderContents().
Exercise 1: Create an ASP.NET Web PartStage 2: Setup Declarations and Class public class SimpleASPNETWebPart : WebPart { const string connectionString = "Server=OS;Trusted_Connection=True;Database=AdventureWorksDW"; const string selectString = "SELECT ProductKey, EnglishProductName, Color FROM DimProduct WHERE ProductKey > 0 AND ProductKey < 100"; public SimpleASPNETWebPart() { this.Title = "Simple ASP.NET Web Part"; this.ExportMode = WebPartExportMode.All; } protected override void Render(System.Web.UI.HtmlTextWriter writer) { // Load Products into DataTable DataTabledataTable = new DataTable(); SqlDataAdapterdataAdapater = new SqlDataAdapter(selectString, connectionString); dataAdapater.Fill(dataTable); // Render the rows of the table foreach (DataRow row in dataTable.Rows) { writer.Write(String.Format("{0} - {1} <BR>", row["EnglishProductName"], row["Color"])); } } }
Exercise 1: Create an ASP.NET Web PartStage 3: Sign the assembly • Add a Strong Key to the assembly • Select Project | SimpleASPNETWebPart properties. • Select the Signing tab • Check the Sign the assembly box and <Browse…> from the Choose a strong name key file drop down. • Select the key file C:\HOL\ASPNET\SimpleASPNETWebPart.snkand click Open • Select Build | Build SimpleASPNETWebPart • Open the Office 12 Command Prompt from the desktop link and register the DLL • gacutil /i c:\HOL\ASPNET\SimpleASPNETWebPart\bin\Debug\SimpleASPNETWebPart.dll • Reset IIS • iisreset
Exercise 2: Create an ASP.NET Web SiteStage 1: Create Web Site Project • Return to Visual Studio 2005 • Select File | New Web Site… • Select ASP.NET Web Site and enter the following information… • Language: Visual C# • Location:C:\HOL\ASPNET\SimpleASPNETWebSite • Click OK
Exercise 2: Create an ASP.NET Web SiteStage 2: Create Web Part Page • Switch to Design mode for Default.aspx • Select Tools | Choose Toolbox Items… • Click Browse… • Select C:\HOL\ASPNET\SimpleASPNETWebPart\bin\Debug\SimpleASPNETWebPart.dll and click Open • Click OK. • Expand the WebParts item in the Toolbox • Drag and drop a WebPartManager onto the page • Drag and drop a WebPartZone onto the page • Drag and drop a SimpleASPNETWebPart into the WebPartZone1 area on the page
Exercise 2: Create an ASP.NET Web SiteStage 3: Configure Web Site • Double-click on the Web.config file in the Solution Explorer to open it. • Click in the <system.web> section • Right-click and choose Insert Snippet… • Choose ASPNet > Enable Export to insert the an entry to allow export of web parts • Highlight the <connectionStrings /> line • Right-click and choose Insert Snippet… • Choose ASPNet > ConnectionStrings to replace the line with the connectionString entry for the default SQL Server 2005 database • Select Debug | StartWithout Debugging… • A new Internet Explorer window should appear, with the ASPNET Web Part displayed, this may take a few moments.
Exercise 2: Create an ASP.NET Web SiteStage 4: Export the Web Part • Use the down arrow in the Web Part to access the Verb menu, choosing Export • Select OK at the warning • Select Save • Save the file in the C:\HOL\ASPNET directory with a filename of SimpleASPNETWebPart • Click Save • Click Open to view the export file – if prompted, choose Notepad as the viewing application
Exercise 2: Create an ASP.NET Web SiteStage 4: Export the Web Part <?xml version="1.0" encoding="utf-8"?> <webParts> <webPartxmlns="http://schemas.microsoft.com/WebPart/v3"> <metaData> <type name="SimpleASPNETWebPart.SimpleASPNETWebPart,SimpleASPNETWebPart,Version=1.0.0.0,Culture=neutral,PublicKeyToken=abdbc6c881979452"/> <importErrorMessage>Cannot import this Web Part.</importErrorMessage> </metaData> <data> <properties> <property name="AllowClose" type="bool">True</property> <property name="Width" type="unit" /> <property name="AllowMinimize" type="bool">True</property> <property name="AllowConnect" type="bool">True</property> <property name="ChromeType" type="chrometype">Default</property> <property name="TitleIconImageUrl" type="string" /> <property name="Description" type="string" /> <property name="Hidden" type="bool">False</property> <property name="TitleUrl" type="string" /> <property name="AllowEdit" type="bool">True</property> <property name="Height" type="unit" /> <property name="HelpUrl" type="string" /> <property name="Title" type="string">Simple ASP.NET Web Part</property> <property name="CatalogIconImageUrl" type="string" /> <property name="Direction" type="direction">NotSet</property> <property name="ChromeState" type="chromestate">Normal</property> <property name="AllowZoneChange" type="bool">True</property> <property name="AllowHide" type="bool">True</property> <property name="HelpMode" type="helpmode">Navigate</property> <property name="ExportMode" type="exportmode">All</property> </properties> </data> </webPart> </webParts>
Exercise 3: Import in to SharePointStage 1: Configure the Web Application • In Visual Studio select File | Open | File... and open • C:\Inetpub\wwwroot\wss\VirtualDirectories\moss.litwareinc.com80\web.config. This is the web.config for the SharePoint site. • Click in the file on the line above </SafeControls> • Right-click and choose Insert Snippet… • Choose ASPNet > SafeControl to insert the SafeControl entry for your new web part • Save web.config file and exit Visual Studio
Exercise 3: Import in to SharePointStage 2: Upload Web Part Definition • Open Internet Explorer and navigate to the ASPNET test site • http://moss.litwareinc.com/sites/aspnet/default.aspx • Click on Site Settings from the Site Actions drop down • Click on Web parts in the Galleries section • Click on Upload • Click Browse and navigate to C:\HOL\ASPNET\SimpleASPNETWebPart.WebPart • Click OK on the Upload Document page • Click OK on the Edit Item page • Click the Home tab to return to the site homepage • Click on Edit Page from the Site Actions drop down • Click on Add a web part in the Left zone • Check Simple ASP.NET Web Part and click Add • Click Exit Edit Mode
Lab 2: Master PagesIntroduction • In Microsoft Windows SharePoint Services 2.0, you can share a page definition across sites (unless a user customizes the page instance), but there is no effective templating technique that allows you to share common elements between page definitions. • As a result, there is no easy way to change the look and feel of a page across the entire site. You can customize pages through the browser and Microsoft Office FrontPage® 2003, and developers can deploy new templates or change existing templates on the front-end Web server, but for both of those customizations, you must make the change on each and every page the end user will see. • Microsoft ASP.NET 2.0 introduces the concept of master pages. With master pages, a developer can specify all of the shared elements in an .aspx page in the master page, and have content pages that add the content page-specific elements. Because Windows SharePoint Services 3.0 is built on top of ASP.NET 2.0, you can take advantage of ASP.NET 2.0 master pages, using master pages to define elements that are common to all pages, and content pages to provide page-specific elements.
Lab 2: Master PagesMore bang for your buck • When you use master pages, you experience the following advantages: • A better editing experience for Windows SharePoint Services 3.0 pages • Developers can better use their time and resources by making design changes in one place and propagating the changes to all the pages that use the master page. • Web level editing • Users can edit master page elements for their site in one place. They also can go to one place to make changes, and do not have to customize all of the pages. • UI reuse • Make it easier to create a page with the Windows SharePoint Services 3.0 look and feel. By referencing the Windows SharePoint Services 3.0 master page, a page based on it gets the Windows SharePoint Services 3.0 look and feel, and also picks up any updates to the master page. • More consistent pages and a better end user experience • Because all of the pages associated with Windows SharePoint Services 3.0 have the same consistent look and feel, end users can browse from a core Windows SharePoint Services 3.0 page to a page added by a third-party solution or to a page customized by the Web designer, and not notice a difference in the way the site looks or its controls work.
Lab 2: Master Page SwitcherStage 1: Feature.xml and minimal.master • Open C:\HOL\ASPNET\MasterPageSwitcher\NewMasterPages directory and examine the files included in this feature • Open C:\HOL\ASPNET\MasterPageSwitcher\NewMasterPages\minimal.master and compare it to C:\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\FEATURES\MPLIB\default.master • They are nearly identical except minimal.master has the top-most area of the page omitted • Open the C:\HOL\ASPNET\MasterPageSwitcher\LayoutPages\MPChooser.aspx file.
Lab 2: Master Page SwitcherStage 1: Feature.xml and minimal.master <script language="C#" runat=server> protected override void OnLoad(EventArgs e) { if (!this.IsPostBack) { SPWeb web = SPContext.GetContext(this.Context).Web; SPList list = web.GetListFromUrl("_catalogs/masterpage/Forms/AllItems.aspx"); SPDataSourcedataSource = new SPDataSource(); dataSource.List = list; this.MasterPageList.DataSource = dataSource; this.MasterPageList.DataTextField = "Name"; this.MasterPageList.DataValueField = "Name"; this.MasterPageList.DataBind(); String pageValue = web.MasterUrl; int position = pageValue.ToLowerInvariant().IndexOf("/_catalogs/masterpage/"); if (position > 0) { pageValue = pageValue.Substring(position + 22, pageValue.Length - (position + 22)); } try { this.MasterPageList.SelectedValue = pageValue; } catch (Exception) { ; } } base.OnLoad(e); } void DoSubmit(object sender, EventArgs e) { SPWeb web = SPContext.GetContext(this.Context).Web; web.MasterUrl = web.ServerRelativeUrl + "/_catalogs/masterpage/" + this.MasterPageList.SelectedValue; web.Update(); Response.Redirect(web.ServerRelativeUrl + "/default.aspx"); } </script>
Lab 2: Master Page SwitcherStage 2: Install the Master Page Switcher • Open an “Office 12 Command Prompt” by double-clicking the shortcut found on the desktop. • Navigate to the MasterPageSwitcher directory • cd HOL\ASPNET\MasterPageSwitcher • Copy the “Master page picker” page to the appropriate directory with the following command • copy LayoutPages\MPChooser.aspx "c:\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\LAYOUTS" • Copy the feature to the appropriate directory with the following command • xcopyNewMasterPages "C:\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\FEATURES\NewMasterPages\" /s /y • Install the feature for the server with the following command • stsadm -o installfeature -filename NewMasterPages\feature.xml
Lab 2: Master Page SwitcherStage 3: Activate the Master Page Switcher • Activate the feature for the ASPNET team site with the following command • stsadm -o activatefeature -filename NewMasterPages\feature.xml -url http://moss.litwareinc.com/sites/aspnet • Open Internet Explorer and navigate to the ASPNET test site at http://moss.litwareinc.com/sites/aspnet/ . • Note the strip at the top of the page with ASPNET Lab, Welcome, My Site, etc. links • Go to the Site Settings page by clicking on Site Settings from the Site Actions menu. • Notice the Master page picker link in the Look and Feel section. Click that link. • You are taken to Choose Page Template page. • Select Minimal.master and click OK. • Note the strip at the topmost part of the page with ASPNET Lab, Welcome, My Site, etc. links is no longer there