jquery validator: how to pass form errors reported from server [duplicate]

问题

I have a simple login form with first_name, last_name and username password and confirm_password


FORM_RULES ={
    "first_name": {
        "required": true,
        "max_length": 30
    },
    "last_name": {
        "required": true,
        "max_length": 30
    },
    "username": {
        "required": true,
        "max_length": 150
    },
    password: {
        "required": true,
        minlength: 4
    },
    confirm_password: {
        required: true,
        minlength: 4,
        equalTo: "#password"
    },
}


FORM_MESSAGES = {
    "first_name": {
        "required": "This field is required",
        "max_length": jQuery.validator.format("Maximum {0} characters allowed!")
    },
    "last_name": {
        "required": "This field is required",
        "max_length": jQuery.validator.format("Maximum {0} characters allowed!")
    },
    "username": {
        "required": "This field is required",
        "max_length": jQuery.validator.format("Maximum {0} characters allowed!")
    },
    password: {
        required: "This field is required",
        minlength: jQuery.validator.format("At least {0} characters required!")
    },
    confirm_password: {
        required: "This field is required",
        minlength: jQuery.validator.format("At least {0} characters required!"),
        equalTo: "passwords does not match"
    },
}


let validator = $('#myForm').validate({
    rules: FORM_RULES,
    messages: FORM_MESSAGES
});

Now when i submit the form, if user exists i get a list of errors

$.ajax({
    url: "/add_user",
    type: 'POST',
    headers: { 'X-CSRFToken': csrftoken },
    data: row,
    success: function(res) {
        console.log("success")
    },
    error: function(err) {
        console.log(err.responseJson)
    }
})

err.responseJson

{
  "username": [
    "A user with that username already exists."
  ]
  "non-field-errors":[
    "User cannot be create. There are errors"
  ]
}

Now i want to show the username error for usernamefield and also on top of the form show the non-field-errors

<div class="alert alert-danger" role="alert" id="alert_add_edit">
    "User cannot be create. There are errors"  <-- show non-field error here
</div> 
<form>
   <input ...username>
   show username error herer
....
</form>

how can i dynamically tell jquery validation to incorporate these errors

来源：https://stackoverflow.com/questions/65457124/jquery-validator-how-to-pass-form-errors-reported-from-server

标签

jquery-validate