How do I write a web part that pops up “Hello world” using jQuery?

Question

I want to use jQuery in my SP2010 hello world web part which pops up "Hello world" using jQuery. What do I have to do? I know I can do this with JavaScript, but I want to learn about jQuery in web part development.

Answer 1

SharePoint Site doesn't support JQuery from scratch. You have to add it manually. It can be done in several ways:

Step 1. Adding JQuery :

1) Deploy JQuery as a custom feature.

Or

2) Upload JQuery as a simple file to the document library.

Step 2. Adding reference to the JQuery :

1.1) Create custom master page with reference to the JQuery.

1.2) Create web site based on the custom master page.

Or

2) Add Content Editor web part to the page. In the web part's properties specify the link to the file.

However to show Dialogue in SP 2010 you should use SP.js. Just add the reference to SP.js in the page and call SP.UI.ModalDialog.showModalDialog() function in JavaScript.

Answer 2

I am not sure what you're going to learn by doing this over and above just using jQuery on a non-SharePoint html page but...

• Go to a web part page or wiki page you've setup.
• Select Site Actions > Edit Page Click "Add a web part"
• Select Media and Content > Content Editor
• Select “Click here to add new content” On the ribbon select Html > Edit HTML Source

Then paste the javascript/jquery you want to put on the page.

To get inspiration on what you can do with javascipt and SharePoint start with Christophe's blog + see also JQuery Tutorials site