Conditional show/hide HTML field not working in dropdown

  • Resolved jakubkubajz

    (@jakubkubajz)


    2 weeks, 5 days ago

    Here is the English version, clear and support-friendly:

    Hello,

    I need help setting up conditional logic in Calculated Fields Form.

    I have a dropdown field (e.g. fieldname24) and I need two things to happen when the user selects one specific value:

    1. the form submission should be blocked (prevent submit),
    2. an HTML text field should be displayed explaining why the form cannot be submitted with that selection.

    I tried using an HTML Content field and different configuration options, but I can’t get the “conditional show/hide” to work correctly, and I also can’t find a reliable way to prevent form submission based on a dropdown value.

    Could you please advise how to correctly set up:

    – conditional display of an HTML Content field based on the dropdown selection, and

    – validation that prevents the form from being submitted when a specific value is selected?

    Thank you.

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)
  • Plugin Author CodePeople2

    (@codepeople2)

    2 weeks, 5 days ago

    Hello @jakubkubajz

    Thank you so much for using our plugin.

    You can show/hide the “HTML Content” field by selecting a specific choice in the DropDown field by configuring dependencies as described in the following video tutorial:

    https://youtu.be/s4FM59LC-H4

    However, it does not applies to the submit button.

    So, in this case, it is better to use a calculated field as an auxiliary field.

    I’ll try to describe the process with an hypothetical example.

    Assuming the dropdown field is the fieldname1 and the HTML Content field is the fieldname2, you also want to show the fieldname2 field and hide the submit button if the fieldname1 value is “value A”, and do the opposite for any other fieldname1 value.

    Insert a calculated field in the form to be used as an auxiliary (you can hide it from the form and exclude it from the form submission by ticking a pair of checkboxes in its settings), and enter the equation:


    (function(){
    if(fieldname1 == 'value A') {
       SHOWFIELD(fieldname2|n);
       fbuilderjQuery('.pbSubmit').addClass('hide-strong');
    } else {
       HIDEFIELD(fieldname2|n);
       fbuilderjQuery('.pbSubmit').removeClass('hide-strong');
    }
    })()

    Best regards.

Viewing 1 replies (of 1 total)

You must be logged in to reply to this topic.