Jquery - Sneak Peek

Rename Default buttons Save & Cancel

Save Button :   $("input[value$='Save']").attr('value', "Generate Booking");
Cancel Button  :  $("input[value$='Cancel']").attr('value', "Close");

Clear the Rows in the Dynamic Table(Except the TH)

• $("#TableName tr").not(function(){if ($(this).has('th').length){return true}}).remove();
• $("#ProjectColumns tbody").html('');

Hide the "tr" in the default Pages (NewPage/Editpage.aspx)

$('input[Title="ColumnName"]').closest('tr').hide();


Hide the "tr" in the default Pages (Displaypage.aspx)

$('span.ms-standardheader:contains("% Complete")').closest('tr').hide();


Hide the Save Button from the Ribbon

$("span.ms-cui-ctl-largelabel:contains('Save')").parent("a").hide();

Ways to add text to DropDown using Jquery:

• $('#drop').append($('<option>', {text : '(None)'}));
• $('#drop').append('<option value=text>text</option>');

Enriched Rich TextBox Validation:

var test = $(".ms-rtestate-write[id^='MultiText']");
if(test.length == 0)
{
alert('working');
}

ToolTip:

$('input[title="Function"]').mouseover(function()
       {
$("input[title='Function']").attr('title','This is a new mouse-over tooltip').tooltip();
});

CheckBox : Saving the selected Checkbox values:

   var favorite = [];
   $.each($("input[name='chkbox']:checked"), function(){          
      favorite.push($(this).val());
});
   alert("Selected Items: " + favorite.join(", "));
   $('textarea[title=Additionalreq]').val(favorite.join(", "));

return true;


Bind values to <Select> Dropdown control

$("#oQualification").append($("<option></option>").val(oQualificationUS[j].ID).html(oQualificationUS[j].Qualification));


OnChange function for <Select> DropDown Control:

$('#Control_ID').on('change',function(){

var otest = $(this).val(); // Displays the ID of the selected Item

var oSelectedItem = $('#Control_ID option:selected').text(); //Displays the selected item

//Set lookup value based on the item ID
Format : <option value="2187">TSU-Value</option>
  $('option[value="'+ItemID+'"]').prop('selected', true);

});

Bind Values to Radio Button HTML Jquery

• <div id="oAdditionalRequirements"></div>
• $('#oAdditionalRequirements').append($('<input type="radio" name="Addreq" value="' + value + '">' + value + '</input>'));

Difference between checked attribute and checked 

Checked attribute, corresponds to the defaultChecked property, tells you whether the element is checked when the page is loaded for the first time.

So if you set the checked attribute, the element will be checked only for the first time. You would not be able to change the selected value of radio button from second time onwards, if you use the checked attribute.

Missing enclosing quotes in name or value in jQuery selector:

In the below jquery selector, if you miss the quotes(single quote used below) enclosing name or value, jquery selector would not be able to select the elements who value contain spaces

$("input[name='"+name+"'][value='"+value+"']").prop('checked', true);

If you use the below code, instead of above code  -you would not be able to select the value with spaces. For example, by using the below code, you would not be able to select radio buttons with values like ‘US Citizen’ or ‘Not a US Citizen’.




$("input[name="+name+"][value="+value+"]").prop('checked', true);

Validation For People Picker: (for UserName not Found)

if ($('.ms-usereditor span.ms-error:contains("No exact match was found. Click the item(s) that did not resolve for more options.")').is(":visible") == true) {
alert('Please Check the Reporting Manager');
$("#DivReportMgr").find("div[title='People Picker']").focus();
return false;
}

Validation for Radio Button:


$('#Control_ID').find('input[type="radio"]:checked').val();

Dynamically set the saved items in CheckBox:

*ovalues - loop values from FOR loop.

input[name='req_cb'][value='"+ovalues+"']").prop("checked",true);