asp.net mvc 3 return a message from controller action ajax

Question

I have a question about Ajax form submit. Here is the code:

Controller

[HttpPost, ValidateAntiForgeryToken, ValidateInput(true)]
public ActionResult Contact(ContactForm model)
{
    if (!ModelState.IsValid)
    {                    
        return new EmptyResult();                    
    }
    else
    {
        string message = model.Name + " " + model.Telephone + " " + model.Email + " " + model.Address + " " + model.City + " " + model.ZipCode;

        //send it    

        return new EmptyResult();
     }
}

View

<script type="text/javascript">

    function PostSuccess() {
        $('.success-message').html("Thank you for your interested");
    }

    function PostFailure() {
        $('.success-message').html("Something went wrong... Make sure the required fields are filled out and in correct format");
    }
</script>
<div class="contact-form">
@using (@Ajax.BeginForm("Contact", "Info", new AjaxOptions { HttpMethod = "Post", OnFailure = "PostFailure", OnSuccess = "PostSuccess" }))
{ 
    <p>
    @Html.LabelFor(x => x.Name, "Your name") 
    @Html.TextBoxFor(x => x.Name, new { @class = "required" })<span class="required">*</span>
    </p>

    <p>
    @Html.LabelFor(x => x.Email, "Your email")
    @Html.TextBoxFor(x => x.Email)<span class="required">*</span>
    </p>

    <p>
    @Html.LabelFor(x => x.Telephone, "Your phone")
    @Html.TextBoxFor(x => x.Telephone)<span class="required">*</span>
    </p>

    <p>
    @Html.LabelFor(x => x.Address, "Your address")
    @Html.TextBoxFor(x => x.Address)
    </p>

    <p>
    @Html.LabelFor(x => x.ZipCode, "Your zipcode")
    @Html.TextBoxFor(x => x.ZipCode)
    </p>

    <p>
    @Html.LabelFor(x => x.City, "Your city")
    @Html.TextBoxFor(x => x.City)
    </p>
    @Html.AntiForgeryToken()
    <button type="submit" id="bContact">Send Message</button>
}

<div class="required">* Required Fields</div>
<div class="success-message">Output</div>

All I want is a appropriate message in "success-message" class, but the POST is always successful so I always get "Thank you for your interest."

Thank you.

casperOne · Accepted Answer · 2011-12-20 14:34:13Z

2

To get a appropriate message in "success-message" class, you must change code in your action. Such as :

[HttpPost, ValidateAntiForgeryToken, ValidateInput(true)]
        public ActionResult Contact(ContactForm model)
        {
            if (!ModelState.IsValid)
            {

                return Json("", JsonRequestBehavior.AllowGet);

            }
            else
            {
                string message = model.Name + " " + model.Telephone + " " + model.Email + " " + model.Address + " " + model.City + " " + model.ZipCode;
                return Json(message, JsonRequestBehavior.AllowGet);
            }
        }

and in success function, you put parameter in there .

function PostSuccess(data) {

        $('.success-message').html(data);
    }

edited Dec 20, 2011 at 14:34

casperOne

74.7k19 gold badges189 silver badges262 bronze badges

answered Dec 20, 2011 at 2:30

Nguyễn Quốc Khánh

894 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Drew Gaynor · Accepted Answer · 2011-12-20 02:17:12Z

If I understand you correctly, you'd like for your form to be validated. That is, you'd like for the message in PostFailure to be displayed if the user made some invalid inputs, and to force the user to make corrections before running the code in the else statement of your controller. You haven't posted your model so I don't know if you are doing this, but for the form to validate you should use Data Annotations.

For example, your model should contain:

[Required(ErrorMessage = "Name is required!")]
public string Name { get; set; }

for the name field. You can change the message to be whatever you'd like, which allows for a message specific to Name rather than the generic one that you have, if you'd like.

Then in the view, you should include:

@Html.ValidationMessageFor(x => x.Name)

And be sure to include:

<appSettings>
    <add key="ClientValidationEnabled" value="true"/> 
    <add key="UnobtrusiveJavaScriptEnabled" value="true"/> 
</appSettings>

in your web.config file to enable client-side validation (assuming that you've included the jQuery validation libraries, but they're included by default in ASP.NET MVC3 projects).

Lester · Accepted Answer · 2011-12-20 01:55:15Z

0

OnSuccess and OnFailure refers to if the AJAX call was made successfully or failed. From MSDN for OnFailure:

This function is called if the response status is not in the 200 range.

You can do the following to get OnFailure to run:

throw new HttpException(404, "Not Found");

But I would recommend that it would be better to change the success event to call a javascript function that would parse the results of the call.

answered Dec 20, 2011 at 1:55

Lester

4,4133 gold badges30 silver badges31 bronze badges

Collectives™ on Stack Overflow

asp.net mvc 3 return a message from controller action ajax

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related