Javascript in SharePoint page using SharePoint Designer 2010

Question

Hi,

I am trying to learn more about customizing SharePoint pages like list form using JavaScript and SP Designer 2010. I came to know about PreSaveAction, _spBodyOnLoadFunctionNames.push("test") etc but I wanted to know the basics.

• Can anyone please provide some links to learn about SharePoint pages customization by using JavaScript?
• How is the function "PreSaveAction" binded to PreSave action?
• Do we have any other inbuilt functions like PreSaveAction that can be used?
• Should we always place the script inside "PlaceHolderAdditionalPageHead" placeholder? If not, Can we put it under any placeholder without any restrictions?
• Can we use "JS" file to hold all our script and call it from a SP page?
• When do we need to place the script in case of Master page?

Thanks

Answer 1

Hi Sam,

- links to learn about SharePoint - javascript:

http://www.youtube.com/watch?v=TtcBj3k03wY&feature=related

http://geekswithblogs.net/SoYouKnow/archive/2011/07/28/a-dummies-guide-to-sharepoint-and-jqueryndashgetting-started.aspx

- How is the function "PreSaveAction" binded to PreSave action?

PreSaveAction is a function that is build-in default into SharePoint. You can use it to overwrite it. Here is an example on how to use it:

http://www.balestra.be/2011/09/how-to-check-for-attachments-or-limit-the-number-of-attachments-in-sharepoint-via-jquery.html

- any other inbuilt function ?

Yes! an example: get the UI of the current logged in user:

http://www.balestra.be/2012/02/get-set-the-ui-language-code-via-jquery-javascript.html

- where to place the script ?

In my opinion, at the bottom of the page. That way all elements are loaded first and then the script fires. You can put the < script > tag anywhere you like as long as it is shown in the page (in a placeholder). A lot of people add a ContentEditor Webpart on the page to put the script in.

- call .js file

Yes, when you use a Content Editor, you can link it to a separate .js file that you store somewhere else.

---

http://www.balestra.be || @marijnsomers

Answer 2

Thanks Marijn for the detailed answer. I will go through the links.