11

I have a view (Index.cshtml) with a grid (Infragistics JQuery grid) with an imagelink. If a user clicks on this link the following jquery function will be called:

function ConfirmSettingEnddateRemarkToYesterday(remarkID) { //Some code... //Call to action. $.post("Home/SetEnddateRemarkToYesterday", { remarkID: remarkID }, function (result) { //alert('Succes: ' + remarkID); //window.location.reload(); //$('#remarksgrid').html(result); }); }

Commented out you can see an alert for myself and 2 attempts to refresh the view. The location.reload() works, but is basically too much work for the browser. The .html(result) posts the entire index.cshtml + Layout.cshtml double in the remarksgrid div. So that is not correct.

This is the action it calls (SetEnddateRemarkToYesterday):

 public ActionResult SetEnddateRemarkToYesterday(int remarkID) { //Some logic to persist the change to DB. return RedirectToAction("Index"); }

This is the action it redirects to:

[HttpGet] public ActionResult Index() { //Some code to retrieve updated remarks. //Remarks is pseudo for List<Of Remark> return View(Remarks); }

If I don't do window.location.reload after the succesfull AJAX post the view will never reload. I'm new to MVC, but i'm sure there's a better way to do this. I'm not understanding something fundamental here. Perhaps a nudge in the right direction? Thank you in advance.

Improve this question
2
  • Better to make remarksgrid a partial view and return a partial view result in SetEnddateRemarkToYesterday method. Commented Jul 19, 2013 at 10:46
  • @ssilas777 You are right. I realized that the day after I posted this, which is the solution I went for. Thank you for replying. Commented Jul 22, 2013 at 7:21

4 Answers 4

Reset to default
19

As you requesting AJAX call, you should redirect using its response

Modify your controller to return JSONResult with landing url:

public ActionResult SetEnddateRemarkToYesterday(int remarkID) { //Some logic to persist the change to DB. var redirectUrl = new UrlHelper(Request.RequestContext).Action("Index", "Controller"); return Json(new { Url = redirectUrl }); }

JS Call:

$.post("Home/SetEnddateRemarkToYesterday", { remarkID: remarkID }, function (result) { window.location.href = result.Url });
Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

Tested it. Works as Satpal suggests. In the end I went for putting the grid on a partial view though. It seems more in line with the MVC architecture to me. Thanks for replying Satpal.
4

After Ajax post you need to call to specific Url.. like this.. window.location.href = Url

Improve this answer

Comments

0

When using jQuery.post the new page is returned via the .done method

jQuery

jQuery.post("Controller/Action", { d1: "test", d2: "test" }) .done(function (data) { jQuery('#reload').html(data); });

HTML

<body id="reload">
Improve this answer

Comments

0

For me this works. First, I created id="reload" in my form and then using the solution provided by Colin and using Ajax sent data to controller and refreshed my form.

That looks my controller:

[Authorize(Roles = "User")] [HttpGet] public IActionResult Action() { var model = _service.Get()...; return View(model); } [Authorize(Roles = "User")] [HttpPost] public IActionResult Action(object someData) { var model = _service.Get()...; return View(model); }

View:

<form id="reload" asp-action="Action" asp-controller="Controller" method="post"> . . . </form>

Javascript function and inside this function I added this block:

$.ajax({ url: "/Controller/Action", type: 'POST', data: { __RequestVerificationToken: token, // if you are using identity User someData: someData }, success: function (data) { console.log("Success") console.log(data); var parser = new DOMParser(); var htmlDoc = parser.parseFromString(data, 'text/html'); // parse result (type string format HTML) console.log(htmlDoc); var form = htmlDoc.getElementById('reload'); // get my form to refresh console.log(form); jQuery('#reload').html(form); // refresh form }, error: function (error) { console.log("error is " + error); } });
Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.