Dynamic field + bootstrap validation | Community
Skip to main content
david--garcia
Level 10
March 3, 2021
Question

Dynamic field + bootstrap validation

  • March 3, 2021
  • 1 reply
  • 1242 views

I am displaying/hiding form elements based on a user dropdown select option, the following script is meant to add/remove required attributes on the fields, however, it seems that validation is not taking this into account, could it be that validation script only runs on page load rather than on dynamic form changes? if so, how can I make it listen to changes in form required fields.

 

 

function MyOnChange(invesType){
  var x = document.getElementById("iProfessional");
  if (invesType != "privateClients") {
    x.style.display = "block";
    $("#companyname").attr("data-nl-ismandatory","true");    
  $('#companyname').prop('required', true)
  
    $("#jobtitle").attr("data-nl-ismandatory","true");    
  $('#jobtitle').prop('required', true)
  
    
    } else {
    x.style.display = "none";
     $("#companyname").attr("data-nl-ismandatory","false");
    $("#companyname").removeAttr("required");
  
    $("#jobtitle").attr("data-nl-ismandatory","false");
    $("#jobtitle").removeAttr("required");  
    }    
  
}

 Upon submitting the form after the required and data-nl-ismandatory have been removed, Adobe Campaign is showing that these fields are mandatory.

 

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

1 reply

Manoj_Kumar
Community Advisor
Community Advisor
March 14, 2021

Hello @david--garcia 

 

Remove all "data-nl-mandatory" tags and validate everything with the javascript. nl tags won't consider the dynamic changes.

Remove the validation log from OnChange function and add the logic in the form Validation function. The form validation function will look like this

function formValidation(){ var jobTitle=$("#jobtitle").val(); var companyname=$("#companyname").val(); if(jobTitle!="privateClients"){ if(companyname==''){ alert("Company Name is required"); // you may want show it in error div via innerHTML return false; } } document.controller.submit("NEXT_TRANSITION_NAME"); }

 

and the submit button will have this onclick attribute.

onclick="return formValidation()"

 

It should work in this case.

 

 

 

 

Manoj  | https://themartech.pro