JavaScript in forms is not working

Hi,

User interface = We are using Office 365 Sharepoint.

Scenario:
We are attempting to create a dynamic list.
Where for example people have a first list with

Option 1
Option 2

When user presses Option 1
drop down below options are available

Option 3
Option 4
Option 5

When Option 2 is chosen then the options below are listed

Option 6
Option 7

IE - To get option 3,4, 5 Option 1 must be chosen first
To get option 6, 7 Option 2 must be chosen first.

Questions (2):

1 - Is there a way this can be done using the GUI or must it be done by creating or amending javascript?

2 - We have attempted to do this by editing a javascript code, but it is not working - in fact we cannot get any are not getting any js to run. We have tried very simple things like just getting one drop down to change the values in the others like the example below and getting a button to fill out a field but nothing works. What are we missing/doing wrong?

    fd.spRendered(function() {

    function SetDropDownValue() {
        if (fd.field('DropDown3').value == 'Item 1') {
            // Set the values of DropDown 1 and 2 to Item 1 and 2
            fd.field('DropDown1').value = 'Item 1';
            fd.field('DropDown2').value = 'Item 2';
        } else {
            // Set the values of DropDown 1 and 2 to Item 2 and 1
            fd.field('DropDown1').value = 'Item 2';
            fd.field('DropDown2').value = 'Item 1';
        }
    }

    // Calling enableOrDisableResolvedTab when the user changes the Status
    fd.field('DropDown3').$on('change',SetDropDownValue);

    // Calling enableOrDisableResolvedTab on form loading
    SetDropDownValue();

});

Hello @NG-Helpdesk,

You can use the Lookup field instead of a DropDown field to dynamically display different values in the dropdown.

Please find the example in the How to configure cascading lookup fields in SharePoint form article.

Hi @mnikitina,

Thanks for this. This does look exactly like what we are trying to do BUT I don't have the "Extra Fields" and "Expand" setting that these instructions show. I don't even have the "Settings" tab.

For a drop down control I get the following options:

Am I missing something? We have Plumsail forms 1.6.1 installed. It says we are currently using the "Scooter Plan" is that a factor?

Hello @NG-Helpdesk,

So you are using Public Forms.

First, for Public Forms, you need to use rendered event handler. Please find more about the available events here.

And to dynamically change available options of the DropDown field you can use this code:

fd.rendered(function(){
       fd.field('DropDown1').widget.setDataSource({
            data: ['1', '2', '3']
        });
});
1 Like

Hi @mnikitina,

Thanks for this That is exactly what I needed! Sorry to ask silly questions but we're very new to this.

We would still be interested in implementing the cascading lookup fields though but in either my SharePoint forms OR my public facing forms I don't have the "Extra Fields" and "Expand" Settings. Do you know why this might be?

Hello @NG-Helpdesk,

Extra Fields and Expand settings are available for SharePoint Lookup fields only. To create a Lookup field click Add Column >> More and set the type of information to Lookup (information already on this site).

Then in Additional Column Settings, you can select the list from which the field will get the data.

To create cascading Lookup fields, please follow the instruction from the article.

1 Like

Hi @mnikitina

Thanks so much for all your help. We now have things working and your help has been invaluable!

1 Like