return json結果視圖

我有一個在PartialView中呈現的新聞稿文本框。這是取得動作：return json結果視圖

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

這是Razor視圖：

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> 
}

我想驗證按鈕下出現在有效輸入的情況下，成功的消息。這是我的發帖動作：

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

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

如何在View下顯示JSON消息？

來源

2013-04-10 Eric Nielsen

你打算改變網頁還是直接發佈數據並保持你的位置？ – 2013-04-10 18:45:07

不，我不想改變頁面，我只想顯示成功或不成功的消息，所有 – 2013-04-10 18:48:30

您可以更改POST的操作以返回非JSON，但整個頁面（或部分視圖，這取決於您的視圖結構），但與「完成！」消息呈現。或者，您可以通過AJAX調用POST操作，從控制器獲取JSON並使用Javascript呈現消息。你更喜歡哪種方式？ – takemyoxygen 2013-04-10 19:00:14

未測試，但會幫助你完成你想要的。

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

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

替換此

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

與

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

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

來源

2013-04-10 19:10:29 HaBo

謝謝，我測試了你的答案，它的工作原理，你也知道我應該如何在視圖中顯示json結果消息？ – 2013-05-02 09:13:39

如果你想只顯示JSON結果，那麼使用這個新的AjaxOptions {updateTargetID}。或者如果您必須從JSON構建標記，則在ShowMessage函數中var d = JSON.Parse（data）; d.PropertyName等等... – HaBo 2013-05-02 13:16:41

如果你想用第一種方法，從我的意見，那麼，需要稍微修改你的代碼。首先，Message屬性添加到您的NewsLetterViewModel，然後改變局部視圖：

@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> 
}

請noеe你的部分觀點應該在你的網頁如被包裹成一個HTML元素id="newsletter-container"：

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

現在，在控制器的小變化：

您還需要添加jquery.unobtrusive-ajax.js做它瓦特掃。

來源

2013-04-10 20:59:56 takemyoxygen

return json結果視圖

回答

相關問題