在视图中返回json结果

I have a newsletter text box that renders in a PartialView. This is the get action:

[ChildActionOnly]
public PartialViewResult NewsLetterSidebar()
{
    return PartialView("_NewsLetterSidebar");
}

And this is the Razor view:

model Blog.Web.UI.ViewModels.NewsLetterViewModel 

@{
    ViewBag.Title = "_NewsLetterSidebar";
}

@using (Html.BeginForm("NewsLetter", "Home", FormMethod.Post))
{
    <h3>News Letter</h3>
    <div>
        @Html.TextBoxFor(news => news.EmailAddress)
        @Html.ValidationMessageFor(news => news.EmailAddress)
    </div>
    <div>
        <input type="submit" value="Verify">
    </div>
}

I want the success message to appear under the verify button in case of valid input. This is my post action:

[HttpPost]
public JsonResult NewsLetter(NewsLetterViewModel newsLetter)
{
    var newsLetterViewModel = newsLetter.ConvertToNewsLetterModel();

    if (ModelState.IsValid)
    {
        _newsLetterRepository.Add(newsLetterViewModel);
        _newsLetterRepository.Save();
    }
    return Json("Done!");
}

How can I show the JSON message under the View?

Not tested but will help you to complete what you want.

[HTTPGET]
public JsonResult NewsLetter(NewsLetterViewModel newsLetter)
{
    var newsLetterViewModel = newsLetter.ConvertToNewsLetterModel();

    if (ModelState.IsValid)
    {
        _newsLetterRepository.Add(newsLetterViewModel);
        _newsLetterRepository.Save();
    }
    return Json("Done!", JsonRequestBehavior.AllowGet);
}

replace this

@using (Html.BeginForm("NewsLetter", "Home", FormMethod.Post))
{}

with

@using (Ajax.BeginForm("NewsLetter", "Home", new AjaxOptions{ onsuccess:"ShowMessage"}))
    {}

JS

function ShowMessage(data){
alert(data);
}

If you would like to use the first approach from my comment above, you need slightly modify your code. First of all, add Message property to your NewsLetterViewModel, then change the partial view:

@using (Ajax.BeginForm("NewsLetter", new AjaxOptions{UpdateTargetId = "newsletter-container"}))
{
    <h3>News Letter</h3>
    <span>@Model.Message</span>
    <div>
        @Html.TextBoxFor(news => news.EmailAddress)
        @Html.ValidationMessageFor(news => news.EmailAddress)
    </div>
    <div>
        <input type="submit" value="Verify">
    </div>
}

Please noеe that your partial view should be wrapped into a html element with id="newsletter-container" on your page e.g:

<div id="newsletter-container">
    @{Html.RenderPartial("_NewsLetterSidebar", new NewsLetterModel());}
</div>

Now, a small change in the controller:

[HttpPost]
public ActionResult NewsLetter(NewsLetterViewModel newsLetter)
{
    var newsLetterViewModel = newsLetter.ConvertToNewsLetterModel();

    if (ModelState.IsValid)
    {
        _newsLetterRepository.Add(newsLetterViewModel);
        _newsLetterRepository.Save();
            model.Message = "Done!";
    }

    return PartialView("_NewsLetterSidebar", model);
}

You also need to add jquery.unobtrusive-ajax.js to make it work.