SlideShare une entreprise Scribd logo
1  sur  22
Top 10 jQuery Uses in SharePoint 2010

Thank you for joining our webinar!
We will begin shortly.
Housekeeping
• „30 on Thursday‟ Series
  – Bi-weekly 30 minute webinar series


• Next Webinar: Thursday, February 21st
  – Building Charts with Power View - SharePoint 2013 and
    Excel 2013


• Full Schedule: www.susqtech.com/webinars
Housekeeping
• Today‟s Session is being recorded


• Archive of Past Sessions
  – SusQtech.com/ArchivedWebinars


• Questions - Use the window at right
OnlineCourses



Advanced InfoPath Forms in   Using jQuery in SharePoint 2010
SharePoint 2010 Webinar      Webinar
February 20, 2013 | Online   March 28, 2013 | Online




                 Learn More or Register at
               SusQtech.com/OnlineTraining
CourseRecordings




SusQtech.com/OnlineTraining
Today’sSession
• Topic:
  – Top 10 jQuery Uses in SharePoint 2010
• Presenter:
  – Marc Anderson, SharePoint MVP
• Moderator:
  – Steve Witt, SusQtech
LET’S GET STARTED!
What Is jQuery?
From the 30 on Thursday webinar
description:
  “jQuery is a powerful JavaScript library that
  allows for easy implementation of dynamic
  user interface components for things like
  accordion navigation, tabs and image
  rotators that make website more engaging
  and usable.”
What Is jQuery?
From the jQuery.com site:
  “jQuery is a fast, small, and feature-rich
  JavaScript library. It makes things like HTML
  document traversal and manipulation, event
  handling, animation, and Ajax much simpler
  with an easy-to-use API that works across a
  multitude of browsers. With a combination of
  versatility and extensibility, jQuery has
  changed the way that millions of people write
  JavaScript.”
Adding jQuery/jQueryUI




Referencing jQuery, jQueryUI, and SPServices from CDNs – Revisited
http://sympmarc.com/2013/02/07/referencing-jquery-jqueryui-and-
spservices-from-cdns-revisited/
10. Simple text changes


  $(".ms-socialNotif-text").text("Like This");
9. Add branding effects
         • Not just CSS-based
         • React to user behavior




Fancy checkboxes and radio buttons
http://www.sympraxisconsulting.com/Demos/Demo%20Pages/FancyC
BandRB.aspx
8. Add new behavior to
existing controls
$("input[title='Title']").val("Enter the title....");
$("input[title='Title']").click(function() {
  $(this).val("");
});
7. Rearrange DOM elements




$().SPServices.SPArrangeChoices
http://spservices.codeplex.com/wikipage?title=$().SPServices.SPArrangeChoices
6. Add jQueryUI effects
5. Plugins, plugins, plugins
      • Image rotators
      • Slideshows
      • Charting
      • Graphing
      • Animation
      • Effects


jQuery Plugin Registry: http://plugins.jquery.com/
MetroJS: http://www.drewgreenwell.com/
4. Improve form interactions
     • Cascading dropdowns
     • Display related info
     • Update multiple lists at the same time




$().SPServices.SPCascadeDropdowns
$().SPServices.SPDisplayRelatedInfo
3. Reduce the number of
postbacks
• Use .ajax() to write to underlying lists
  and libraries
• Satisfy the Facebook generation
2. Improve the out of the box
         user interface




Display All Related Tasks for a SharePoint Workflow Using jQuery, SPServices, and jQueryUI
http://sympmarc.com/2011/06/07/display-all-related-tasks-for-a-sharepoint-workflow-using-
jquery-spservices-and-jqueryui/
1. Create interactive
applications
Questions/Comments
Marc Anderson
marc.anderson@sympraxisconsulting.com
  @sympmarc

Steve Witt
SteveW@susqtech.com
   @splumberjack

    www.SusQtech.com/Webinars
ThankYou!

Contenu connexe

Plus de Marc D Anderson

Plus de Marc D Anderson (20)

SPC2019 - Managing Content Types in the Modern World
SPC2019 - Managing Content Types in the Modern WorldSPC2019 - Managing Content Types in the Modern World
SPC2019 - Managing Content Types in the Modern World
 
ECS2019 - Managing Content Types in the Modern World
ECS2019 - Managing Content Types in the Modern WorldECS2019 - Managing Content Types in the Modern World
ECS2019 - Managing Content Types in the Modern World
 
Rencontre Groupe d'usagers SharePoint Montreal - The Next Great Migration - C...
Rencontre Groupe d'usagers SharePoint Montreal - The Next Great Migration - C...Rencontre Groupe d'usagers SharePoint Montreal - The Next Great Migration - C...
Rencontre Groupe d'usagers SharePoint Montreal - The Next Great Migration - C...
 
RISPUG - Top Form - Using PowerApps to Replace List Forms
RISPUG - Top Form - Using PowerApps to Replace List FormsRISPUG - Top Form - Using PowerApps to Replace List Forms
RISPUG - Top Form - Using PowerApps to Replace List Forms
 
SPCNA 2018 - Top Form - Using PowerApps to Replace List Forms
SPCNA 2018 - Top Form - Using PowerApps to Replace List FormsSPCNA 2018 - Top Form - Using PowerApps to Replace List Forms
SPCNA 2018 - Top Form - Using PowerApps to Replace List Forms
 
SPCNA 2018 - The Next Great Migration - Classic to Modern
SPCNA 2018 - The Next Great Migration - Classic to ModernSPCNA 2018 - The Next Great Migration - Classic to Modern
SPCNA 2018 - The Next Great Migration - Classic to Modern
 
SPS New York City 2017 - The Lay of the Land of Client-Side Development circa...
SPS New York City 2017 - The Lay of the Land of Client-Side Development circa...SPS New York City 2017 - The Lay of the Land of Client-Side Development circa...
SPS New York City 2017 - The Lay of the Land of Client-Side Development circa...
 
ECS Zagreb 2017 - Content Types - Love Them or Lose It
ECS Zagreb 2017 - Content Types - Love Them or Lose ItECS Zagreb 2017 - Content Types - Love Them or Lose It
ECS Zagreb 2017 - Content Types - Love Them or Lose It
 
SPS Monaco 2017 - The Lay of the Land of Client-Side Development circa 2017
SPS Monaco 2017 - The Lay of the Land of Client-Side Development circa 2017SPS Monaco 2017 - The Lay of the Land of Client-Side Development circa 2017
SPS Monaco 2017 - The Lay of the Land of Client-Side Development circa 2017
 
Lions Tigers Teams - SPTechCon Austin 2017
Lions Tigers Teams - SPTechCon Austin 2017Lions Tigers Teams - SPTechCon Austin 2017
Lions Tigers Teams - SPTechCon Austin 2017
 
SPTechCon Boston 2016 - Creating a Great User Experience in SharePoint
SPTechCon Boston 2016 - Creating a Great User Experience in SharePointSPTechCon Boston 2016 - Creating a Great User Experience in SharePoint
SPTechCon Boston 2016 - Creating a Great User Experience in SharePoint
 
SPTechCon Boston 2016 - Content Types - Love Them or Lose It
SPTechCon Boston 2016 - Content Types - Love Them or Lose ItSPTechCon Boston 2016 - Content Types - Love Them or Lose It
SPTechCon Boston 2016 - Content Types - Love Them or Lose It
 
SPC Adriatics 2016 - Creating a Great User Experience in SharePoint
SPC Adriatics 2016 - Creating a Great User Experience in SharePointSPC Adriatics 2016 - Creating a Great User Experience in SharePoint
SPC Adriatics 2016 - Creating a Great User Experience in SharePoint
 
SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office...
SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office...SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office...
SPC Adriatics 2016 - Alternative Approaches to Solution Development in Office...
 
SharePointFest Konferenz 2016 - Creating a Great User Experience in SharePoint
SharePointFest Konferenz 2016 - Creating a Great User Experience in SharePointSharePointFest Konferenz 2016 - Creating a Great User Experience in SharePoint
SharePointFest Konferenz 2016 - Creating a Great User Experience in SharePoint
 
SharePointFest Konferenz 2016 - Alternative Approaches to Solution Developmen...
SharePointFest Konferenz 2016 - Alternative Approaches to Solution Developmen...SharePointFest Konferenz 2016 - Alternative Approaches to Solution Developmen...
SharePointFest Konferenz 2016 - Alternative Approaches to Solution Developmen...
 
SPTechCon Austin 2016 - Content Types-Love Them or Lose It
SPTechCon Austin 2016 - Content Types-Love Them or Lose ItSPTechCon Austin 2016 - Content Types-Love Them or Lose It
SPTechCon Austin 2016 - Content Types-Love Them or Lose It
 
SPTechCon Austin 2016 - Creating a Great User Experience in SharePoint
SPTechCon Austin 2016 - Creating a Great User Experience in SharePointSPTechCon Austin 2016 - Creating a Great User Experience in SharePoint
SPTechCon Austin 2016 - Creating a Great User Experience in SharePoint
 
SharePoint Tech Fest Houston 2015 - Moving from SOAP to REST
SharePoint Tech Fest Houston 2015 - Moving from SOAP to RESTSharePoint Tech Fest Houston 2015 - Moving from SOAP to REST
SharePoint Tech Fest Houston 2015 - Moving from SOAP to REST
 
SharePoint Saturday CT 2015 - Content Types: Love Them or Lose It
SharePoint Saturday CT 2015 - Content Types: Love Them or Lose ItSharePoint Saturday CT 2015 - Content Types: Love Them or Lose It
SharePoint Saturday CT 2015 - Content Types: Love Them or Lose It
 

Dernier

Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
 

Dernier (20)

Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot ModelMcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Mcleodganj Call Girls 🥰 8617370543 Service Offer VIP Hot Model
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with Milvus
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
 
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
 
MS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectorsMS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectors
 
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
 
Six Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal OntologySix Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal Ontology
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
Understanding the FAA Part 107 License ..
Understanding the FAA Part 107 License ..Understanding the FAA Part 107 License ..
Understanding the FAA Part 107 License ..
 
Vector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptxVector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptx
 
[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf
 
Platformless Horizons for Digital Adaptability
Platformless Horizons for Digital AdaptabilityPlatformless Horizons for Digital Adaptability
Platformless Horizons for Digital Adaptability
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 

Top 10 jQuery Uses in SharePoint 2010

  • 1. Top 10 jQuery Uses in SharePoint 2010 Thank you for joining our webinar! We will begin shortly.
  • 2. Housekeeping • „30 on Thursday‟ Series – Bi-weekly 30 minute webinar series • Next Webinar: Thursday, February 21st – Building Charts with Power View - SharePoint 2013 and Excel 2013 • Full Schedule: www.susqtech.com/webinars
  • 3. Housekeeping • Today‟s Session is being recorded • Archive of Past Sessions – SusQtech.com/ArchivedWebinars • Questions - Use the window at right
  • 4. OnlineCourses Advanced InfoPath Forms in Using jQuery in SharePoint 2010 SharePoint 2010 Webinar Webinar February 20, 2013 | Online March 28, 2013 | Online Learn More or Register at SusQtech.com/OnlineTraining
  • 6. Today’sSession • Topic: – Top 10 jQuery Uses in SharePoint 2010 • Presenter: – Marc Anderson, SharePoint MVP • Moderator: – Steve Witt, SusQtech
  • 8. What Is jQuery? From the 30 on Thursday webinar description: “jQuery is a powerful JavaScript library that allows for easy implementation of dynamic user interface components for things like accordion navigation, tabs and image rotators that make website more engaging and usable.”
  • 9. What Is jQuery? From the jQuery.com site: “jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers. With a combination of versatility and extensibility, jQuery has changed the way that millions of people write JavaScript.”
  • 10. Adding jQuery/jQueryUI Referencing jQuery, jQueryUI, and SPServices from CDNs – Revisited http://sympmarc.com/2013/02/07/referencing-jquery-jqueryui-and- spservices-from-cdns-revisited/
  • 11. 10. Simple text changes $(".ms-socialNotif-text").text("Like This");
  • 12. 9. Add branding effects • Not just CSS-based • React to user behavior Fancy checkboxes and radio buttons http://www.sympraxisconsulting.com/Demos/Demo%20Pages/FancyC BandRB.aspx
  • 13. 8. Add new behavior to existing controls $("input[title='Title']").val("Enter the title...."); $("input[title='Title']").click(function() { $(this).val(""); });
  • 14. 7. Rearrange DOM elements $().SPServices.SPArrangeChoices http://spservices.codeplex.com/wikipage?title=$().SPServices.SPArrangeChoices
  • 15. 6. Add jQueryUI effects
  • 16. 5. Plugins, plugins, plugins • Image rotators • Slideshows • Charting • Graphing • Animation • Effects jQuery Plugin Registry: http://plugins.jquery.com/ MetroJS: http://www.drewgreenwell.com/
  • 17. 4. Improve form interactions • Cascading dropdowns • Display related info • Update multiple lists at the same time $().SPServices.SPCascadeDropdowns $().SPServices.SPDisplayRelatedInfo
  • 18. 3. Reduce the number of postbacks • Use .ajax() to write to underlying lists and libraries • Satisfy the Facebook generation
  • 19. 2. Improve the out of the box user interface Display All Related Tasks for a SharePoint Workflow Using jQuery, SPServices, and jQueryUI http://sympmarc.com/2011/06/07/display-all-related-tasks-for-a-sharepoint-workflow-using- jquery-spservices-and-jqueryui/
  • 21. Questions/Comments Marc Anderson marc.anderson@sympraxisconsulting.com @sympmarc Steve Witt SteveW@susqtech.com @splumberjack www.SusQtech.com/Webinars