How to hide certain choice values from appearing in a sharepoint list drop-down?

Question

I have a site column which is a lookup column to a column in parent list. I am using this site column titled as Company Name in many libraries. What I want to do is for certain libraries, i want to hide certain choices appearing in the drop-down.

Please see below screenshot of the upload form which has Company Name available as drop down.

For the current library, Company Name drop-down should only show only choices as: 13 Myrtle street and 4 Kasperski Way and other three must be hidden, this is just a sample, in production this drop-down has 84 choices so in such case I would have to show about 4 choices and hide other 80. Can someone help me with the JS code to implement this?

FYI, Company Name drop-down is a lookup column to the Company Column in the Company List which resides at the parent site. So even if the list gets entry added to it, I would like to make sure that new choice entry does not become available in the drop-down which could be irrelevant for a given library, so from a coding perspective, i would like to write code in a way as: except these 4 choice names others must be hidden.

Thanks in advance. I m working with office 365.

Answer 1

Try using the following JS script.

Change “lookupField” to the name of your lookup column.

By default, the value of the lookup is item ID. In the script below, “3” and “4” are item ids. Use the item id instead of the value string. Change to your ids.

<script src="https://code.jquery.com/jquery-3.3.1.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready( function() {
  $(":input[title='lookupField']").children("option").hide();
// hide the lookup value which id is 3 and 4
  $(":input[title='lookupField']").children("option[value='3']").show();
  $(":input[title='lookupField']").children("option[value='4']").show();
});
</script>

Answer 2

If the OOTB lookup fields do not enable you to filter out the choices you need, you could try using some 3rd party columns. For instance I use Sparqube columns (there are probably other similar 3rd party providers too), which give you a much more powerful lookup - for instance you can add conditions or filters to the lookup column.

For instance the 3rd party lookup column can be configured to use a view for the lookup - so in your case, you would configure a view to only select the 4 values you require for the Company Name. Or else you can use filters to only show the values you want.

Answer 3

So after some research, I was able to make this to work. Below is the Working Code: One note in order for this code to work, you will have to make sure that the Lookup column is non-mandatory otherwise the code won't work. This is weird but for some reason when a choice/lookup drop-down is made mandatory then the code does not trigger.

<script src="https://code.jquery.com/jquery-1.12.4.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready( function() {
  $(":input[title='Company Name']").find("option").hide();
// hide the lookup value which id is 3 and 4
  $(":input[title='Company Name']").find("option[value='3']").show();
  $(":input[title='Company Name']").find("option[value='4']").show();
});
</script>