SharePoint 2010 Modal Dialogs – Richer UI’s By Daryl Human Senior SharePoint Consultant –...
-
Upload
derick-richard-cannon -
Category
Documents
-
view
223 -
download
0
description
Transcript of SharePoint 2010 Modal Dialogs – Richer UI’s By Daryl Human Senior SharePoint Consultant –...
SharePoint 2010 Modal Dialogs – Richer UI’s
By Daryl HumanSenior SharePoint Consultant – SharePoint Konsult
Introduction
• Daryl Human – SharePoint Konsult– ASP.Net Developer for 8+ years– MCTS– SharePoint Consultant for 5+ years– Worked in Finance, Government, Tourism &
Banking industries.
Presentation Agenda
• Introduction to SP.UI.ModalDialog Class• Create a basic popup dialog• Dialog Properties• Adding notifications• Use the OM to create a list.• References• Questions
SharePoint Konsult
• Specialist in SharePoint delivery and support • A division of SMC Enterprise (Pty) Ltd• SMC - Established in 1999 • Microsoft and SAP Partner status• BEE - AAA Level 1 Empowerdex Rated• Staff compliment of 60.• Operating from Cape Town (Head Office),
Johannesburg, Durban and USA
Key SharePoint Offerings• ECRM Maturity Assessment• SharePoint Roadmap• Enterprise Content Management
(DMS, RMS, Social Networking, Scanning & Imaging, BPM)
• Internet, Intranet & Extranet implementations• User Interface/User Experience Services• SharePoint-SAP Integration• Change Management • SharePoint Management Services
Our Customers Include:Public Sector• City of Cape Town• City of Tshwane • PetroSA• TCTA• Services Seta• LG Seta• Broadband Infraco• PGWC• W. Cape Provincial Parliament• Parliament of the RSA• SAMSA• CTICC
Private Sector• Old Mutual • Woolworths• Vodacom• Pick n Pay• LabCorp (USA)• Saudi Aramco (Middle East)• Pioneer Foods• Foord Asset Management• Acsis• SharePoint Konsult • Luxottica/Sunglasses Hut• E-TV
Our PartnersAccess SharePoint Offline / Outlook Integration• Sync SharePoint sites to laptop• Take document libraries offline
SharePoint DRP Management• Data protection• SharePoint storage optimization• SharePoint integration and migration
Ontolica Search• Advanced FAST like features without the cost• Full document preview in search results• Detailed search reports
AIIM SharePoint Certification Program• Internationally recognized SharePoint training for Business Users
The SP.UI.ModalDialog Class
• Useful when some sort of administrative feature or user feedback is required.
• If you look at the SharePoint 2010, you’ll notice a focus on modal views.
• Look at some of the most commonly used properties:
SP.UI.ModalDialog Properties• url: Contains the URL of the page that appears in the dialog.• html: Contains the HTML of the page that appears in the
dialog. Note: if both url and html are specified, url will be used. You need to specify at least one of the two.
• width - The default is 768 if not specified and auto sizing is disabled.
• height - The default is 576 if not specified and auto sizing is disabled.
• args - Contains an object or other data that can be passed to the dialog. Optional.
Creating a basic popup dialog
• Live demo
Setting Properties for the Dialog
• Live demo
Adding Notifications• Live demo• // Dialog callback
function CloseCallback(result, target) { if (result == SP.UI.DialogResult.OK) { //Get id messageId = SP.UI.Notify.addNotification("<img src='_layouts/images/loading.gif'> Creating list <b>" + target + "</b>...", true, "Dialog response", null); //Create list using client OM //createList(target);} if (result == SP.UI.DialogResult.cancel) { SP.UI.Notify.addNotification("Operation was cancelled...", false, "", null); } }
Using the OM to create lists
• Live demo
References• The SP.UI.ModalDialog Class:
http://msdn.microsoft.com/en-us/library/ff408909.aspx• The SP.UI.ModalDialog Properties:
http://msdn.microsoft.com/en-us/library/ff410058.aspx• Blog:
www.dizzyonsharepoint.wordpress.com• Twitter:
@DarylHuman
Questions