We created a simple list with choice field and four text fields.

Open  forms designer and place your fields in the form:

Save the form and open some list item for editing (we need to find the generated identifier for the fields).



You need to save a part of the identifier for each required field (in our case there are 4 fields and choice field)

After collecting all the data, open the Virto Forms Designer and add the JS code to the form.





Save script and save form.


Now you should see:




JS Code:


// Choice Field

var fldSelect = $("[id*='_ChoiceField_ctl00']");


// Fields components

var fld1 = $("[id*='G0_x0020_Field1Field_ctl00']").closest(".component");

var fld2 = $("[id*='G0_x0020_Filed2Field_ctl00']").closest(".component");

var fld3 = $("[id*='G1_x0020_Field1Field_ctl00']").closest(".component");

var fld4 = $("[id*='G1_x0020_Field2Field_ctl00']").closest(".component");


// Subscribe to Choice Field changes

fldSelect.on('change', function() {

  setVisiblity( this.value );

});


// Toggle fields components

function setVisiblity(condValue){

    fld1.hide();

    fld2.hide();

    fld3.hide();

    fld4.hide();

    if(condValue == "Enter Choice #1"){

        fld1.show();

        fld2.show();

    }

    if(condValue == "Enter Choice #2"){

        fld3.show();

        fld4.show();

    }

}


// Set visibility on form load

setVisiblity(fldSelect.val());