0

I am new to SharePoint forms in O365. I have a created a form which has cascading drop downs.

1) Country - A normal drop down field

2) State - A cascading drop down field linked to Country

3) City - A cascading drop down field linked to State

If the user selects a city named "XYZ" I want another field "Comments" hidden.

Using some online tutorials i learnt and executed the below code which works if its an independent drop down field. As my drop-down field "City" is linked to other drop-down this code is not working.

Any help on executing the correct code.

<script src="https://code.jquery.com/jquery-1.7.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function(){
        //Show/hide columns based on Drop Down Selection
        $("select[title='City Required Field']").change(function() {
           if ($("select[title='City Required Field']").val() != "XYZ")
           {
              $('nobr:contains("Comments")').closest('tr').hide();
           }
           else
           {
              $('nobr:contains("Comments")').closest('tr').show();
           }
       });
    });
</script>
  • What do you mean by "As my drop-down field "City" is linked to other drop-down"? Can you please add the complete code? Have you written .change() for City for multiple times? – Ganesh Sanap Jan 7 at 9:29
  • Dear Ganesh, I meant the field "City" is not a stand alone. The values in this drop down field keeps varying... e.g. Firstly user selects a vlaue from "Country" drop down, based on that selection, the value in the next dropdown "State" appear (i.e. if user selects India as Country - Kar, TN, AP appears as values in State Drop down) and Based on the State selected, values in City drop down field appears. For cascading drop down i have a different script written. – Srikanth Jan 7 at 9:34
  • You can work with PowerApps to achieve your purpose – AIMEN BOULAHIA Jan 7 at 9:41
  • @Srikanth: Please check if the change mehtod of "City" dropdown is being called on change of "State" dropdown. ? Have you written the change method of State dropdown which will call the change method of City – Ankit Katiyar Jan 7 at 9:41
  • @ Ankit. This is the code i have for cascading drop down – Srikanth Jan 7 at 9:55
0

You can make use of id attribute of your City dropdown to call Change event. In this case, I assumed id as city.

$(document).ready(function(){
$("#city").change(function() {
    if(this.value=="XYZ")
    {
        $('#Comments').css('display','none');
    }
});});
  • @ Mohammed. It's not exectuing – Srikanth Jan 7 at 10:23
  • How can you inject that JS script to SharePoint form ? – AIMEN BOULAHIA Jan 7 at 10:47
  • @Srikanth I have modified the code from on change to change event which will be executable in your case. – Mohammed Faisal Jan 7 at 11:21
  • @AIMENBOULAHIA there are various ways to inject JS in the form like SEWP or CEWP etc. can also be injected directly to the page. – Mohammed Faisal Jan 7 at 11:24
  • 1
    @AIMENBOULAHIA if you explain your situation little more, I can be able to help you out with the situation but from what I understood, I can say doing customization, you can achieve showing/hiding the fields based on permission assigned to user Role. – Mohammed Faisal Jan 7 at 11:53
0

I don't know how to achieve that using JS scripts, but I would like to share with you how to do it with PowerApps (which is really cool and even non-developers can achieve that)

Please refer to Mr Shane Young which i find him very professional guy, and here the link: PowerApps Cascading Dropdown , here you will find exactly what you want and more !

Good luck.

  • Thank you Aimen. But we dont have access to PowerApps and need to use JS – Srikanth Jan 7 at 12:20

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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