0

I have 10 Dropdowns in a sharepoint list. When the user Clicks on Add New Item in Newform.aspx Currently it will show only First Dropdown i.e (Drop1) With Empty Value. When the user Selects any Value From the Dropdown then Second Dropdown i.e (Drop2) with Empty value is shown. Like this Drop3.. Drop4.. Drop 5 ... Drop 10.

My Target is :

How can we hide the Dropdown in a Un Even manner. For Ex If the User Selects Drop 4 as empty It should Empty and hide Drop 5, Drop 6 Drop 7... Drop10. It should not Empty Drop 1 .. Drop 3

Any help on this please.

My Code is as Follows:

$(document).ready(function(){

CheckDropdown("DropDown 1","DropDown 2");
CheckDropdown("DropDown 2","DropDown 3");
CheckDropdown("DropDown 3","DropDown 4");
CheckDropdown("DropDown 4","DropDown 5");
CheckDropdown("DropDown 5","DropDown 6");
CheckDropdown("DropDown 6","DropDown 7");
CheckDropdown("DropDown 7","DropDown 8");
CheckDropdown("DropDown 8","DropDown 9");
CheckDropdown("DropDown 9","DropDown 10");
CheckDropdown("DropDown 10","DropDown 11");
CheckDropdown("DropDown 11","DropDown 12");
CheckDropdown("DropDown 12","DropDown 13");
CheckDropdown("DropDown 13","DropDown 14");
CheckDropdown("DropDown 14","DropDown 15");

});
function CheckDropdown(Drop_Column,Hide_Column)
{
if ($("select[title='"+Drop_Column+"']option:selected").text() == "")
{
HideColumn(Hide_Column,"True");
} 
else
{
HideColumn(Hide_Column,"False");
}
var DropDownColum=$("select[title='"+Drop_Column+"']");
DropDownColum.change(function() {
var value = $(this).val();// Value of selected option
        var Text = $(this).val();// Text of selected option
       // alert('Value: '+value);
       // alert('Text:' +Text);
if (Text == "")
{
HideColumn(Hide_Column,"True");
$("select[title='"+Hide_Column+"']").find('option:eq(0)').prop('selected', true); 

} 
else
{

HideColumn(Hide_Column,"False");
}
});

}
function HideColumn(Column,IsHide)
{

     if(IsHide=="True")
     {  
        $('nobr:contains("'+Column+'")').closest('tr').hide();
     }
     else
     { 
        $('nobr:contains("'+Column+'")').closest('tr').show();
     }
}

</script>

1 Answer 1

1

Try this- slight change in the HideColumn function

function HideColumn(Column,IsHide)

{

 if(IsHide=="True")
 {  
    $('nobr:contains("'+Column+'")').closest('tr').hide();
    $('nobr:contains("'+Column+'")').closest('tr').nextAll().hide();
 }
 else
 { 
    $('nobr:contains("'+Column+'")').closest('tr').show();
 }

}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.