I use Ajax for calling Action and try to display returned message from Controller to the View. However, although the message is returned with TempData, it is not displayed on the View (Actually I was displaying it in @Html.BeginForm(), but this time I use <form> and maybe it is due to that). On the other hand, I tried to use jquery.cookie as explained on this page, but cannot display the message. Could you give me a sample for both TempData and jquery.cookie by showing the necessary lines on Controller and View? Thanks in advance.
View:
<form id="frmCreate" action="Create" method="post" enctype="multipart/form-data" >
@if (TempData["message"] != null)
{
<div class="text-danger">@TempData["message"].ToString()</div>
}
//... removed for brevity
</form>
Controller:
public ActionResult Create([Bind(Exclude = null)] PersonViewModel person)
{
//Some stuff (removed for brevity)
TempData["message"] = "Record has been added...";
return PartialView("Create", person);
}
=============================== Update ===============================
View:
@model PersonViewModel
<form id="frmCreate" action="Create" method="post" enctype="multipart/form-data" >
@Html.AntiForgeryToken()
<div class="container">
@Html.ValidationSummary(true)
<div><b>Message:@ViewBag.Message</b></div>
@Html.LabelFor(m => m.ProjectID)
@(Html.Kendo().DropDownList()
.Name("ProjectID")
//... removed for brevity
)
<br />
@*Render Partialview according to Dropdownlists selectedIndex*@
<!-- Place where you will insert your partial -->
<div id="partialPlaceHolder" style="display:none;"></div>
</div>
<div class="modal-footer">
@(Html.Kendo().Button().Name("btnCancel"))
@(Html.Kendo().Button().Name("btnSubmit"))
.HtmlAttributes(new { type = "submit"})
</div>
</form>
<script type="text/javascript">
//OnLoad method & functions::::::::::
$(function () {
var selectedProjectId = $('#ProjectID').val(); /* Get the selected value of dropdownlist */
var json = JSON.stringify(@Model);
$.ajax({
type: "POST",
url: '@Url.Action("RenderPartialView", "Person")' + selectedProjectId,
contentType: "application/json; charset=utf-8",
data: json,
dataType: "json",
success: function (data) {
// get the result and do some magic with it
var message = data.Message;
$("#resultMessage").html(message);
}
});
});
//For keeping model values we use <form> instead of Html.BeginForm()
$('form').submit(function (event) {
event.preventDefault();
$.post('Person/Create', $(this).serialize()).done(function () {
}).fail(function () {
});
});
//Render Partialview according to Dropdownlist's selectedIndex
$('#ProjectID').change(function () {
var selectedProjectId = $(this).val();
$.get('/Person/RenderPartialView/' + selectedProjectId, function (data) {
$('#partialPlaceHolder').html(data);
});
});
</script>
