Showing Validation error for server side validation

Question

I have an ajax form and inside i have an editor-for a model which has email Field with custom validation attribute which check if email already exist in the server so it goes like this:

$("#submitPop").live("click", (function (e) {
       var form = $("#popForm");
        form.validate();
        if (form.valid()) {
            $.ajax({
                type: "POST",
                url: "/Account/RegisterEmail/",
                data: form.serialize(),
                dataType: "json",
                success: function (result) {
                    if (result.Status) {
                        location.reload(true);
                    } else {
                        alert("Something Went Wrong!"); //what should i write here to show the error message in its generated field-validation-error span
                    }
                }
            });
        }
        return false;

    }));

inside the ajax form:

       @Html.EditorFor(x => x.Email)
       @Html.ValidationMessageFor(x => x.Email)</li>

as the comment says what do i when the ajax result return false in order to show the error message in the field-validation-error span generated?

i was thinking of a native way to inform jquery of the error and inform jquery to change all the needed changes like putting the red X and making the error span font red etc etc something like:

$.Validator.ShowErrorMessageFor("Email","Email is Already Taken")

score 2 · Accepted Answer · edited May 23 '17 at 12:03

If you are using ASP.net MVC3 will suggest to use Remote Validation Attribute

Error message wil be rendered in Field Validation error Message Span.

ASP.NET MVC 3 provides a mechanism that can make a remote server call in order to validate a form field without posting the entire form to the server. This is useful when you have a field that cannot be validated on the client and is therefore likely to fail validation when the form is submitted. For example, many Web sites require you to register using a unique user ID. For popular sites, it can take several attempts to find a user ID that is not already taken, and the user's input is not considered valid until all fields are valid, including the user ID. Being able to validate remotely saves the user from having to submit the form several times before finding an available ID.

See this SO question remote-validation-in-asp-net-mvc-3- or refer MSDN Article

Thanks You it works!, this is great but i have only one doubt about it which is posting back every time the Textbox changes, would be better if it post only when textbox lose focus , dont you think ? — Stacker, Jan 19 '12 at 00:00
Stacker I think this is a defualt behaviour for remote Validation. would be intrested to see if we can customise it — swapneel, Jan 19 '12 at 09:08

score 0 · Answer 2 · answered Jan 18 '12 at 22:29

0

I assume that the Id of the span is field-validation-error, then it should be like,

$('#field-validation-error').text('Email already exist, Please enter a different email ID');

answered Jan 18 '12 at 22:29

Selvakumar Arumugam

79,297
15
120
134

No span doesnt has an id it only has a class of "field-validation-error", and there ofcourse other spans that has that too – Stacker Jan 18 '12 at 22:33
i was thinking of something more native – Stacker Jan 18 '12 at 22:34
@Stacker: Where do you want to show the validation error? Is there anything different about that span from the other span with same class? If yes, then we can use that to set the error message inside that span. If you have ID, then we can use simple native js to set the innerHTML. – Selvakumar Arumugam Jan 18 '12 at 22:38

score 0 · Answer 3 · answered Jan 18 '12 at 22:34

0

first, set an id to the span:

<span class="field-validation-error" id="validEmail"></span>

then you can use:

$('#validEmail').text('Email already exist...');

answered Jan 18 '12 at 22:34

Gustavo F

2,071
13
23

as you can see in my updated question i dont control the id of the span its generated. – Stacker Jan 18 '12 at 22:39
to set an id to the validation span simple use: `@Html.ValidationMessageFor(x => x.Email, "Please enter a valid email", new { id = "validEmail" })` – Gustavo F Jan 18 '12 at 22:56
i tried this , but even if i did this , jquery add alot of stuff to the span to make it look like an error message, like adding Red X next to it and making font red etc, i was thinking of a native way to inform jquery of the error. – Stacker Jan 18 '12 at 22:59

Showing Validation error for server side validation

3 Answers3