Using JQuery to hide SharePoint 2013 List Item fields

Hiding unnecessary fields in DispForm.aspx/EditFOrm.aspx is something most of us implement within our SharePoint implementations. Here is a quick way to achieve that using JQuery.
Hiding any List Item fields
So you have many fields in your NewForm.aspx but you want to hide some like in the screenshot. I want to hide the fields I haven’t underlined.

I will click on Edit Page, and add a Script  Editor webpart on the page. From the below script, just change the number in which your fields appear on the page using a 0 index. So to hide the first field, enter 0, second field – enter 1 and so on.


$(document).ready( function() {
$("TABLE.ms-formtable>TBODY>TR:eq(3)").css('display', 'none');
$("TABLE.ms-formtable>TBODY>TR:eq(7)").css('display', 'none');
$("TABLE.ms-formtable>TBODY>TR:eq()").css('display', 'none');
$("TABLE.ms-formtable>TBODY>TR:eq(9)").css('display', 'none');
$("TABLE.ms-formtable>TBODY>TR:eq(10)").css('display', 'none');
})

Also you can do some formatting on your page using Jquery, for example I am making the font as BOLD for the list item entries.

$(".ms-formbody").css("font-weight","bold");

Also,
I want to hide the information in the screenshot, you can add this line as well.

$(".ms-descriptiontext").css("display","none");

Hope this helps someone looking for a similar scenario.

Advertisements

2 thoughts on “Using JQuery to hide SharePoint 2013 List Item fields

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 )

Google photo

You are commenting using your Google 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 )

Connecting to %s