CODEWITHSUNDEEP
javascriptjqueryvalidation
Dmitriy
Dmitriy

Reputation: 37

Problem with display error message in span element when validation

Could you suggest how to show the error message not after element with id #genderError but insert it inside?

errorPlacement: function(error, element) {
    if (element.attr("name") == "myoptions" ) error.insertAfter('#genderError'); 
    },

Upvotes: 0

Views: 3743

Answers (3)

Alok Mali
Alok Mali

Reputation: 2881

You can manage multiple conditions inside errorPlacement.

Like below - 

errorPlacement: function(error, element) {
            if (element.attr("name") == "genderError") {
                $('#genderError').html(error); //or
                //$('#genderError').after(error);
            }
            else {
                if (element.hasClass("chosen-select")) {
                    error.insertAfter(element.next('div.chosen-container'));         
                }
                else {
                    error.insertAfter(element);  
                }
            }
        }

Upvotes: 0

Safwat Fathi
Safwat Fathi

Reputation: 1005

May i introduce a CSS form validation as a workaround solution?

<form>
  <label for="male">male</label>
  <input type="radio" name="gender" value="male" id="male" required>
  <label for="female">female</label>
  <input type="radio" id="female" name="gender" value="male" required>
  <span class="errMsg"></span>
</form>

input:invalid ~ .errMsg::after {
  content: '\2717';
  color: red;
}

input:valid ~ .errMsg::after {
  content: '\2713';
  color: green;
}

Upvotes: 0

Clarity
Clarity

Reputation: 10873

document.getElementById('#genderError').innerHTML = error;

Or if you're using jQuery:

$('#genderError').html(error);

or 

$('#genderError').text(error);`

if you just need to set the text.

Upvotes: 1

Related Questions