Tuesday, March 6, 2012

How to: Display a page as a Modal Dialog Box Use Webpart Visual 2010

Download example and list template to your computer and create list base on your custom list

Open sharepoint site, create new Custom List name is Employees
Change Title Field to EmployeeID
Create new Field FirstName, LastName
Add new some data to list
Open Visual studio 2010 | New Project | Empty Sharepoint Project | name is SanboxPopup
Choose “Deploy as a sandboxed solution”
Create Module: you can reference at here
Right click to solution | add new item | Module template | Name is Scripts
Appear Sample.txt in Scripts then rename Sample.txt to jsFunction.js
After change, result as follows
In the Module element, add a Url ="_catalogs/masterpage" RootWebOnly="TRUEList="116" attribute value
Delete Url Script/
In the File element, copy  Type="GhostableInLibrary" IgnoreIfAlreadyExists="TRUE" and paste to below
Open file jsFunction.js and delete content
Paste code below to content of file jsFunction.js
Expand Features treeview, rename Feature1 to ScriptsFeature
Double-click the ScriptsFeature node to open the Feature Designer.
In the Feature Designer, set the feature scope to Site.
In the Items in the Solution pane, click the Scripts module and Click the right arrow button to add the module to the feature. This moves the feature to the Items in the Feature pane (if Feature pane don’t appear)
Create new Webpart: Right click Project | Add new item | Webpart template | name is DialogDemo
Using library as follows:
using System;
using System.ComponentModel;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using Microsoft.SharePoint;
using Microsoft.SharePoint.WebControls;
using System.Web.UI.HtmlControls;
Declare code as follows
const string jsScriptURL = "/_catalogs/masterpage/jsFunctions.js";

Copy code and paste to method CreateChildControls()
HtmlGenericControl scriptInclude = new HtmlGenericControl("script");
scriptInclude.Attributes.Add("src",SPContext.Current.Site.RootWeb.Url + jsScriptURL);
HyperLink link = new HyperLink();
link.Text = "View Employees";
link.NavigateUrl = string.Concat("javascript: ShowDialog('",SPContext.Current.Site.RootWeb.Url,"/Lists/Employees/AllItems.aspx')");
In Solution Explorer, double-click the ScriptsFeature node to open the Feature Designer. Make sure that theDialogDemo Web Part is added to the feature.
Upload file  wsp and active it, you can reference how to way deploy sandbox at here, then add webpart and click to link below
Result as follows


Post a Comment