JavaScript page load function array and pre save function in SharePoint 2010

JavaScript page load function

I have been using this function array forever, but still whenever I need it, I have to look it up on internet, so decided to post it here.

In case you are new to SharePoint,  because mostly SharePoint pages don’t contain body element because it comes from master page, so this is the way to run your page body load event code in SharePoint. Add your function name to “_spBodyOnLoadFunctionNames” function array, and your function will be called when page body is loaded.

_spBodyOnLoadFunctionNames.push("pageOnLoad"); 

function pageOnLoad()
{
// Your code here
}

 

Pre Save Custom Script

Another important function which I managed to forget when I was recently customizing a list item page, is PreSaveItem function. It is for writing custom client side script when “Save” button is pressed on New or Edit Item page in SharePoint.

function PreSaveItem()
{
return true // or return false;
}

Return true of you want the saving process to continue or return false otherwise.

Get Element by Tag and  Title

One more very useful function is the one which gets an element by its tag name and title, here it is

function getElementFromTitle(tagName, title)
{   
     var tags = document.getElementsByTagName(tagName);   
     for (var i=0; i < tags.length; i++)   
     {      
         if (tags[i].title == title)      
         {           
             return tags[i];      
         }   
     }
     return null;
}

But if you are using JQuery, the following line replaces the above function

var subjectValue = $("input[title='ElementTitle']").val();

(“input” is the type of control)

Using JQuery you can go to any length to find something in the page markup, like the one below returns text from rich text field in SharePoint

var descriptionValue = $("textarea[Title='ElementTitle']").closest("span")
  .find("iframe[Title='Rich Text Editor']").contents().find("body").html();

 

SP Services by Marc D Anderson

Here’s some cool stuff by Marc D Anderson

http://spservices.codeplex.com/documentation

This is a library which is based on JQuery, it makes making cascading drop downs amazingly easy.

After you have referenced JQuery and SPService in your page, it’s just the following code which configures a cascading drop down

<script type="text/javascript">
    $(document).ready(function() {
        $().SPServices.SPCascadeDropdowns({
            relationshipList: "Regions",
            relationshipListParentColumn: "Country",
            relationshipListChildColumn: "Title",
            parentColumn: "Country",
            childColumn: "Region"
        });
    });
</script>

Thanks Marc, for this amazing stuff.
Advertisements
  1. #1 by Nerudo Curtis Mregi on November 3, 2011 - 12:52 pm

    The presave() function is awesome. Thanks

  1. SharePoint 2010: Recopilatorio de enlaces interesantes (XXX)! - Blog del CIIN
  2. Javascript pre save function on publishing page in Sharepoint 2013 | Roberto Cinà

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: