Why won't Ajax.BeginForm replace div? - asp.net

I'm using jquery popup overlay (http://dev.vast.com/jquery-popup-overlay/) to display the contents of the Credit action (shown below).
With the code shown below, I am expecting the fields in the popup to be cleared since I am returning the partial view with a newly created model with no values set; however the fields are not updated at all.
The crazy thing is, if I comment out the "return PartialView(model);" statement and uncomment the "return Json("Yay it worked!");" then the popup gets replaced with "Yay it worked!". (Yes, I also have to change the return type of the action when I uncomment that line).
Why would Ajax.BeginForm have no problem replacing the target div with the text of a Json return value, but totally ignore the results of a PartialViewResult?
public PartialViewResult Credit()
{
CreditPaymentModel model = new CreditPaymentModel();
return PartialView(model);
}
[HttpPost, ValidateAntiForgeryToken]
[OutputCache(NoStore = true, Duration = 0, VaryByParam = "None")]
public PartialViewResult Credit(CreditPaymentModel model) {
model = new CreditPaymentModel(); // breakpoint here
return PartialView(model);
//return Json("Yay it worked!");
}
EDIT: I just added a function to process the OnSuccess event. I can step through the view as it's being processed (after submitting and it returns the view with an empty model) and verify that the values are in fact null, however when it gets to the OnSuccess method the data it receives shows the original data that was submitted rather than the blank values I'm expecting. Normally I would expect this to be due to caching, but I have an OutputCache attribute over the Credit action and I have set the AllowCache property to false in the AjaxOptions so I don't understand how this could be happening?!

The HtmlHelper methods your using in your partial view form use values from ModelState rather than from your model if they exist, which in your case they do because your POST method has a parameter which is typeof CreditPaymentModel and each value of CreditPaymentModel has been added to ModelState by the DefaultModelBinder.
You would need to use ModelState.Clear; before you return the model if you want to display the default values for CreditPaymentModel. For a more detailed explanation of the behavior, refer TextBoxFor displaying initial value, not the value updated from code.
Note however, because your returning a new partial, all client side validation will be lost unless you re-parse the $.validator (refer this answer for an example). All this will be easier is you use the $.ajax() method which gives far more flexibility, and in your case, have the method returns the partial is ModelState is invalid and you want to display validation errors, or return null otherwise. In the ajax success callback, if the result is null, just reset the existing form controls, otherwise replace the partial and re-parse the $.validator.

Related

View Model value did not set to #Html.HiddenFor [duplicate]

This question already has answers here:
Reset the value of textarea after form submission
(9 answers)
Closed 8 years ago.
I have an MVC application that displays a value. This is the controller:
public ActionResult Index(DataSites DataSiteList)
{
if (DataSiteList.Latitude != null)
{
DataSites test = new DataSites();
test.Latitude = "LATITUDE";
return View(test);
}
return View(DataSiteList);
}
public ActionResult SomeInformation()
{
DataSites test1 = new DataSites();
test1.Latitude = "LATITUDE2";
return RedirectToAction("Index", test1);
}
The View:
#model miniproj2.Models.DataSites
<p>
#Html.TextBoxFor(x => x.Latitude)
</p>
And the Model:
public class DataSites
{
public string Latitude { get; set; }
}
When I go to /Home/SomeInformation, the DataSites' Latitude property is set to "LATITUDE2". Then redirects to the Index() action in the controler, sets the property to "LATITUDE" and returns the view.
When it shows the view, it displays the value "LATITUDE2" as set in the redirect. Shouldn't "LATITUDE" be displayed?
Your problem is (step by step)
Your SomeInformation() method sets the value of test1.Latitude
to "LATITUDE2".
You then pass that model to your Index() method using the overload
of RedirectToAction that accepts an object. Internally this uses
reflection to build a RouteValueDictionary based on the properties
of your model (in this case its simply latitude="LATITUDE2").
When you hit the Index method the model is bound by the DefaultModelBinder and now the value of DataSiteList.Latitude is "LATITUDE2" (which is why you enter
the if block)
In the process of binding, the DefaultModelBinder sets the
ModelStatevalue of Latitude to "LATITUDE2". Any attempts to set
the value of Latitude are now ignored because the view uses
ModelState value to render the control.
It not clear what your trying to do here. You can make it work as you expect by adding ModelState.Clear(); as the first line of your Index() method. This clears all existing ModelState values an you can now set the value to "LATITUDE".
But your if block makes no sense. Perhaps you were just doing some kind of test, but you may as well remove the parameter from the Index() method and just initialize a new instance of DataSites in the method.
Edit
To give a bit more information as to why updating a model property has no affect once ModelState has been set.
Imagine you have a form to collect user information where the model contains int Age. The user is asked to enter their age and someone enters "I'm five next week!". Of course this wont bind to an int so the DefaultModelBinder adds the value (the attemptedValue) and adds a ModelStateError.
When the view is returned it will typically display an error message such as "The field Age must be a number". If the html helper rendering the control used the model value, then it would display "0" (the default value for int). It would be somewhat confusing for the user to see "0" in the textbox and next it a message saying it must be a number (What! but zero is a number and what the heck happened to what I entered?). So instead, the helper uses the value from ModelState and now the users sees "I'm five next week!" and an associated error message that makes sense for the value.
So even though you thoughts were that "its not logical", there is actually some logic to this behavior.
You are not setting Altitude. It will be null so the code will never go into this block and set Lattitude to "LATTITUDE"
if (DataSiteList.Altitude != null)
{
DataSites test = new DataSites();
test.Latitude = "LATITUDE";
return View(test);
}

ASP.NET Core: asp-* attributes use request payload over model?

It seems that in ASP.NET Core, the value in asp-* attributes (e.g. asp-for) is taken from the request payload before the model. Example:
Post this value:
MyProperty="User entered value."
To this action:
[HttpPost]
public IActionResult Foo(MyModel m)
{
m.MyProperty = "Change it to this!";
return View();
}
OR this action
[HttpPost]
public IActionResult Foo(MyModel m)
{
m.MyProperty = "Change it to this!";
return View(m);
}
View renders this:
<input asp-for="MyProperty" />
The value in the form input is User entered value. and not Change it to this!.
First of all, I'm surprised that we don't need to pass the model to the view and it works. Secondly, I'm shocked that the request payload takes precedence over the model that's passed into the view. Anyone know what the rationale is for this design decision? Is there a way to override the user entered value when using asp-for attributes?
I believe this is the expected behavior/by design. Because when you submit the form, the form data will be stored to ModelState dictionary and when razor renders your form elements, it will use the values from the Model state dictionary. That is why you are seeing your form element values even when you are not passing an object of your view model to the View() method.
If you want to update the input values, you need to explcitly clear the Model state dictionary. You can use ModelState.Clear() method to do so.
[HttpPost]
public IActionResult Create(YourviewModel model)
{
ModelState.Clear();
model.YourProperty = "New Value";
return View(model);
}
The reason it uses Model state dictionary to render the form element values is to support use cases like, showing the previously submitted values in the form when there is a validation error occurs.
EDIT : I found a link to the official github repo of aspnet mvc where this is confirmed by Eilon (asp.net team member)
https://github.com/aspnet/Mvc/issues/4486#issuecomment-210603605
I can confirm your observation. What's really going to blow your mind is that this:
[HttpPost]
public IActionResult Foo (MyModel m)
{
m.MyProperty = "changed";
var result = new MyModel { MyProperty = "changed" };
return View(result);
}
...gives you the same result.
I think you should log a bug: https://github.com/aspnet/mvc/issues
Edit: I now remember this issue from previous encounters myself and concede that it isn't necessarily a bug, but rather an unintended consequence. The reasons for the result of executing this code is not obvious. There likely isn't a non-trivial way to surface a warning about this, but PRG is a good pattern to follow.

Why is it that when I pass a Model to my .Net MVC 4 Controller Action it insists on using it in the Partial Update?

I am intending to pass a Hotel model to my Controller Action - Do some checks/processing on it, then return a potentially different Hotel model rendered in a Partial View.
The problem I'm getting is that if I pass the oHotelParameter Model to the Action then the PartialView uses the model passed to the Action instead of the one passed to the PartialView method.
If I remove the oHotelParameter Parameter from the Action then the View is Rendered as expected using oHotel.
public ActionResult _SaveMasterDetails(Hotel oHotelParameter)
{
//Do some processing on oHotelParameter
//........
Hotel oHotel = new Hotel();
oHotel.GetHotelInfoById(14); //This gets a different Hotel object just for a test
//For some reason oHotel is ignored and oHotelParameter is used instead unless I remove oHotelParameter
return PartialView("_MasterDetails", oHotel);
}
When I debug the View I see that the Model is set to the value I pass to PartialView (oHotel), yet the result I see coming back from the Action contains data from the oHotelParameter object.
In case it makes a difference, I am calling the Action from jQuery ajax.
Can anyone explain why this should happen?
when mvc handles a form post, it fills the ModelState object with the details of the model.
This is when used when the view is rendered again from the post action, this is incase you have thrown the view back out because it has failed validation.
If you want to pass out a new model and not use the view state, then you can call ModelState.Clear() before returning the view and that should let you rebind the view to the new model.
I think that it would help if you had a better understanding of how model binding works when you post back to an action method. In most cases, it is unecessary and inefficient to pass a view model as a parameter to a POST action method. What you are doing is loading the view model into memory twice when you pass your view model as a parameter (assuming a strongly typed view). When you do a post back the model becomes part of the form collection (through model binding) in the request object in the BaseController class that every controller inherits from. All that you need to do is to extract the model from the Form collection in the Request object in the BaseController. It just so happens that there is a handy method, TryUpdateModel to help you do this. Here is how you do it
[POST]
public ActionResult Save()
{
var saveVm = new SaveViewModel();
// TryUpdateModel automatically populates your ViewModel!
// TryUpdateModel also calls ModelState.IsValid and returns
// true if your model is valid (validation attributes etc.)
if (TryUpdateModel(saveVm)
{
// do some work
int id = 1;
var anotherSaveVm = GetSaveVmBySomeId(id);
// do more work with saveVm and anotherSaveVm
// clear the existing model
ModelState.Clear();
return View(anotherSaveVm);
}
// return origonal view model so that the user can correct their errors
return View(saveVm);
}
I think that the data in the form collection contained in the request object is being returned with the view. When you pass the model back to the post action method as a parameter, I believe it is passed in the query string (see Request.QueryString). Most of the time, it is best to only pass one or two primitive type parameters or primitive reverence types such as int? to an action method. There is no need to pass the entire model as it is already contained in the Form collection of the Request object. If you wish to examine the QueryString, seee Request.QueryString.

asp.net mvc Serverside validation no return data

I'm building a validation form in my application. In that form there are two buttons. One to accept and one to reject. When the user press reject the rejection reason field must be provided. I check this serverside.
I first check what button is pressed and then if the field is empty I add a moddel error to the modelstate. But, because all fields in the form are readonly, those are not posted back to the server and therefor when I return the view back to usern there is no data. I'm probably missing something obvious, but cant find what to do. (I know I can make all fields in my form hidden, but due to the large amount of fields this would be really ugly)
This is my code.
[HttpPost]
public virtual ActionResult Validate(string action, Record dto) {
if(action == Global.Accept) {
ciService.Store(dto);
return RedirectToAction("Index", "Ci");
} else {
if(string.IsNullOrEmpty(dto.RejectionReason)) {
ModelState.AddModelError("RejectionReason", "REQUIRED!!!!");
return View("Validate", dto);
}
ciService.Reject(dto);
return RedirectToAction("Index", "Ci");
}
}
You need to recreate the model from the database and then change it to match whatever changes are posted in dto. Then use that combined model in the view.
Instead of passing the DTO back from the browser, I would use a hidden HTML field or a querystring parameter containing the ID that identifies the DTO. Then your POST action method would look something like:
[HttpPost]
public virtual ActionResult Validate(string action, int id)
{
// reload the DTO using the id
// now you have all the data, so just process as you did in your question
if (action == Global.Accept) { ... }
...
}
Your GET method might look something like the following then...
[HttpGet]
public virtual ActionResult Validate(int id)
{
// load the DTO and return it to the view
return View();
}
In this way you have all the data you need within your POST action method to do whatever you need.
You need to have hidden fields corresponding to each property displayed in UI.
e.g.,
#Html.LabelFor(m=>m.MyProperty) - For Display
#Html.Hiddenfor(m=>m.MyProperty) - ToPostback the value to server
If I understand right, the problem is because you don't use input.
To solve your problem insert some input hidden in your form with the value you need to be passed to the controller
#Html.HiddenFor(model => model.Myfield1)
#Html.HiddenFor(model => model.Myfield2)
that should fix the values not passed back to your actions
If you don't need these fields on the server side, simply create a new ViewModel
RecordValidateViewModel and this contains only the fields in it that need to be validated. The model binder will populate then and you will have validation only on the fields in that model rather than all the other fields you don't seem to want there.
If you need them to validate, then post them back to the server. Its not 'ugly' if hidden.

Prevent value to be preserved in ModelState

Good day!
ASP.NET MVC makes a good job by storing values of inputs during GET/POST cycle inside ModelState and automagically putting them into inputs in case of validation errors.
But on my form I have CAPTCHA field which shouldn't be preserved during validation errors (CAPTCHA value is regenerated on each request).
I've tried to achieve this by setting
if (TryUpdateModel(model))
{
// ...
}
else
{
ModelState.Remove("CaptchaValue"); // ModelState does have CaptchaValue
return View(model); // CaptchaValue is empty in model
}
But it doesn't work.
May be there is an attribute which I can apply to my model field to prevent it from preserve in ModelState?
Thanks in advance!
You can use the bind attribute on the action parameter to control model binding behaviour:
public ActionResult YourActionName([Bind(Exclude = "CaptchaValue")]ModelType model)
I've found this in nearby thread MVC - How to change the value of a textbox in a post?:
ModelState.SetModelValue("CaptchaValue", new ValueProviderResult(String.Empty, String.Empty, System.Threading.Thread.CurrentThread.CurrentCulture));
But it seems to be a bit ugly.

Resources