How would I hide 2 columns in SP13 if column A if the answer is No in SP13?

Question

I'm haggling over how to "hide" 2 columns when a specific column drop down answer is "No". Assuming I use JS, would I save the script in Site Assets and refer the link on CEWP? Here's the script I found and am also wondering if I need to download SPUtility.js? I work for a gov't contractor and am not sure I can upload that on my Style Library. Here's the script & not very savvy with JS. Thx!

<script src="http://code.jquery.com/jquery-1.7.2.min.js" type=text/javascript"></script>
<script type="text/javascript">

$(document).ready(function(){

       // col1 is hidden by default , col2 is visible 
      $('nobr:contains("col1")').closest('tr').hide();

      // Show/hide columns based on Drop Down Selection

      // hide col2 and show col1 when selecting "dropdown option 1"
      $("select[title='dropdown column name']").change(function() {
      if ($("select[title='dropdown column name']").val() == "dropdown option 1") {
               $('nobr:contains("col2")').closest('tr').hide();
               $('nobr:contains("col1")').closest('tr').show();
           } 
      // hide col1 and show col2 when selecting "dropdown option 2"
      else if($("select[title='dropdown column name']").val() == "dropdown option 2"){
             $('nobr:contains("col1")').closest('tr').hide();
             $('nobr:contains("col2")').closest('tr').show();
          }
     });
});
</script>

score 1 · Answer 1 · answered Oct 16 '18 at 21:11

would I save the script in Site Assets and refer the link on CEWP?

It's an option, and you can also add the above script directly to Script editor web part in your New or Edit form.

Check also Show / Hide fields based on choice field selection using JQuery

I am also wondering if I need to download SPUtility.js?

No, SPUtility.js is not used in your code.

But you can also use SPUtility.js to Show / Hide fields based on a drop-down field selection

For more details, check Show / Hide fields based on a drop-down field using SPUtility.js

Can I upload that on my Style Library

You can download the Jquery.js and upload it to Style library and use the jQuery reference locally, instead of the online URL.

In some cases, specifically for intranet portals, there is no internet access so the script will not work!

If you ask about the Diff between Site Assets and Style Library, check these threads

score 0 · Answer 2 · answered Oct 17 '18 at 01:42

Modify the column name in the code below, and add the code into a script editor web part/content editor web part into new/edit form page to achieve it.

<script src="https://code.jquery.com/jquery-1.12.4.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
    var dropdownColumnName="dropdown column name";
    var hideColumn1="col1";
    var hideColumn2="col2";

    if($("select[title='"+dropdownColumnName+"']").val()=="No"){
        $("nobr:contains('"+hideColumn1+"')").closest('tr').hide();
        $("nobr:contains('"+hideColumn2+"')").closest('tr').hide();
    }
    $("select[title='"+dropdownColumnName+"']").change(function() {
        if ($(this).val() == "No") {
            $("nobr:contains('"+hideColumn1+"')").closest('tr').hide();
            $("nobr:contains('"+hideColumn2+"')").closest('tr').hide();

        }else{
            $("nobr:contains('"+hideColumn1+"')").closest('tr').show();
            $("nobr:contains('"+hideColumn2+"')").closest('tr').show();
        }
    });
})
</script>

How would I hide 2 columns in SP13 if column A if the answer is No in SP13?

2 Answers2