CODEWITHSUNDEEP
javascriptformsreactjsfunctionvalidation
Preeti Kumari
Preeti Kumari

Reputation: 33

Validate two different input fields in the same form using Javascript

I have a form where i am validating two different fields, one is tax-number input field and other one is insurance-number field. I have wrote two corresponding functions for the validation of these fields. How can I write a wrapper function for both of them

Function for Tax field validation

    validationofTaxIDField(e, formDataArray){
            console.log("WorkflowDisplay: validateTaxIDField: e", e, formDataArray);
            let alertError = false;
            if(formDataArray && formDataArray[0] && formDataArray[0]["1"] && formDataArray[0]["1"].taxInformation){
                const ti = formDataArray[0]["1"].taxInformation;
                console.log("ti", ti);
                if(ti.taxId){
                    if( !validateTIN(ti.taxId) ){ //taxID number
              alertError = true;
            }
                }
            }
            if(alertError){
          alert(customErrorMessages.invalidTaxId);
        }
        }

**Function for Insurance field Validation**
validationofSocialInsuranceField(e, formDataArray){
        console.log("WorkflowDisplay:validateSocialInsuranceField: e" , e, formDataArray);
        let alertError = false;
        if(formDataArray && formDataArray[0] && formDataArray[0]["2"] && formDataArray[0]["2"].insuranceDetails){
            const iid = formDataArray[0]["2"].insuranceDetails;
            console.log("WorkflowDisplay:validateSocialInsuranceField:iid", iid);
            if(iid.insuranceId){
                if( !validateSINo(iid.insuranceId) ){ //taxID number
          alertError = true;
        }
            }
        }
        if(alertError){
      alert(customErrorMessages.invalidInsuranceId);
    }
    }

Now when I try to validation even if I am trying to only validate the insurance field it is always throwing me an alert for the tax field. Can someone help me for writing a wrapper function in javascript for both of them. Where i can collect the error messages from both. Please comment if you need more clarification on it. For now I just need to wrap them in a function which will return the corresponding error messages if they exist.

Upvotes: 0

Views: 375

Answers (1)

Akshay Vijay Jain
Akshay Vijay Jain

Reputation: 15945

Just like you have written two function validateTIN and validateSINo and these two functions are returning boolean.
Similarly make your current functions i.e.validationofTaxIDField and validationofSocialInsuranceField return boolean, true when pass and false when failing.

and use these two later functions as they are returning boolean, you can AND them and get the required validation met!

validationofTaxIDField(e, formDataArray) {
    console.log("WorkflowDisplay: validateTaxIDField: e", e, formDataArray);
    let alertError = false;
    if (formDataArray && formDataArray[0] && formDataArray[0]["1"] && formDataArray[0]["1"].taxInformation) {
      const ti = formDataArray[0]["1"].taxInformation;
      console.log("ti", ti);
      if (ti.taxId && !validateTIN(ti.taxId)) {
        alertError = true;
      }
    }
    return alertError;
  }
  validationofSocialInsuranceField(e, formDataArray) {
    console.log("WorkflowDisplay:validateSocialInsuranceField: e", e, formDataArray);
    let alertError = false;
    if (formDataArray && formDataArray[0] && formDataArray[0]["2"] && formDataArray[0]["2"].insuranceDetails) {
      const iid = formDataArray[0]["2"].insuranceDetails;
      console.log("WorkflowDisplay:validateSocialInsuranceField:iid", iid);
      if (iid.insuranceId && !validateSINo(iid.insuranceId)) {
        alertError = true;
      }
    }
    return alertError;
  }

wrapper(e, formDataArray) {
  if (this.validationofTaxIDField(e, formDataArray) && this.validateSocialInsuranceField(e, formDataArray)) {
    //do some forward stuff
  } else {
    //show validation error on screen
  }
}

Upvotes: 1

Related Questions