1,804 articles and 15,136 comments as of Sunday, May 15th, 2011

EndUserSharePoint has combined resources with NothingButSharePoint.com. You can now find End User (Mark Miller), Developer (Jeremy Thake) and IT Pro SharePoint content all in one place!

This site is a historical archive and is no longer being updated. Please update your favorites, bookmarks and RSS feeds.

NothingButSharePoint.com
Monday, January 26, 2009

JQuery for Everyone: Whether They Want It Or Not

If you have one of my scripts you want to try out, or one of your own, but your cranky site administrator refuses to give you edit rights, never fear! JQuery + Firefox is here!

This evening, Iain Munro needed me to test my Calendar Preview Pane script on one of the Fabulous 40 templates. Problem: his site is private and I don’t want to install the entire template just to test this for him (no offense).

Solution: With Firefox, Firebug, and the jQuerify bookmartlet, I was able to test this for him and provide assurance it can work.

Setup:

  1. Get FireFox. Seriously, with the IE-tab add on, there’s no reason to suffer any more.
  2. Install Firebug
  3. Drag this jQuery bookmarklet to your Bookmarks Toolbar (this version updated for jQuery 1.3) »jQuerify«
  4. Open your test page.

I navigated to WSSDemo, a great site with live demos of OOB SharePoint sites. I located the template and clicked the link to view the live site.

Test:

  1. Copy the script to test to the clipboard.
  2. Open Firebug console and enable the console panel.
  3. After the page reloads, use the Bookmark to “jQuerify” the page.
  4. (Optional) Sometimes, like with this test, you need to add some HTML to the page as well. Click on the HTML tab above the left side of Firebug’s console. Select an area of the page where you want to place your new code and click the edit button in the top of Firebug’s menu.
  5. Paste the script to run in right side of Firebug’s console panel. If your script has a document.ready event to start things, take that out since we aren’t going to reload the page. That means for our test script, we turn…
  6. This…
    $(function() {
    	window.onerror = handleError; //needed for IE
    	initjLoadMe();
    });
  7. Into this…
    window.onerror = handleError; //needed for IE
    	initjLoadMe();
  8. Click run.

I suppose if you had a helpful script that only you needed, you could make your own jQuery bookmarklet that also calls your script. Who needs web parts?

It’s also fun to click the bookmarklet on your favorite sites, you might be surprised how many of them use jQuery.

Paul Grenier

View all entries in this series: PaulGrenier-JQuery for Everyone»
Entries in this series:
  1. JQuery for Everyone: Accordion Left Nav
  2. JQuery for Everyone: Print (Any) Web Part
  3. JQuery for Everyone: HTML Calculated Column
  4. JQuery for Everyone: Dressing-up Links Pt1
  5. JQuery for Everyone: Dressing-up Links Pt2
  6. JQuery for Everyone: Dressing-up Links Pt3
  7. JQuery for Everyone: Cleaning Windows Pt1
  8. JQuery for Everyone: Cleaning Windows Pt2
  9. JQuery for Everyone: Fixing the Gantt View
  10. JQuery for Everyone: Dynamically Sizing Excel Web Parts
  11. JQuery for Everyone: Manually Resizing Web Parts
  12. JQuery for Everyone: Total Calculated Columns
  13. JQuery for Everyone: Total of Time Differences
  14. JQuery for Everyone: Fixing Configured Web Part Height
  15. JQuery for Everyone: Expand/Collapse All Groups
  16. JQuery for Everyone: Preview Pane for Multiple Lists
  17. JQuery for Everyone: Preview Pane for Calendar View
  18. JQuery for Everyone: Degrading Dynamic Script Loader
  19. JQuery for Everyone: Force Checkout
  20. JQuery for Everyone: Replacing [Today]
  21. JQuery for Everyone: Whether They Want It Or Not
  22. JQuery for Everyone: Linking the Attachment Icon
  23. JQuery for Everyone: Aspect-Oriented Programming with jQuery
  24. JQuery for Everyone: AOP in Action - loadTip Gone Wild
  25. JQuery for Everyone: Wiki Outbound Links
  26. JQuery for Everyone: Collapse Text in List View
  27. JQuery for Everyone: AOP in Action - Clone List Header
  28. JQuery for Everyone: $.grep and calcHTML Revisited
  29. JQuery for Everyone: Evolution of the Preview
  30. JQuery for Everyone: Create a Client-Side Object Model
  31. JQuery for Everyone: Print (Any) Web Part(s) Plugin
  32. JQuery for Everyone: Minimal AOP and Elegant Modularity
  33. JQuery for Everyone: Cookies and Plugins
  34. JQuery for Everyone: Live Events vs. AOP
  35. JQuery for Everyone: Live Preview Pane
  36. JQuery for Everyone: Pre-populate Form Fields
  37. JQuery for Everyone: Get XML List Data with OWSSVR.DLL (RPC)
  38. Use Firebug in IE
  39. JQuery for Everyone: Extending OWS API for Calculated Columns
  40. JQuery for Everyone: Accordion Left-nav with Cookies Speed Test
  41. JQuery for Everyone: Email a List of People with OWS
  42. JQuery for Everyone: Faster than Document.Ready
  43. jQuery for Everyone: Collapse or Prepopulate Form Fields
  44. jQuery for Everyone: Hourly Summary Web Part
  45. jQuery for Everyone: "Read More..." On a Blog Site
  46. jQuery for Everyone: Slick Speed Test
  47. jQuery for Everyone: The SharePoint Game Changer
  48. JQuery For Everyone: Live LoadTip
 

Please Join the Discussion

One Response to “JQuery for Everyone: Whether They Want It Or Not”
  1. Chris Quick says:

    Paul,

    This is probably one of the most useful articles for me as a developer. I have taken the steps in this article and used it within SharePoint to demonstrate concepts to my team. I have also been able to use it with my corporate facing public website (a CMS designed in ColdFusion… shiver) to demonstrate where and how it could be used to enhance functionality.

    As a consultant, this is probably one of your most powerful tools! “Want to see what jQuery can do for your web-site? Okay, let me load up Firefox and show you!”

    Thanks! I’m now using this every day — yes, I’m now a jQuery junkie!


Notify me of comments to this article:


Speak and you will be heard.

We check comments hourly.
If you want a pic to show with your comment, go get a gravatar!