Skip to main content


Showing posts with the label JavaScript

Get Web Part Title and Add Link / Text / Image to the right side of the web part title

Here is the code to get web part title and then add image or text or link in web part title and right align that.

You have to put this code in Script editor web part or put this code in a file & store somewhere & provide link to master page or provide link to content editor web part

// Function to add link/text/icon in right side of the web part title

 $(document).ready(function () {

    var className='.ms-webpart-titleText';

    $(".ms-webpart-chrome-title span h2").each(function(inx){       
        var webPartTitle = $(this).text();

        //Check web part title
        if(webPartTitle.indexOf("My Web Part Title")>=0)
            var openUrl ="javascript:OpenPopUpPageWithTitle(\""+_spPageContextInfo.siteServerRelativeUrl+"/Style Library/MyFolder/MyPage.aspx?IsDlg=1\", RefreshPage, null, null, \"My Page Title\"); return false;";

            $(this).prepend("<div class='small' title='…

Download ebook Professional JavaScript for Web Developers, 3rd Edition

Download ebook Professional JavaScript for Web Developers, 3rd Edition

Book DescriptionIf you want to achieve JavaScript's full potential, it is critical to understand its nature, history, and limitations. To that end, this updated version of the bestseller by veteran author and JavaScript guru Nicholas C. Zakas covers JavaScript from its very beginning to the present-day incarnations including the DOM, Ajax, and HTML5. Zakas shows you how to extend this powerful language to meet specific needs and create dynamic user interfaces for the web that blur the line between desktop and internet. By the end of the book, you'll have a strong understanding of the significant advances in web development as they relate to JavaScript so that you can apply them to your next website.
Book DetailsPublisher:WroxBy:Nicholas C. ZakasISBN:978-1-1180-2669-4Year:Pages:960Language:EnglishFile size:53.1 MBFile format:PDF
Download ebook Professional JavaScript for Web Developers, 3rd Edition

How to calculate difference between two dates in javascript/jquery

Simple steps to calculate difference between two date fields using JavaScript/JQuery  In some scenario, we need to calculate the difference between two dates from the client side. Here we are going to demonstrate all about date fields using javascript such as Javascript date field validation for different format, difference between two dates in days, hours, minutes, seconds, years and weeks Very strong and simple Javascript validation for date fields for format dd/mm/yyyy  Following javascript function simply verify and return result for checking valid date from client side itself. It will automatically validate leap year entries and return correct result. That means if we pass ’29/02/2011′ to the function it will be return false. If we are passing ’29/02/2012′ to the function it will return true. So we don’t need to bother about the leap year or other complex things. function isValidDate(dateStr) { // Date validation Function // Checks For the following valid Date formats: // DD/MM/YYY…

Disable Right click of mouse

How to disable right click functionality from the web page In some of the web page has the requirement to protect source code from the users. Users can right click the page and take the source code. In order protect right click functionality on the web page we can implement javascript functionality to prevent user’s right click on the web page. So user not able to access features available on the right click menus. By implementing javascript method we can identify the right click event from the user by checking the button code and prevent if the user clicks right click. Below mentioned web page prevented to click right click by the user. When the user trying to right click it will return warning message to user and return the action. <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="DisableRightClick.aspx.cs" Inherits="ExperimentLab.DisableRightClick" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&…

Makes read only fields, required fields, hidden fields and Show or Hide fields on entry form for list or library.

Here is a good article written by Alexander Bautz and provided code to hide or show a field from New Form, Edit Form or Display Form. With use of provided code you can make fields read-only or hidden or required. EditSharePoint Field properties, including lookup column list association, withclient side code only
DownloadCode from Site

How to enable/disable buttons in ribbon conditionally?

In this article I will cover how we can enable and disable the controls from ribbon based on any specific column value. For an instance I have a list column "State", if selected row is having status "active" then and then button should be enable in Ribbon, otherwise ribbon button should remain disable.

For how to write Ribbon declaration please refer my previous articles.

In above image you can see we have one button "New" in ribbon within group "Console". Please refer the source code for Ribbon's declaration. We are going to use delegate control for injecting ECMA script on fly for desired list.
Below are the events causes ribbons to refresh so button can be turned enable/disable.
Checkbox from every rowSelectAll/DeselectAll checkbox from header rowOn every row selectOn each of above events after executing their respective functionality they instruct the ribbon to refresh. On received of refresh event ribbon calls Enable script for each of it…

Opening a SharePoint 2010 dialog box for list form

If you want to open a window in a dialog from clicking a link then simply use the following JavaScript as the href property.

javascript:varoptions = {url: '/Lists/MyList/NewForm.aspx?IsDlg=1&ContentTypeId=0x001989BCF16D8914CAF8862B0C6C89E091E', title: 'Showing List'}; void(SP.UI.ModalDialog.showModalDialog(options))
As you can see this is simply taking the script you would usually call and adapting it to work in the href of a hyperlink anchor. It needs to be all on one line and return void when called. So why might you want to do this? Many reasons. Perhaps you have a list with multiple content types and you wish to open the new item form in a dialog AND change the title from the default “[List Title] – New Item” depending on which content type the item is being created from. The snippet above illustrates this. Or perhaps you wish to open a document library in a dialog. Or even an external site.
Also you can use following script in your code :

public string GetDi…

How to get current logged user information using JavaScript ?

This is post which is simple and not really needed. But when I started writing the code in ECMAScript I have faced problems in getting the logged in user information. So, my readers may feel good after see this post and really most the users are looking for this too.
By this time, we have really understood all about ECMAScript Client Object Model and debugging. So, it's easy for us to know it well.
Please find the code below to get the current user information.

<asp:Content ContentPlaceHolderId="PlaceHolderAdditionalPageHead" runat="server">

Now copy & paste this JavaScript code after above mentioned tag :
<script type="text/ecmascript">

        ExecuteOrDelayUntilScriptLoaded(getUserData, "sp.js"); 

    // To Get Current User Name
    var context = null; 
    var web = null; 
    var currentUser = null; 
    var currentUserId=''
    function getUserData() {

            context = new SP.ClientContext.get_current(…

Set default value for People Picker via JavaScript

First open entry form (NewForm.aspx / EditForm.aspx / DispForm.aspx) in advanced mode in sharepoint designer. Then search for tag :

<asp:Content ContentPlaceHolderId="PlaceHolderAdditionalPageHead" runat="server">

Now copy & paste this JavaScript code after this tag :

<script type="text/ecmascript">
 //Function search for people picker by its no and set default value string type
 //If we have 2 people picker in entry form & we want to set value to 2nd no. then "pickerNo=2"
 function fillPeoplePickerWithCurrentUser(pickerNo,userLoginName )
      if(userLoginName != null)
         var pp = getPickerImputElement(pickerNo);

         if(pp != null)
           pp.innerHTML = userLoginName;

  function getPickerImputElement(pickerNo)
    var result = '';
    var divs = document.getElementsByTagName('DIV');
    var j = 0;

     for(var i=0; i < divs.length; i++)

Useful JavaScript global variables in SharePoint

If you’re using custom JavaScripts with SharePoint 2010 some global JavaScript variables may come in handy. These variables work if you’re using SharePoint’s default or any other custom master page. 
L_Menu_BaseUrl – the base URL of the site / subsite. Very useful when you need to determine the absolute path of the site in JavaScript. Example: document.location = L_Menu_BaseUrl + ‘lists/calendar/allitems.aspx’ //redirects to Calendar list 
L_Menu_LCID – the LCID of the site you’re in. Useful if you need to determine the language of the site. The list of Locale IDs can be found here.
_spUserId – the ID of the logged in user.