Paul Galvin's (old) SharePoint space [SharePoint

Just another site

Quick and Easy: A Better Way to Use jQuery to Hide a Text Field on a SharePoint Form

This is another post in my on-going series on how to use jQuery with SharePoint.
If you want to learn more about jQuery, I highly recommend: jQuery in Action by Bear Bibeault and Yehuda Katz.

Previously, I wrote about how to use jQuery to locate and hide a text field on a form.  I didn’t care for the specific approach (I was chaining parents – that’s simply isn’t done these days, at least in families of quality). 

When I first started to think about it, I knew I needed to find a <TR> to which I could invoke the hide() method.  My early effort to find the correct <TR> was something like this:

$('tr:has(input[title=Hide Me!])');

The problem with that is that it would find every <TR> tag that had any parent relationship to the Hide Me! field, even if Hide Me! is nested many levels deep in <TR>’s.  It turns out that on my sandbox form, that expression finds 9 different TR’s who have Hide Me! as a child somewhere in its DOM tree.  I realized that I could walk back up the tree from the input field itself, so that’s how I ended up abusing parents, but it didn’t sit well with me.

I gave some thought to this and one of the things I read finally made sense: I could use the not() method to trim out <TR>’s I don’t want in my wrapped set.  That led me to this:

$('tr:has(input[title=Hide Me!])').not('tr:has(tr)').hide();

The first bit finds all the <TR> tags that have the Hide Me! field anywhere in their own hierarchy.  It then strips out any <TR> that also have a child <TR>.  This leaves us with a single <TR> that:

1) Has no <TR> child records

2) Does have the input field as child. 

We can then apply the hide() method to the resulting set and we’re done.

I’m still a bit nervous about this, but not as nervous as chaining parents.

I don’t know if this is a best practice or not.  There may be a more appropriate way of identifying just the <TR> that we care about in a SharePoint form.  If you know, please post a comment.



Subscribe to my blog.

Follow me on Twitter at


One response to “Quick and Easy: A Better Way to Use jQuery to Hide a Text Field on a SharePoint Form

  1. Jonathan June 15, 2009 at 4:56 am

    Hi Paul,Paul Culmsee of Clever Workarounds wrote an article about exactly the same issue (finding the correct TR to hide a field) using plain JavaScript, not jQuery. He found an universal way to find the TR to hide, it\’s at the end of this blogpost : it helps,Jonathan

Leave a Reply

Fill in your details below or click an icon to log in: Logo

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

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: