I've got a View that renders a partial-view with a form. The partial view is nested inside a div container of the main View. The form is of type Ajax.BeginForm with AjaxOptions set to HttpMethod = "POST", InsertionMode = InsertionMode.Replace, UpdateTargetId
= "MyPartialDiv".
The first time I submit, it posts correctly and the PartialViewResult action returns the partial-view back to the main View. It works as it should. The problem I'm having is if I submit the form again, the partial-view is now returned to a new page. The
URL of the new page is now the PartialViewResult's action name (example: /Home/PartialViewUpdate). It's just a blank white page, but with my partial view included.
I've tried to trace why it's behaving this way with Firebug, but it doesn't show anything abnormal.
TL;DR: works properly after one submission. Re-submission sends partial view to new page.
Identical. Now, if I hit submit again, it returns the PartialView to a new blank page (no ccs, layout, etc). The only thing I'm wondering is if PartialViewResult is the proper actionresult that I want. I mean... it works the first time, so I think it's correct, but maybe it's not the right actionresult for additional submissions.
Doesn't need the Form into de DIV... delete it, the is created when the ajax.BeginForm is readed...
thy already get a post method and include on div above...
the problem is: maybe there are two forms that make the same requisition to server, one is ajax form and call a partial view into a div... the other is that form into a div... the call a partial view, but no place to store the view.. so open a new page!
That's not the issue. And yes, you need to have the Div present around the form for ajax call to replace the old form.
I just tried a different method. I cut out the InsertMode option, and instead went with OnSuccess = "submitSuccess". Then created a function in the main View's script section
function submitSuccess(result)
{
$("#MyPartialDiv").html(result);
}
First submit still works, second submit still gives new page with the partial view. Can anyone dig into this? InsertMode and the jquery .html() set produces the same results on submitting a 2nd time.
JohnLocke
Contributor
3216 Points
710 Posts
Issue with partial views and ajax submission
Feb 21, 2013 08:40 PM|LINK
I've got a View that renders a partial-view with a form. The partial view is nested inside a div container of the main View. The form is of type Ajax.BeginForm with AjaxOptions set to HttpMethod = "POST", InsertionMode = InsertionMode.Replace, UpdateTargetId = "MyPartialDiv".
The first time I submit, it posts correctly and the PartialViewResult action returns the partial-view back to the main View. It works as it should. The problem I'm having is if I submit the form again, the partial-view is now returned to a new page. The URL of the new page is now the PartialViewResult's action name (example: /Home/PartialViewUpdate). It's just a blank white page, but with my partial view included.
I've tried to trace why it's behaving this way with Firebug, but it doesn't show anything abnormal.
TL;DR: works properly after one submission. Re-submission sends partial view to new page.
RichardY
Star
8376 Points
1573 Posts
Re: Issue with partial views and ajax submission
Feb 21, 2013 09:02 PM|LINK
Hard to say without seeing your markup, but I do this all the time - so it should work.
Make certian that the MyPartialDiv is included in the Main View's markup and not the PartialView's.
JohnLocke
Contributor
3216 Points
710 Posts
Re: Issue with partial views and ajax submission
Feb 21, 2013 09:05 PM|LINK
I just left work, but will post some code tomorrow. The Div is in the main View -- that was the first thing I checked.
joelkronk@ho...
Member
639 Points
641 Posts
Re: Issue with partial views and ajax submission
Feb 21, 2013 10:02 PM|LINK
Is your HTML when you re-render the partial view exactly the same?
JohnLocke
Contributor
3216 Points
710 Posts
Re: Issue with partial views and ajax submission
Feb 22, 2013 01:43 PM|LINK
It's exactly the same according to firebug (unless it's not updating properly).
Here's a rough markup:
View --
<div id="MyPartialDiv"> @Html.Partial("MyPartialView", Model.PartialViewData) </div>Partial View --
@model MyProject.Models.PartialViewModel @using (Ajax.BeginForm("PartialViewUpdate", "Home", new AjaxOptions { HttpMethod = "POST", InsertionMode = InsertionMode.Replace, UpdateTargetId = "MyPartialDiv" })) { // some form elements <input type="submit" value="Update" /> }PartialViewResult --
[HttpPost] public PartialViewResult PartialViewUpdate(PartialViewModel model) { // do stuff return PartialView("MyPartialView", model); }Here's what firebug looks like prior to submitting --
Here's firebug after first submission --
Identical. Now, if I hit submit again, it returns the PartialView to a new blank page (no ccs, layout, etc). The only thing I'm wondering is if PartialViewResult is the proper actionresult that I want. I mean... it works the first time, so I think it's correct, but maybe it's not the right actionresult for additional submissions.
edit: I do have
in my main View... is this something I should also include in the Partial? That seems clunky to me.
joeyneto90
Member
4 Points
3 Posts
Re: Issue with partial views and ajax submission
Feb 22, 2013 03:05 PM|LINK
Doesn't need the Form into de DIV... delete it, the is created when the ajax.BeginForm is readed...
thy already get a post method and include on div above...
the problem is: maybe there are two forms that make the same requisition to server, one is ajax form and call a partial view into a div... the other is that form into a div... the call a partial view, but no place to store the view.. so open a new page!
JohnLocke
Contributor
3216 Points
710 Posts
Re: Issue with partial views and ajax submission
Feb 22, 2013 03:29 PM|LINK
That's not the issue. And yes, you need to have the Div present around the form for ajax call to replace the old form.
I just tried a different method. I cut out the InsertMode option, and instead went with OnSuccess = "submitSuccess". Then created a function in the main View's script section
function submitSuccess(result) { $("#MyPartialDiv").html(result); }First submit still works, second submit still gives new page with the partial view. Can anyone dig into this? InsertMode and the jquery .html() set produces the same results on submitting a 2nd time.
ossprologix
Member
392 Points
127 Posts
Re: Issue with partial views and ajax submission
Feb 22, 2013 06:55 PM|LINK
I tried ur rough markup, it works fine. I am able to ajax submit form multiple times and it stays as desired.
Are there any codes which is related to form submission?? any event bindings after ajax success?
JohnLocke
Contributor
3216 Points
710 Posts
Re: Issue with partial views and ajax submission
Feb 22, 2013 07:48 PM|LINK
Absolutely nothing touches the form's submission. Is PartialViewResult the proper action class I want to use?
I may change to Html.BeginForm and use some unobtrusive jquery to submit, return result, and .html set to my div.
Or I may just re-do the whole View from scratch. I'll bump this thread Monday with results.
ossprologix
Member
392 Points
127 Posts
Re: Issue with partial views and ajax submission
Feb 23, 2013 02:36 AM|LINK
Yes
http://malsup.com/jquery/form/
is jquery form plugin.
If you cud find out what was the glitch in ur code wud be gr8.