Skip to main content
Post Undeleted by GVIrish
added 1993 characters in body
Source Link
GVIrish
  • 332
  • 2
  • 6

The way I usually approach this problem is byreason it's not hiding anything on load, is because your logic for showing/hiding rows is set only to run when the Project Type dropdown changes. To have it run as soon as the page loads you need to execute your show/hide logic before or after your .change event wiring:

$(document).ready(function(){
    //Show/hide columns based on Drop Down Selection on page load
    ShowHideFields();
    $("select[title='Project Type']").change(function() {
        ShowHideFields();//only runs on dropdown change
    });
});

function ShowHideFields() {
        if ($("select[title='Project Type']").val() != "Ad") {
            $('nobr:contains("Vendor Contact")').closest('tr').hide();
            $('nobr:contains("Sponsorship")').closest('tr').hide();
            $('nobr:contains("Level")').closest('tr').hide();
        }
        else {
            $('nobr:contains("Vendor Contact")').closest('tr').show();
            $('nobr:contains("Sponsorship")').closest('tr').show();
            $('nobr:contains("Level")').closest('tr').show();
        }
        if ($("select[title='Project Type']").val() != "Focused On") {
            $('nobr:contains("Focus")').closest('tr').hide();
        }
        else {
            $('nobr:contains("Focus")').closest('tr').show();
        }
         if ($("select[title='Project Type']").val() != "Pitch") {
            $('nobr:contains("Pitch Company")').closest('tr').hide();
        }
        else {
            $('nobr:contains("Pitch Company")').closest('tr').show();
        }
        if ($("select[title='Project Type']").val() != "Other") {
            $('nobr:contains("If Other")').closest('tr').hide()
        }
        else {
            $('nobr:contains("If Other")').closest('tr').show();
        }
}

Also, if you don't want to have users see the hidden fields before the document.ready executes, hide the content by default using CSS, then showingshow it if the conditions are met on load in myyour javascript. That way people never see stuff they're not supposed to see.

The way I usually approach this problem is by hiding the content by default using CSS, then showing it if the conditions are met on load in my javascript. That way people never see stuff they're not supposed to see.

The reason it's not hiding anything on load, is because your logic for showing/hiding rows is set only to run when the Project Type dropdown changes. To have it run as soon as the page loads you need to execute your show/hide logic before or after your .change event wiring:

$(document).ready(function(){
    //Show/hide columns based on Drop Down Selection on page load
    ShowHideFields();
    $("select[title='Project Type']").change(function() {
        ShowHideFields();//only runs on dropdown change
    });
});

function ShowHideFields() {
        if ($("select[title='Project Type']").val() != "Ad") {
            $('nobr:contains("Vendor Contact")').closest('tr').hide();
            $('nobr:contains("Sponsorship")').closest('tr').hide();
            $('nobr:contains("Level")').closest('tr').hide();
        }
        else {
            $('nobr:contains("Vendor Contact")').closest('tr').show();
            $('nobr:contains("Sponsorship")').closest('tr').show();
            $('nobr:contains("Level")').closest('tr').show();
        }
        if ($("select[title='Project Type']").val() != "Focused On") {
            $('nobr:contains("Focus")').closest('tr').hide();
        }
        else {
            $('nobr:contains("Focus")').closest('tr').show();
        }
         if ($("select[title='Project Type']").val() != "Pitch") {
            $('nobr:contains("Pitch Company")').closest('tr').hide();
        }
        else {
            $('nobr:contains("Pitch Company")').closest('tr').show();
        }
        if ($("select[title='Project Type']").val() != "Other") {
            $('nobr:contains("If Other")').closest('tr').hide()
        }
        else {
            $('nobr:contains("If Other")').closest('tr').show();
        }
}

Also, if you don't want to have users see the hidden fields before the document.ready executes, hide the content by default using CSS, then show it if the conditions are met on load in your javascript. That way people never see stuff they're not supposed to see.

Post Deleted by GVIrish
Source Link
GVIrish
  • 332
  • 2
  • 6

The way I usually approach this problem is by hiding the content by default using CSS, then showing it if the conditions are met on load in my javascript. That way people never see stuff they're not supposed to see.

The fastest way to do this is to modify the form directly. So you could go to the desired rows in your form(s) and make it:

<tr style="display:none">

Or you can do it by adding the id tag to the desired rows, then setting those id's to display:none in a css block.