We may need to show or Hide the columns based on some actions like selection of data from drop down. We can achieve this using a jquery.
Update the inputs below..
<script src="URL to your jQuery-1.3.2.js file" type=text/javascript></script> <script type="text/javascript"> // Execute the following JavaScript after the page has fully loaded, when it's ".ready"$(document).ready(function(){ //Define which columns to show/hide by default $('nobr:contains("Display Name of Column to hide")').closest('tr').hide(); $('nobr:contains("Display Name of Column to hide")').closest('tr').show(); //Show/hide columns based on Drop Down Selection $("select[title='Display Name of Drop Down Column']").change(function() { if ($("select[title='Display Name of Drop Down Column']").val() == "Drop Down Selection 1") { $('nobr:contains("Display Name of Column to hide")').closest('tr').hide(); $('nobr:contains("Display Name of Column to show")').closest('tr').show(); } else if($("select[title='Display Name of Drop Down Column']").val() == "Drop Down Selection 2"){ $('nobr:contains("Display Name of Column to hide")').closest('tr').hide(); $('nobr:contains("Display Name of Column to show")').closest('tr').show(); } });});</script> |
good one.
ReplyDeleteTo clarify...
ReplyDelete1-save the code (line 2-end) somewhere accessible on the network
2-add a content editor web part to the top of my form
3-add the first line of script that points to the location of the script i saved
I figured it out and it's most fabulous!!!
DeleteI didn't read the instructions clearly. I needed this jQuery on my network to make it work.
http://code.google.com/p/jqueryjs/downloads/detail?name=jquery-1.3.2.js
THANKS!
Except if you use it for editing the item, the previously hidden column isnt visible until you change the drop down again.
DeleteI'm trying to figure out how to modify this code for checkboxes instead of dropdowns. Help?
ReplyDeletewhy is it not working for me :(
ReplyDeleteThis works beautifully! Thank you!
ReplyDeleteProblem is with Code
ReplyDeletein begining quotations should end at ".js"
I'm trying to adapt this to use with multiple subsequent drop downs but can't get it to work properly. The second drop down only works if the 1st has a specific value selected but I want them to run independently. Any help?
ReplyDeleteWe can also hide the fields by applying conditional rules in infopath form.
ReplyDeletewhen i do .show(), my field becomes read-only and shows "undefined" as a value. i want it to be a text-field(as it is defined as one).
ReplyDeleteIs there a way to start the form off with just the dropdown and then add items based on drop down selection? The problem I have now is that if you don't start off with the full form the form does not dynamically size back up to it's original size. It stays the same small size as when it loaded with just the drop down field.
ReplyDeletethank you so much! saved my day!
ReplyDelete• Nice and good article. It is very useful for me to learn and understand easily. Thanks for sharing your valuable information and time. Please keep updating. Power Bi Online Training BANGALORE
ReplyDeletewhere to add this code in the sharepoint designer?
ReplyDeleteThanks. It works perfectly :)
ReplyDelete