Set a PeoplePicker Field without a GUID !

A new function that lot's of people may help if they want to set a value of a People Picker field. 
There are examples to find on the internet how you may do it by using the GUID of the field. This because the People Picker field is made of different html parts. You can't set a value in the field directly by calling his Title property like most of the other SharePoint Fields.
But next function by calling the label of the field (the text you have giving on the screen), and a value (Full name of a person or the userid of a person)

Enjoy the new function !! 

Remark, the function only works for setting one value to the people picker field. 
test
// call the new function Set PeoplePicker.

//

SetPeoplePicker (title, userid);

function SetPeoplePicker(My_Title, userid)

{

        try{

                 var ppID = $($('nobr:contains("' + My_Title + '")').closest("td").next("td").find('div')[0]).attr('id');

                 var ppID_userfield = ppID.substring(0,ppID.indexOf("_upLevelDiv"));

                 var a_ppID = ppID_userfield.split('_');

                 var a_ppID_Length = a_ppID.length;

                 var ppID_userfield2 = a_ppID[0] + '$' +  a_ppID[1] + '$' +  a_ppID[2] ;

                 for ( i = 3; i < a_ppID_Length - 4; i++)

                 {

                       ppID_userfield2 = ppID_userfield2 + '_' + a_ppID[i];

                 }

                 ppID_userfield2 = ppID_userfield2 + '$' +   a_ppID[a_ppID_Length - 4] + '$' +   a_ppID[a_ppID_Length - 3] + '$' +   a_ppID[a_ppID_Length - 2] + '$' +   a_ppID[a_ppID_Length - 1] ;

        

                $('#' + ppID ).text(userid);

                //recognize the people picker driver name

                if(!ValidatePickerControl(ppID_userfield )){

                        ShowValidationError();

                        return false;

                }

                var arg=getUplevel(ppID_userfield );

                var ctx = ppID_userfield ;

                EntityEditorSetWaitCursor(ctx);

                WebForm_DoCallback(ppID_userfield2 ,arg,EntityEditorHandleCheckNameResult,ctx,EntityEditorHandleCheckNameError,true);

        }catch(err){

                $('#' + ppID).text("");

        }

}

Create a Sharepoint Group and add a PermissionLevel to that new Sharepoint Group

In a previous blogpost you saw how to break the inheritance of a site. Well by completing the request
of my customer, I wrote some code for also creating a own Sharepoint Group and give it 
a specific permission level. 

Enjoy my next custom code for creating a group and adding a permission level to it. 

  

      
 

 

function addGroup( )
{
   var groupsname = "FILL IN HERE THE NAME OF YOUR SHAREPOINT GROUP";
   var groupsOwner = "DOMAIN/USERID";
   var groupsDesc = "FILL IN HERE THE DESCRIPTION FOR YOUR SHAREPOINT GROUP"; 
   var soapEnv ="";
   soapEnv =            '';
   soapEnv = soapEnv  + '';
   soapEnv = soapEnv  + '';
   soapEnv = soapEnv  + '';
   soapEnv = soapEnv  + ''+ groupsname + '';
   soapEnv = soapEnv  + '' + groupsOwner + '';
   soapEnv = soapEnv  + 'user';
   soapEnv = soapEnv  + '' + groupsOwner + '';
   soapEnv = soapEnv  + '' + groupsDesc + '';
   soapEnv = soapEnv  + '  ';
   soapEnv = soapEnv  + '';
 
  $.ajax({
        url: "URL OF YOUR SITE BY STARTING HTTP /_vti_bin/UserGroup.asmx",
        type: "POST",
 async : false,
        dataType: "xml",
        beforeSend: function(xhr) {
           xhr.setRequestHeader("SOAPAction",
               "http://schemas.microsoft.com/sharepoint/soap/directory/AddGroup");
           },
        data: soapEnv,
        error: processMyError,
        complete: processResultAddGroep,
        contentType: "text/xml; charset=\"utf-8\""
  }); 

}


function processMyError(xhr, error)
{
  alert(xhr);
  alert("dd "+error);
}


function processResultAddGroep (xData, status)
{ 
// adding the Permissionlevel to your group. If you don't do this, the Sharepoint Group will be created, 
// but will not be visible in the list of Groups. 
  callAddRole();
}


function callAddRole ()
{
  var soapEnv ="";
  var groupsName = "FILL IN HERE THE NAME OF YOUR SHAREPOINT GROUP";
  var roleName = "FILL IN HERE THE NAME OF THE PERMISSION LEVEL, EX Contribute";

  soapEnv =            '';
  soapEnv = soapEnv  + '';
  soapEnv = soapEnv  + '';
  soapEnv = soapEnv  + '';
  soapEnv = soapEnv  + '' + groupsName  + '';
  soapEnv = soapEnv  + '' + roleName +  '';
  soapEnv = soapEnv  + '  ';
  soapEnv = soapEnv  + '';
  $.ajax({
         url: "FILL IN HERE THE URL OF YOUR SITE /_vti_bin/UserGroup.asmx",
         type: "POST",
         async: false, 
         dataType: "xml",
         beforeSend: function(xhr) {
                          xhr.setRequestHeader("SOAPAction",
                          "http://schemas.microsoft.com/sharepoint/soap/directory/AddGroupToRole");
                     },
         data: soapEnv,
         error: processMyError,
         complete: processResultAddRole,
         contentType: "text/xml; charset=\"utf-8\""
  });

}

function processResultAddRole(xData, status)
{ 
  alert("status: " + status);
  $('#error').val(status);
  alert("response: "+ xData.responseText);
  $('#errormessage').val(xData.responseText);

} 

Trigger click event in your aspx page

How to trigger easely an event on your Sharepoint ASPX page by using JQuery. 
Well, it doesn't need very mutch to trigger automatically by example the save event
by using your scripting language.For example if somebody fills all required fields in 
and you detected that is was filled in correctly... you can trigger the save event without asking
the user to click on the save button. And this saves time for your customer. 

A simple line of code that you can put in your javascript 
Don't forget that you have to import your JQuery library ! 
  

      $("input[value='Save']").trigger("click");
 

Set Focus on a sharepoint Field in scripting

To setting the focus of an input field in jquery, it was simple. But when you have a peoplepicker field

you think that you also are dealing with an input field, but less is true.
A sharepoint People Picker field isn't that easy made.
But we won't be a developer, if we could make a function that put's the focus also 
on a people picker field.
Below you find my function. It can be extended with other fields if necessary. 
You call it not by using the GUID, but by using the display name. Which is more flexible and easier, 
because you don't need to search for the GUID in the source code. 
 
You can call it by the next function. You only need the Field Display Name and the Type of field. 
The type can be at this moment, an Input field, a People Picker, or a  Select field. 

This you can use by example when you want to check values in the PreSaveAction function and 
you want to put the focus on a field that has to be changed.  

Have fun with it... and if you need an extention, don't hesitate to ask... 

function FirstfocusExtended(veldnaam, type)

{

                switch (type.toLowerCase())

                {

                               case "input" :

                                               $(":input[title='" + veldnaam + "']").focus();

                                               break;

                               case "peoplepicker" :

                                               $("nobr:contains('" + veldnaam + "')").closest("td").next("td").find("div").focus();

                                               break;

                               case "select" :

                                               $(":select[title='" + veldnaam + "']").focus();

                                               break;

                               default :

                                               break;

                }

}

Set a check or more checkboxes of a choice field selected.

A nice new function is created today for my colleague. 

If you want to check a checkbox of a checkbox field or a multi choice field, 

you can use the next function. 

You can call it by not knowing the GUID of the checkbox you want to select. But you can call it with 

the Display Name (Title) of your field. 
If it only one checkbox, you call it like this :
SetChoiceFieldValue ("YOUR TITLE", 1, true);

If you have a choice field with more options, you can select specific entries 

by setting the index to the checkbox you want to select. 

You can use the same function also to uncheck the field. You only have to set the last param to false. 

It's a nice jquery function that makes your scripting more flexible. 

 
function SetChoiceFieldValue(titel, index, b_checked)
{
        var TD = $('nobr:contains("'+ titel + '")').closest("td").next("td").find('input');
        if (index <= TD.length + 1)
        {
                TD[index-1].checked = b_checked;
        }
}

Filter inputfields on a Sharepoint Field for instantly filtering

Had a customer today that wanted a online filtering on a table. 
Found out next part of code in a previous project in Sharepoint 2007 of an old colleague. 
And like it or not, but it also works in Sharepoint 2010.
It is a simple script that adds input fields below each column of your Sharepoint View. 
When entering a text in a column filter field, it hides all rows of your View that not 
corresponds with the value that you have added. 

Have fun with it ! 

$(document).ready(function()
{
 jQuery.extend(jQuery.expr[':'], {
 containsIgnoreCase: function(a,i,m) {return (a.textContent||a.innerText||jQuery(a).text()||'').toLowerCase().indexOf((m[3]||'').toLowerCase())>=0}
});

$("table tr.ms-viewheadertr").each(function()
{
    if($("td.ms-vh-group", this).size() > 0)
    {
        return;
    }
    var tdset = "";
    var colIndex = 0;
    $(this).children("th,td").each(function()
    {
        if($(this).hasClass("ms-vh-icon"))
        {
            // attachment
            tdset += "";
        }
        else
        {
            // filterable
            tdset += ">input class="vossers-filterfield" filtercolindex="" + colIndex + "" type="text" />>br />
";                                                          
        }
        colIndex++;
    });
    var tr = "" + tdset + "";
    $(tr).insertAfter(this);
});          

$("input.vossers-filterfield")
    .css("border", "1px solid #7f9db9")
    .css("width", "100%")
    .css("margin", "2px")
    .css("padding", "2px")
    .keyup(function()
 {                                            
  var inputClosure = this;
  if(window.VossersFilterTimeoutHandle)
  {
   clearTimeout(window.VossersFilterTimeoutHandle);
  }
  window.VossersFilterTimeoutHandle = setTimeout(function()
  {
   var filterValues = new Array();
   $("input.vossers-filterfield", $(inputClosure).parents("tr:first")).each(function()
   {                                                            
    if($(this).val() != "")                                                     
    {
     filterValues[$(this).attr("filtercolindex")] = $(this).val();
    }
   });                          
   $(inputClosure).parents("tr.vossers-filterrow").nextAll("tr").each(function()
   {
    var mismatch = false;
    $(this).children("td").each(function(colIndex)
    {
     if(mismatch) return;
     if(filterValues[colIndex])
     {
      var val = filterValues[colIndex];
      // replace double quote character with 2 instances of itself
      val = val.replace(/"/g, String.fromCharCode(34) + String.fromCharCode(34));                                                                                                      
      if($(this).is(":not(:containsIgnoreCase('" + val + "'))"))
      {
       mismatch = true;
      }                                                                                           
     }
    });
    if(mismatch)
    {
     $(this).hide();
    }
    else
    {
     $(this).show();
    }                             
   });                                                         
  }, 250);
    });
});

 

Check if a Multi Selectable Sharepoint Choice Field value is Checked.

I'm starting to write my own sharepoint helperclass with functions 
that can be called without knowing the ID's of the Sharepoint Fields, 
but by using the field Display Names. 

This function is to know if a certain value of a multi selectable 
choice field is checked or not.

// call the function
// CheckChoiceFieldValue ("DISPLAYNAME", 1) check of first value is checked
// CheckChoiceFieldValue ("DISPLAYNAME", 2) check of second value is checked
  
function CheckChoiceFieldValue(titel, index)
{
 var TD = $('nobr:contains("'+ titel + '")').closest("td").next("td").find('input');
    var bTD = false;
    if (index <= TD.length + 1)
    {
  return TD[index-1].checked;
 }
    return false;
}
 

Disable a Hyperlink field without knowing the ID of your Sharepoint Field

I'm starting to write my own sharepoint helperclass with functions 
that can be called without knowing the ID's of the Sharepoint Fields, 
but by using the field Display Names. 

This function is to Disable or Enable a Sharepoint Hyperlink Field.

// call the function
// DisableHttpLink ("DISPLAYNAME", True) to disable the field
// DisableHttpLink ("DISPLAYNAME", False) to enable the field
  
function DisableHttpLink(titel, b_disable)
{
 var TD = $('nobr:contains("'+ titel + '")').closest("td").next("td").find('input');
    for(var i = 0; i < TD.length;i++)
    {
  $("#" + TD[i].id).attr("disabled",b_disable);
    }
}
 

Disable a Choice field without knowing the ID of your Sharepoint Field

I'm starting to write my own sharepoint helperclass with functions 
that can be called without knowing the ID's of the Sharepoint Fields, 
but by using the field Display Names. 

This function is to Disable or Enable a Sharepoint Choice Field.

// call the function
// DisableAChoiceField ("DISPLAYNAME", "input|select", True) to disable the field
// DisableAChoiceField ("DISPLAYNAME", "input|select", False) to enable the field
  
function DisableAChoiceField(titel, type, b_disable)
{
    if (type == "input")
  var TD = $('nobr:contains("'+ titel + '")').closest("td").next("td").find('input');
    if (type == "select")
  var TD = $('nobr:contains("'+ titel + '")').closest("td").next("td").find('select');
    for(var i = 0; i < TD.length;i++)
    {
  $("#" + TD[i].id).attr("disabled",b_disable);
    }
}
 

Disable a PeoplePicker Field without knowing the ID of your Sharepoint Field

I'm starting to write my own sharepoint helperclass with functions 
that can be called without knowing the ID's of the Sharepoint Fields, 
but by using the field Display Names. 

This function is to Disable or Enable a Sharepoint PeoplePicker Field.

// call the function
// DisablePeoplePicker ("DISPLAYNAME", True) to disable the field
// DisablePeoplePicker ("DISPLAYNAME", False) to enable the field
  
function DisablePeoplePicker( titel, b_disable)
{
    $('nobr:contains("'+titel+'")').closest("td").next("td").find("div").attr("contentEditable",false);
    if (b_disable)
    {
        $('nobr:contains("'+titel+'")').closest("td").next("td").find("div").css("backgroundColor","silver");
        $('nobr:contains("'+titel+'")').closest("td").next("td").find("img").hide();
    }
    else
    {
        $('nobr:contains("'+titel+'")').closest("td").next("td").find("div").css("backgroundColor","white");
        $('nobr:contains("'+titel+'")').closest("td").next("td").find("img").show();
    }
}
 

Disable a Date field without knowing the ID of your Sharepoint Field

I'm starting to write my own sharepoint helperclass with functions 
that can be called without knowing the ID's of the Sharepoint Fields, 
but by using the field Display Names. 

My first function isn't complete yet.
Disable or Enable a Date Field.
It will be completed very soon with the type "DateTime". 

// call the function
// DisableDateField ("DISPLAYNAME", "Date", True) to disable the field
// DisableDateField ("DISPLAYNAME", "Date", False) to enable the field
  
function DisableDateField (titel, type, b_disable)
{
    if (type == "Date")
 {
        $(':input[title="'+titel+'"]').attr("disabled",b_disable);
        if (b_disable)
            $(':input[title="'+titel+'"]').closest("td").next("td").hide();       
        else
   $(':input[title="'+titel+'"]').closest("td").next("td").show();
 }
}
 

Replace Point keystroke with a Comma

Sometimes you need to prevent your user to use some key characters in your Input Fields.
Like my customer wanted also to use the Comma [,] as the Point [.] as decimal seperator. 
If you use for example Dutch regional settings the decimal seperator is the [,] and the Point is used
as thousant seperator. So my customer wanted to use as Point as Comma as seperator. 
What to do about it? 
Simple answer. Catch the keystroke of the Point and replace it by a Comma. 
My solution below is not perfect if they put a Point between the numbers. 
If someone knows what I have to add in place of the fill up of the ","
please don't hesitate to let me know.
 

$(document).ready(function() {
 if ($(":input[title='MyField']").val() != "")
  $("nobr:contains('MyField')").closest('tr').hide();
 ReplacePointbyComma();
});

function ReplacePointbyComma(){
    $(":input[title='MyNumericField']").keydown(function(e) {
  var keycode = (e.keyCode ? e.keyCode : e.which);
  /// 110 Point on numeric keyblock
  /// 190 Shift Point in alfanumeric keyblock
  if (keycode == 110 || keycode == 190 )
  {
   e.preventDefault();
   $(":input[title='MyNumericField']").val($(":input[title='MyNumericField']").val() + ",");
  }
 });
}
 

Horizontal alignment of Choise Fields

This week I found a way to change the alignment of a Choice Field.
Nice to know if you have list of questions where somebody has to choose
between for example three answers. 

You only have to make a custom New/Edit page in Sharepoint Designer
and add the next line
<xsl:comment>FieldName="Display Name"</xsl:comment>                                                          
just before the sharepoint Formfield definition <SharePoint:FormField …

Change the "Display Name" by the display name of your Sharepoint Field.

Add a Content Editor webpart to your page and 
put the next Jquery script in this webpart.

<script>
$( document ).ready( function() {
// columnName = Field Display Name
// perRow = how many choices you want to see in one row.
            $().SPServices.SPArrangeChoices({
                        columnName : "Display Name",
                        perRow: 3
                        });
});
</script>
 

Check if Sharepoint Richt Text Editor Field is empty or not (works in IE, Firefox and Chrome)

Found out this week that the code for checking the content of a multi-line rich text field was 
not working for other than IE-browsers.
So after some debugging in Chrome I found a solution that works in Chrome and in Firefox.
I hope that it's also working in other browsers... but I don't have them to my position at work.
Have fun with my new code... 

 firefox/chrome bugfix...
    var scomments = "";
    if ($.browser.msie) 
 {     
  // IE browser, check on language needed because Sharepoint and IE Translates the IFrame name in different languages.   
  if (_spPageContextInfo.currentLanguage == 1036) 
  {
            var systemDescriptionRTE = $("textarea[title='Comments']").closest("span").find("iframe[Title='Éditeur de texte enrichi']").contents().find("body");
            scomments = $(systemDescriptionRTE).text();
        }
        else
        {
            if (_spPageContextInfo.currentLanguage == 1043) 
   {
                var systemDescriptionRTE = $("textarea[title='Comments']").closest("span").find("iframe[Title='RTF-editor']").contents().find("body");
                scomments = $(systemDescriptionRTE).text();
            }
            else
            {
                var systemDescriptionRTE = $("textarea[title='Comments']").closest("span").find("iframe[Title='Rich Text Editor']").contents().find("body");
                scomments = $(systemDescriptionRTE).text();
            }
        }
 }
 else
 {
 // if other browser
        var systemDescriptionRTETextArea = $("textarea[Title='Comments']"); 
        scomments = $(systemDescriptionRTETextArea).val(); 
 }
  

Now you can check with the 'scomments' variable is it is empty or containing some values.

Hide a webpart or Columns of a ListView webpart.

Found some interesting JQuery for hiding a SharePoint Webpart, 
or some columns of a ListviewWebpart.
This can be usefull if you have some columns that are language depentend. 
So of that moment you can hide for example a column with dutch text 
or an other column with other information. 
Or if you want that someone has less columns than another user 
in the same view and you don't want to duplicate the views. 

My example below will hide a complete webpart and the first three columns 
of a ListView webpart.
Attention, if you have more than one listView webpart on your page, 
all the same columns will be hidden.

If you know how I can determ to hide the columns of a specific webpart... 
I'm interested in the code.

$( document ).ready( function() {
 // hide new webpart
 $(MSOZoneCell_WebPartWPQ5).hide();
 // hide column 1, 2 and 3           
    $(".ms-listviewtable,.ms-emptyView").find("td:nth-child(1),th:nth-child(1)").hide();     
    $(".ms-listviewtable,.ms-emptyView").find("td:nth-child(2),th:nth-child(2)").hide();     
 $(".ms-listviewtable,.ms-emptyView").find("td:nth-child(3),th:nth-child(3)").hide();      
});


 

Value of approvalStatus changes in function of MUI Language

Believe it or not, but I was supprised that technical fields from Sharepoint are translated when
you change your MUI Language.

I discovered it by accident when a user called me, that my draft image was always visible
even when the document was approved. 
So after some debugging I saw that the approvalStatus field of sharepoint was translated in the
language of the MUI. 

In our configuration, we have English, Dutch and French. So the approvalStatus field is getting
in English the value "approved", in Dutch : "goedgekeurd" and in French : "approuvé" !

If you do equal stuff, I have coded next script in a Content Editor Webpart for my users : 
 

 //show draft image if topic is not approved
            if (document.getElementById('approvalStatus').innerHTML.toLowerCase() == 'approved' 
      || document.getElementById('approvalStatus').innerHTML.toLowerCase() == 'approuvé' 
      || document.getElementById('approvalStatus').innerHTML.toLowerCase() == 'goedgekeurd')
            {
                document.body.background = '';
            }
            else
   {
    document.body.style.backgroundPosition="center";
    document.body.style.backgroundImage="url(../../SiteCollectionImages/watermark-draft.png)";
    document.body.style.backgroundRepeat="no-repeat";
            }

 

Get User Roles, Security groups on Client site

Last week I figgered out how to know in which security group the logged-on user has access to 
in order to show or hide some fields or ribbon items. 
For example to prevent to show All Site Contents in the action menu.

Below some code that does the work for you... have fun with it ;)
 

<script src="/scripts/jquery-1.7.min.js" type="text/javascript"></script>
<script src="/scripts/jquery.SPServices-0.7.0.js" type="text/javascript"></script>
<script type="text/javascript">

 getCurrentUserRole();
 function getCurrentUserRole() {
  $().SPServices({
   operation: "GetGroupCollectionFromUser",
   userLoginName: $().SPServices.SPGetCurrentUser(),
   async: false,
   completefunc: function (xData, Status) {

    if( Status == "success") {
     //alert(xData.responseText);
     $(xData.responseXML).find("Group").each(function () {
      if ($(this).attr("Name") == "DevSite Owners")
      {
       alert("write access");
      }
      else
      {
       // wrong access hide some stuff... for example the Site Action link.
       $("#siteactiontd").hide();
       // hide the global navigation folder
       $("#GlobalBreadCrumbNavPopout-anchor").hide();
      }//alert($(this).attr("Name"));
     });
    }
   }
  });
 }
</script>
 

Check if Sharepoint Richt Text Editor Field is empty or not

Today I had some problems to do a check wether a Rich Text Editor field is filled in or not. 
I found out that sharepoint also translates the Title of the Rich Text Editor field. 
That was really unexpected because the iframe is dynamically constructed in the browser. 
So you would expect that changing the MUI language would translate the 
Title propertie of the RTE field.
So for Frensh, Dutch and English MUI languages you could do the check like below.

var scomments = "";
if (_spPageContextInfo.currentLanguage == 1036) {
    var systemDescriptionRTE = $("textarea[Title='Comments']").closest("span").find("iframe[Title='Éditeur de texte enrichi']").contents().find("body");
    scomments = $(systemDescriptionRTE).text();
}
else
{
 if (_spPageContextInfo.currentLanguage == 1043) {
        var systemDescriptionRTE = $("textarea[Title='Comments']").closest("span").find("iframe[Title='RTF-editor']").contents().find("body");
        scomments = $(systemDescriptionRTE).text();
    }
    else
    {
        var systemDescriptionRTE = $("textarea[Title='Comments']").closest("span").find("iframe[Title='Rich Text Editor']").contents().find("body");
        scomments = $(systemDescriptionRTE).text();
    }
}

 
 

Bugfix available at this new blogpost :
 http://andydevelopments.blogspot.com/2012/10/check-if-sharepoint-richt-text-editor.html 

Block Excape and Ctrl+z keypress to prevent the undo action by keyboard

One of the disadvantages of using Jscript of JQuery is when a user uses 
the Escape or CTRL+z on his keyboard that 
your actions, like filling in input fields, in your scripting are being undone.

So best option in this case is to prevent that thoose events are being executed.
This you can do by capturing the keypresses of the Escape key and the CTRL+z key combination.
The script below will execute on the document Keydown event. 

 function DisableEscAndCtrlZ(){
  document.onkeydown = function(evt) {
   evt = evt || window.event;
   // ctrl+z
   if (evt.ctrlKey && evt.keyCode == 90) {
    return false;  
   }
   // esc
   if (evt.keyCode == 27) {
    return false;  
   }
  };
 }

 $(document).ready( function() {
  DisableEscAndCtrlZ();
 };