Hide dropdown items from lookup field in SharePoint via jQuery

March 1st, 2013 | Posted by Marijn in code | customization | demo | jquery / javascript | sharepoint | sharepoint 2010

In one of my blogposts I show you how to Hide dropdown values from choice fields in SharePoint via Jquery.¬†One of the comments on that blogposts is that this doesn’t work when you want to hide dropdown items from lookup field.

So, let’s get to work then!

SharePoint HTML output

I start off with a list containing 2 items:

- Paris

- London

I have another list with an extra column “lookupField” that is a lookup to that first list.

london and paris is shown

london and paris is shown

So, let’s take a look at the html output that SharePoint generates:

<td nowrap="true" valign="top" width="190px" class="ms-formlabel">
   <h3 class="ms-standardheader">
      <nobr>lookupField</nobr>
   </h3>
</td>

<td valign="top" class="ms-formbody">
   <span dir="none">
   <select name="ctl00" id="ctl00" title="lookupField">
      <option selected="selected" value="0">(None)</option>
         <option value="2">london</option>
         <option value="1">paris</option>
   </select>
</span>
</td>

The first part of the code (in the first td bracket) is used to show our title. The second part is our actual dropdown element with the various options.
You can see that we can get to our select element via the title, which is just the name of the field.

The code

To get to our select element we can use:


$(":input[title='lookupField']");

Underneath we can get to the options in 2 ways:
- use the value (in this case: 1 or 2)
- use the text (in this case: paris or london)

To remove a dropdown item from lookup field via the value:


$(":input[title='lookupField']").find("option[value='2']").remove();

To remove a dropdown item from lookup field via the text:


$(":input[title='lookupField']").find('option:contains(paris)').remove();

The result

We can see that our value “paris” is removed from our list.

only london is shown

only london is shown

You can follow any responses to this entry through the RSS 2.0 You can leave a response, or trackback.

2 Responses

  • yogendra says:

    Thanks , This is working for me now !! Great thanks for your help !!

  • Things can get messy really fast with SharePoint’s dropdowns, especially when you go from 19 to 20 options and SharePoint renders the dropdown differently in IE.

    Consider using the SPFilterDropdown function in SPServices to protect yourself from the messiness. It also takes the logic out of code and into the values in the lookup list.

    M.



Leave a Reply

%d bloggers like this: