SharePoint Events

  9/03 - Webcast: SharePoint 2013 vs. SharePoint Online: Workflow
  9/04 - Webcast: Power Business Intelligence for SharePoint Online and Office 365
  9/05 - Webcast: SharePoint 2013 vs. SharePoint Online: Search
  9/30 - Webcast: Project Management Workflow in SharePoint
  10/01 - Webcast: SharePoint 2013 vs. SharePoint Online: Enterprise Content Management
  10/02 - Webcast: SharePoint 2013 vs. SharePoint Online: Business Intelligence

 SharePoint Videos

  Why SharePoint 2013
  Keys to Successful SharePoint Initiatives and User Adoption
  Out of the Box Business Intelligence and Reporting in SharePoint 2013
  Driving the Business Case and User Adoption for SharePoint
  Automate Business Processes with SharePoint 2013 and Business Connectivity Services
  SharePoint and Office 365 Migration Made Easy
  Full Lifecycle Content Management with SharePoint 2013
  Compliant Document Generation and Assembly in SharePoint
  Application of Content Security and Corporate Risk Protection in SharePoint
  How to Redline, Markup, Collaborate and Review Content in SharePoint
  Advanced Content Lifecycle and Records Management in SharePoint
  Advanced Workflow Made Easy with SharePoint 2013 and Nintex
  Full Lifecycle Content Management with SharePoint 2013
  SharePoint 2013 Solutions for the Financial Services Industry
  ProjectReady 2013: SharePoint Solutions built for the AEC
  SharePoint 2013 Solutions for the Legal Industry
  Driving the Business Case and User Adoption for SharePoint
  Investment Considerations for SharePoint 2010 and SharePoint 2013
  SharePoint 2013 and Enterprise Content Management
  SharePoint 2013 Launch
(More Links...)

 Archives

Opening SharePoint Links in a new windowUse SHIFT+ENTER to open the menu (new window).
Mail Enabled Lists vs. The Missing Windows 2008 POP3/IMAP Server Use SHIFT+ENTER to open the menu (new window).
7 Tools for SharePoint DevelopersUse SHIFT+ENTER to open the menu (new window).
Public Facing Masterpage TechniquesUse SHIFT+ENTER to open the menu (new window).
How to Quickly Deploy and Activate a Timer Service to Your Site CollectionUse SHIFT+ENTER to open the menu (new window).
Custom SharePoint Master Page Feature with WSP BuilderUse SHIFT+ENTER to open the menu (new window).
Date Math with InfoPathUse SHIFT+ENTER to open the menu (new window).
Enterprise Search Tricks and Tips Part 1Use SHIFT+ENTER to open the menu (new window).
Populating Word Documents With SharePoint Data. Try The DIP!Use SHIFT+ENTER to open the menu (new window).
Programmatic Deep Dive into Blank SharePoint Lookup ColumnsUse SHIFT+ENTER to open the menu (new window).
1 - 10 Next
Creating and Accessing Visual Webpart Properties from JavaScript

By: Omar Stewart

 

Everyone is familiar with the SharePoint Visual WebPart Project Template available in Visual Studio 2010, it makes it ultra-easy to create a Visual WebPart. There are times when you want to create custom properties for your visual WebPartwhich is ultra easy to do. What becomes tricky is how to access these properties from your user control, furthermore, how would you get these properties into JavaScript. Today I'll walk you through a simple demonstration of how to get this done. This will be a simple webpart to demonstrate the functionality, no bells and whistles here.

 

First we'll create a simple Visual WebPart from Visual Studio:

 

Creating_and_Accessing_Visual_Webpart_Properties_from_JavaScript 

 

Creating_and_Accessing_Visual_Webpart_Properties_from_JavaScript

 

We'll Open our VisualWebPart1.ascx User Control to add a plain HTML Button, and a simple asp:Literal which will hold the value of our property.

 

 

Creating_and_Accessing_Visual_Webpart_Properties_from_JavaScript

 

 

Then we'll navigate to our VisualWebPart1.cs to create our custom property. Our property will be a simple string.

 

The_SharePoint_Blog_Creating_and_Accessing_Visual_Webpart_Properties_from_JavaScript

 

 

Now back in our user control, we'll jump to the code behind file (VisualWebPart1UserControl.ascx.cs), here we will need to access the user control's parent which is really the WebPart, then we can have access to our custom properties.

 

Creating_and_Accessing_Visual_Webpart_Properties_from_JavaScript

 

 

Creating_and_Accessing_Visual_Webpart_Properties_from_JavaScript

 

Now that we can access our parent WebPart and its properties, lets create a hidden input field and assign our property as its value.

 

 

Creating_and_Accessing_Visual_Webpart_Properties_from_JavaScript

 

Our job is pretty much done,  lets write a JavaScript function and access our custom property.

Back in VisualWebPart1UserControl.ascx add the following script:
 

 

Creating_and_Accessing_Visual_Webpart_Properties_from_JavaScript

 

Then update the input button's onclick function to call our function.

 

Creating_and_Accessing_Visual_Webpart_Properties_from_JavaScript

 

That's it, deploy the project and add the WebPart to a page.

 

Creating_and_Accessing_Visual_Webpart_Properties_from_JavaScript

 

 

Creating_and_Accessing_Visual_Webpart_Properties_from_JavaScript

 

Now if we edit  our WebPart, we should see our custom Web Part Properties Section.

 

Creating_and_Accessing_Visual_Webpart_Properties_from_JavaScript

 

If we enter  some text in our custom property and click OK, our webpart should alert the property:

 

The_SharePoint_Blog_Creating_and_Accessing_Visual_Webpart_Properties_from_JavaScript

 

Voila! Clean markup, with our properties in a simple input field.

 

Creating_and_Accessing_Visual_Webpart_Properties_from_JavaScript

 

I hope this was helpful, and I'm always looking to learn about alternative ways to get this done. 

 

By: Omar Stewart

        

Comments

There are no comments yet for this post.
Items on this list require content approval. Your submission will not appear in public views until approved by someone with proper rights. More information on content approval.

Your Name *


e-mail address *


Website (optional)


Comment *


Attachments

 Subscribe

  GigWerks RSS  Gig Werks Mailing List 

 Contact Us

 Connect

 Resources

  On Demand SharePoint Webcast Recordings
  Upcoming Webinars
  SharePoint Resources
  Business Intelligence Resources
  Gig Werks Website



©2009 Gig Werks. All rights reserved. Privacy Policy