Simple Changes with Javascript and CSS in Sharepoint
To Change the width of the column in List View
<style type='text/css'>
.ms-vh-div[DisplayName='<ColumnName>']
{
width:250px;
}
</style>
(or)
$("div.ms-vh-div[DisplayName='BigColumn']").attr("style", "WIDTH: 550px");
To Get Query String Parameter Values
{
var urlSplit = window.location.href.split("?");
queryString =urlSplit[1];
employee = GetParameterValues("Employee");
employee = decodeURI(employee);
document.getElementById("shwDisp").textContent="Name: "+employee;
}
function GetParameterValues(param)
{
var urlparams = queryString.split('&');
var completeQuery = decrypt(urlparams[0])+"&"+urlparams[1];
urlparams = completeQuery.split('&');
for (var i = 0; i < urlparams.length; i++)
{
var urlparam = urlparams[i].split('=');
if (urlparam[0] == param)
{
return urlparam[1];
}
}
}
To Remove WhiteSpacing between WebParts
.ms-webpartPage-root {
border-spacing: 0px !important;
}
.ms-webpartzone-cell {
margin: 0px !important;
}
To Hide Left Nav Edit Link
.ms-displayInlineBlock
{
display: none;
}
Set value to a field
$("input[title='ApproveRejectFlag']").val("1");
var numero=$("input[title='numero']").val();
titulo=$("select[title='GSPTitulo']").val();
var titulodisp=$('#disptitulo').text();
$("#IDappr textarea").val(apprcomment);
Assign people picker field to a variable
var GSPAChainman=$('#tdGSPAChainman').find("div[title='People Picker']").text();
Hide
$('#tdhide').css('visibility','collapse');
Substring
var tituloedit=$('#tituloedit').text();
var tituloedit1=tituloedit.substring(0,3);
Validation
if($("input[title='Cantidad de Start UP']").val().trim().length== '0')
if($('#tdGSPNIS').find("div[title='People Picker']").text()=="")
if($("#tdAprobacion div[role='textbox']").text().trim().length=="1")
Focus
$('#tdGSPNIS').find("div[title='People Picker']").focus();
Get people picker value
var resid = $('#resid div[title="People Picker"]').text();
Override close button
function overrideDefaultCloseButton()
{
var cancel="oncancelclick()";//get the sharepoint cancel function and add condition to it
$("input[accessKey='C']").attr("onclick",cancel);
}
function oncancelclick()
{
document.location.href= L_Menu_BaseUrl;
}
To hide and show
$('#tdRechazo').css('display','none');
if($("#tdGSPP").text()=="SI")
{
$(".seccion1").show();
}
else
{
$(".seccion1").hide();
}
To get current item ID
JSRequest.EnsureSetup();
id = JSRequest.QueryString["ID"];
Redirect
document.location.href=L_Menu_BaseUrl+"/Lists/GSP/GSP_Edit.aspx?ID="+id+"&Source="+L_Menu_BaseUrl;});
Clicking on a function
$("#aprobar").click(function()
{
});
To hide the column
$("#tdHidenumero").css('visibility','collapse');
Change the save button name
var savebutton=$("input[accesskey='O']").attr("value");
$("input[accesskey='O']").attr("value","Aprobar");
$("input[accesskey='O']").css("display","none");
Make field readonly using span
<span id="date"></span>
var datefield = $("input[title='Fecha']").val();
$("#date").text(datefield);
Set current user name to a field
thisUserAccount=$().SPServices.SPGetCurrentUser({fieldName: "Title",debug: false});
$("#author").text(thisUserAccount);
$('#tdGSPResponsable').find("div[title='People Picker']").text(thisUserAccount);
Hide field based on radio button
$("#tdGSPPHA1 span[title='SI']").children().eq(0).change(function()
{
$("#tdPHA1").show();
});
//code for 'tdGSPPHA1 ' Radio Button
$("#tdGSPPHA1 span[title='NO']").children().eq(0).change(function()
{
$("#tdPHA1").hide();
});
Try catch
try
{
}
catch(ex)
{
WriteExceptionLog(ex, "pageload")
}
To get the user group for the site to set defaqult value of coordinator GSP
function retrieveAllUsersInGroup() {
var clientContext = new SP.ClientContext.get_current();
var collGroup = clientContext.get_web().get_siteGroups();
var oGroup = collGroup.getById(25);
this.collUser = oGroup.get_users();
clientContext.load(collUser);
clientContext.executeQueryAsync(Function.createDelegate(this, function(){onQuerySucceeded();}), Function.createDelegate(this, this.onQueryFailed));
}
function onQuerySucceeded() {
var userEnumerator = collUser.getEnumerator();
while (userEnumerator.moveNext()) {
oUser = userEnumerator.get_current();
//userInfo = '\nUser: ' + oUser.get_title() +
'\nID: ' + oUser.get_id() +
'\nEmail: ' + oUser.get_email() +
'\nLogin Name: ' + oUser.get_loginName();
userInfo = oUser.get_title();
// alert(userInfo);
// getname = userInfo;
cordinator(userInfo);
return true;
}
}
function onQueryFailed(sender, args) {
alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
}
To copy one people picker to another people picker:
function evaluat()
{
if($('#ISEvaluador2ID').find("div[role='textbox']").text().trim().length==0)
{
var eval2=$('#ISEvaluador1ID').find("div[role='textbox']").text();
$('#ISEvaluador2ID').find("div[role='textbox']").text(eval2);
}
}
Hide & Show by Dropdown Selection
$(document).ready(function()
{
$("#vptoem").css("display","none");
$("#vmp").css("display","none");
$("#vpt_refinish").css("display","none");
$("#vpi").css("display","none");
});
$("select[id=ctl00_ctl40_g_79c22aed_3137_4b3b_a503_28d89a94d8de_ff911_ctl00_Lookup]").change(function(){
switch($(this).val()){
case "0":
$("#vptoem").css("display","none");
$("#vmp").css("display","none");
$("#vpt_refinish").css("display","none");
$("#vpi").css("display","none");
break;
case "1":
$("#vptoem").css("display","none");
$("#vpi").css("display","none");
$("#vpt_refinish").css("display","none");
$("#vmp").show();
break;
case "2":
$("#vmp").css("display","none");
$("#vptoem").css("display","none");
$("#vpt_refinish").css("display","none");
$("#vpi").show();
break;
case "3":
$("#vmp").css("display","none");
$("#vpi").css("display","none");
$("#vpt_refinish").css("display","none");
$("#vptoem").show();
break;
case "4":
$("#vmp").css("display","none");
$("#vptoem").css("display","none");
$("#vpi").css("display","none");
$("#vpt_refinish").show();
break;
default:
$("#vptoem").css("display","none");
$("#vmp").css("display","none");
$("#vpt_refinish").css("display","none");
$("#vpi").css("display","none");
break;
}
});
PopUp Form Functionalities Get Value while Closing:-
$(document).ready(function()
{
$("#okbutton").click(function()
{
var prazid = $("#prazid input").val();
if($("#prazid input").val().trim().length=='0')
{
alert("Usted debe indicarr el <<Actividad>>. Por favor chequee que no esté vacío.");
$("#prazid").focus();
return false;
}
else
{
SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.OK,prazid);
}
});
$("#cancelbutton").click(function()
{
SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.cancel,'cancel');
});
});
<tr>
<td>
<input name="OK" type="button" value="OK" id="okbutton"/>
</td>
<td>
<input name="Cancel" type="button" value="Cancel" id="cancelbutton" />
</td>
</tr>
Button in Another Form:-
function openBasicDialog(tUrl, tTitle)
{
var options = {
url: tUrl,
title: tTitle,
width : 650,
height : 390,
dialogReturnValueCallback: onPopUpCloseCallBack
};
SP.UI.ModalDialog.showModalDialog(options);
}
function onPopUpCloseCallBack(result, returnValue) {
if (result == SP.UI.DialogResult.OK)
{
//alert(returnValue);
$("#DTSid input").val(returnValue);
}
}
function Parecer_Favoráve_button()
{
var r = confirm("Confirma o parecer favorável (OK) para a solicitação ?");
if (r == true)
{
openBasicDialog('/sites/SLServicos/Lists/Solicitao%20para%20Laboratrio/newpopup.aspx');
}
else
{
alert("O campo ''Prazo'' é obrigatório !!!");
}
<tr>
<td>
<input name="- Parecer Favoráve" type="button" value="Parecer Favoráve" onclick="javascript: if(Parecer_Favoráve_button()) {ddwrt:GenFireServerEvent('__commit;__redirect=/sites/SLServicos/SitePages/Home.aspx')}"/>
</td>
</tr>
Retrieve Single user in a group could be used only if a group contains single user
to get single user have to use two function on in on load and another one is used where ever want
RetriveSingleUserInGroup is used to create the instance
Parameter:
GroupID= id of the group,to get the Group ID go to the Page Properties
Return value:no return value
RetriveUserFromGroup is used only to return the user name from the group
Return value: user in the Group As String
function RetrieveSingleUserInGroup(GroupID)
{
var clientContext = new SP.ClientContext.get_current();
var collGroup = clientContext.get_web().get_siteGroups();
var oGroup = collGroup.getById(GroupID);
this.collUser = oGroup.get_users();
clientContext.load(collUser);
clientContext.executeQueryAsync(Function.createDelegate(this, function(){onSingleUserInGroupSuccess();}), Function.createDelegate(this, this.onSingleUserInGroupFailed));
}
function onSingleUserInGroupSuccess() //cannot be used directly
{
var userEnumerator = collUser.getEnumerator();
while (userEnumerator.moveNext())
{
oUser = userEnumerator.get_current();
//userInfo = '\nUser: ' + oUser.get_title() +
'\nID: ' + oUser.get_id() +
'\nEmail: ' + oUser.get_email() +
'\nLogin Name: ' + oUser.get_loginName();
userInfo = oUser.get_title();
RetriveUserFromGroup(userInfo);
break;
}
}
function onSingleUserInGroupFailed(sender, args) //cannot be used directly
{
alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
}
function RetriveUserFromGroup(UserName)//cannot be used directly
{
return UserName;
}
To check whether the Current Logged in user is in a Group--Applicable for New,Edit,Display Form
Parameter to be Passed :
GroupName=Name of the group in the site collection which the current logged in user must be there
Return Type:Boolean
Return values:
true = If current loggedIn user is there in group
false = If current logged user is not in group
function CheckCurrentLoggedInUserInGroup(GroupName)
{
var flag ="";
$().SPServices({
operation: "GetGroupCollectionFromUser",
userLoginName: $().SPServices.SPGetCurrentUser(),
async: false,
completefunc: function(xData, Status)
{
if($(xData.responseXML).find("Group[Name='"+UserName+"']").length==1)
{
flag = true;
}
else
{
flag = false;
}
}
});
return flag;
}
To log error occur when never needed to be done like PageLoad,OnbuttonPress,OnVlaueChanged etc--Applicable New,Edit,Display Page.
Parameter to be passed:
1.ListName=In which List the Error must be logged
2.EventColumnName=In which Column the Event Name have to Store
3.ExceptionColumnName=In which Column the Exception have to Stored
4.EventName=In Which Event the Exception Happened
5.Exception=Exception which Happened when Execution
function ExceptionLog(ListName,EventColumnName,ExceptionColumnName,EventName,Exception)
{
if(Exception.message==undefined)
{
Exception = Exception.get_message();
}
else
{
Exception = Exception.message;
}
var SPContext = new SP.ClientContext.get_current(); //get current context
var web = SPContext.get_web();//get current web
var list = web.get_lists().getByTitle(ListName); //get list
ListItem = list.addItem(new SP.ListCreationInformation());
ListItem.set_item(EventColumnName,EventName); //set values
ListItem.set_item(ExceptionColumnName,Exception);
ListItem.update();
SPContext.executeQueryAsync(CreateErrorLogListItem_Success, CreateErrorLogListItem_Fail);
}
function CreateErrorLogListItem_Success(sender, args){}//Create item in ErrorLog List--cannot use directly
function CreateErrorLogListItem_Fail(sender, args){}//works when item is not inserted in ErrorLog List--cannot use directly
Very helpful, thank you
ReplyDelete