Saturday, January 19, 2013

Hide fields in the list view web part using jquery

Hi Guys,

I had a requirement to hide the list fields in the list view web part.

For example, in a workflow, I have a course training custom list with multiple columns, where the students want to enter their data like name, course required, timings etc and course  faculty need to see additional fields like approved/rejected, his availability etc.

For students, they should not see approved column while they submit the course request.

This could be possible through  a simple j query, in a content editor web part with specifying target audience.

Here is the jquery code.

$('nobr:contains("Approved")').closest('tr').hide(); //"Approved" is your required column to hide.

The code works like this
When you go to view source of the page, you could see the fields names with the tag "nobr" associated to it. So query those tags with jquery selector and hide its nearest 'tr'.

So if the above code does not work for you, make sure  to check the view source of the page and see the field name tags.


No comments: