UPDATE:
My model going into the save method is PartialViewModel, which in the save method, is pushed into the index's ContactViewModel and sent back. This wasn't clear.
I am playing around with MVC3, and have a contact controller with a SaveDetails action. The index cshtml has a partial with a form whose action is pointing to this controller.
When I submit the form not having completed it fully, thereby firing the validation, the url now contains the SaveDetails action name (http://localhost:7401/Contact/SaveDetails).
The form code is:
#using (Html.BeginForm("SaveDetails", "Contact")) {
...
}
The controller action looks like this:
public ActionResult SaveDetails(Models.PartialsViewModel pvm)
{
return View("Index", new ContactViewModel{ PartialsViewModel = pvm } );
}
What am I doing wrong?
The form has the action attribute set to SaveDetails action, so after submit it redirects the browser to this action.
I don' think you are doing anything wrong but I don't think you are able to do what you are tying to achieve. A request has to go somewhere and in mvc the url is used to identify which action you want to perform. If you are not submitting a post back then the url is going to change.
One way to submit the forms to different actions would be using some ajax.
Submitting the form is a POST. You can use an attribute to identify what request method an action should respond to. This means that you can create another action also called Index but give it the [HttpPost] attribute.
[HttpPost]
public ActionResult Index(Models.ContactViewModel cvm)
{
return View();
}
This way it won't display the action in the url.
Related
I have a list, select a record, press the edit button and get an update view (form) via ajax. Then I modify some property and press save. This form is used both for creating and updating data. I distinguish in the view via ViewBag, like this:
<form asp-action=#(ViewBag.Mode == "new" ? "AddSender" : "UpdateSender") asp-controller="Sender" method="post">
In the ajax call I get the properties of the edited model with this url: /MasterData/Sender/UpdateSender/3 (3 is here only an example). Now, when I save and post back the data, the update action doesn't get hit, because the html getting for the update view looks like this:
<form method="post" action="/MasterData/Sender/UpdateSender/3">
The question is, why is the action method like this? Why is the earlier get url used? I thought, it should be just UpdateSender, as intended.
To be complete, here are the related actions in this order:
[Route("{SenderId}")]
public IActionResult UpdateSender(long SenderId)
{
ViewBag.Mode = "update";
return PartialView("Sender", SenderRepository.GetSender(SenderId));
}
[HttpPost]
public IActionResult UpdateSender(Sender Sender)
{
SenderRepository.UpdateSender(Sender);
return RedirectToAction(nameof(List));
}
And I have on the top of the controller class this attribute: [Route("MasterData/[controller]/[action]")]
The POST action needs to have a route as well if the intention is to use attribute routing.
Add the Route attribute on your [HttpPost] action.
[HttpPost]
[Route("UpdateSender")]
public IActionResult UpdateSender(Sender Sender)
{
SenderRepository.UpdateSender(Sender);
return RedirectToAction(nameof(List));
}
I have a link and search button. Clicking on search button posts the page to a predefined action. Now clicking on a link should post the page to another action and should post all the values hidden varible values to another action. Can it be done.
Typically A link will generate an anchor tag and it usually gives you an HTTP GET request. Not the post request. You can supply parameters in your link which will be accepted as the parameters of the action method
#Html.ActionLink("Search","Search","Items",new { #id="nokia" },null);
This will generate a link with a querystring key called id with value nokia.
../Items/Search/nokia
or
../Items/Search?id=nokia
And your action method with id parameter can handle this GET request
public ActionResult Search(string id)
{
//Do whatever you want to do with the value in id. return a view with results
}
IF you really want to do an HTTPPost from a link, You can grab the click event of the link in the javascript and make an httppost call. The below script does that with jQuery library.
$(function(){
$("a").click(function(e){
e.preventDefault();
$.post($(this).attr("href"),function(result){
//do whatever with the results
});
});
});
But make sure you have an HttpPost version of the ActionMethod in your controller to handle this request
[HttpPost]
public ActionResult Search(string id)
{
//This is a POST request.Do whatever you want to do with the value in id. return a view with results
}
You can't use #Html.ActionLink for HTTP POST (edited: unless you use javascript function to submit the form via specifying onClick HtmlAttribute) . You can use submit buttons instead and style them as hyperlinks using jQuery. In this case you should be able to post your model with whatever values.
Alternatively you can use #Ajax.ActionLink and specify AjaxOptions { HttpMethod = "POST" }
I am trying to use a simple form with only a text field to get some information that will be used in an action method to redirect to a different action method. Here's the context:
I have a route mapped in my global.asax.cs file which prints "moo" the given amount of times. For example, if you typed "www.cows.com/Moo8", "Moo" would be printed 8 times. The number is arbitrary and will print however many "Moo"s as the number in the URL. I also have a form on the homepage set up as follows:
#using (Html.BeginForm("Moo", "Web"))
{
<text>How many times do you want to moo?</text>
<input type="text" name="mooNumber" />
<input type="submit" value="Moo!" />
}
The number submitted in the form should be sent to the action method "Moo" in the "Web" controller (WebController.cs):
[HttpPost]
public ActionResult Moo(int mooNumber)
{
Console.WriteLine(mooNumber);
return RedirectToAction("ExtendedMoo", new { mooMultiplier = mooNumber });
}
Finally, the "Moo" action method should send me back to the original "www.cows.com/Moo8" page; as you can see above I simply used an already existing action method "ExtendedMoo":
public ViewResult ExtendedMoo(int mooMultiplier)
{
ViewBag.MooMultiplier = RouteData.Values["mooMultiplier"];
return View();
}
How can I access the value submitted in my form and use it in the last call to "ExtendedMoo"?
Refer to this post or this, you might get some idea how routing works. Something is wrong with "www.cows.com/Moo8", try to find it out. Hint "{controller}/{action}/{parameter_or_id}"
Instead of RedirectToAction, use Redirect and create the Url.
This should do the trick:
return Redirect(Url.RouteUrl(new { controller = "Web", action = "ExtendedMoo", mooMultiplier = mooNumber }));
I hope i helps.
Oh wow. Turns out that form was on my Homepage, so instead of using "Moo" as the action method, I needed to override the "Homepage" action method with a [HttpPost] annotation over THAT one. Didn't realize that forms submitted to the page they were rendered from - that was a really useful piece of information in solving this problem!
Thanks all for your attempts at helping out!
If I understood right
You can you use form Collection to get the value from textbox.
Make Sure the input tag has both id and name properties mentioned otherwise it wont be available in form collection.
[HttpPost]
public ActionResult Moo(int mooNumber, **formcollection fc**)
{
**string textBoxVal= fc.getvalue("mooNumber").AttemptedValue;**
Console.WriteLine(mooNumber);
return RedirectToAction("ExtendedMoo", new { mooMultiplier = mooNumber });
}
I am using the Wizard control described in http://afana.me/post/create-wizard-in-aspnet-mvc-3.aspx
It works great, but I need to have Multiple HttpPost within the same Controller. In my scenario, I need to add to a collection before moving to next step. In the partial view for that step. I have following set up:
#using (Html.BeginForm("AddJobExperience", "Candidate"))
{
<input type="submit" value="Add Experience" />
}
When I press the Add Experience input, it is routed to the
[HttpPost, ActionName("Index")]
public ActionResult Index(CandidateViewModel viewModel)
{
}
instead of
[HttpPost, ActionName("AddJobExperience")]
public ActionResult AddJobExperience(CandidateViewModel col)
{
}
what am I doing wrong?
It sounds like you need to break up your CandidateViewModel into separate ViewModels and your big Wizard View into separate Views so that there is one per action for each step of the wizard.
Step one they add the job experience, so have a view, viewmodel and an action for that, Step two they do whatever else and you have a separate view, viewmodel and action for that as well. etc, etc
Breaking up your CandidateViewModel into separate ViewModels will mean that you can just focus on the data required for that step, and can add the validation, then when they click submit, it posts the data to the next step.
Then, when you want to improve the UI behaviour, add some AJAX, and maybe use something like JQuery UI Tabs to make it behave more like a wizard in a desktop app.
It sounds like you still have nested forms. Don't do this, it is not valid HTML.
You have 2 options here, depending on what you are trying to achieve. If you want to post your job experiences separately one at a time, then put them in their own #using(Html.BeginForms, but don't nest them in an outer form. When a user clicks the Add Experience button, do your work on that one experience and then return a new view to the user.
If you want to post all of the job experiences at the same time, then wrap all of them in a single #using(Html.BeginForm and do not put #using(Html.BeginForm in your partial views. See another question I answered here for more info on how to post a collection of items in a single HTTP POST.
The 2nd method is what it sounds like you are trying to achieve, and for this, you should probably use AJAX to add multiple job experiences to your collection without doing a full postback. You can then do 1 HTTP POST to submit all job experiences in the collection to your wizard controller. It's not very difficult to implement a feature like this:
Given I can see the Add Experience button
When I click the Add Experience button
Then I should see a new experience partial view with input fields
And I should enter data in these fields
When I click the Add Experience button a second time
Then I should see another new experience partial view with input fields
And I should enter data in these fields
When I click the Add Experience button a third time
Then I should see a third new experience partial view with input fields
And I should enter data in these fields
When I click the Next button in the wizard
Then my controller will receive data for all 3 experiences I submitted in a single form
you need to use ActionMethodSelectorAttribute or ActionNameSelectorAttribute which allow to add new attribute on action to call different action on respective of button click
In View:
#using (Html.BeginForm())
{
<input type="submit" value="Add Experience" name="AddExperience" />
<input type="submit" value="Add Experience" name="AddJobExperience" />
}
add new class FormValueRequiredAttribute in application which extend ActionMethodSelectorAttribute class to check on which button is clicked
//controller/FormValueRequiredAttribute.cs
public class FormValueRequiredAttribute : ActionMethodSelectorAttribute
{
public string ButtonName { get; set; }
public override bool IsValidForRequest(ControllerContext controllerContext, MethodInfo methodInfo)
{
var req = controllerContext.RequestContext.HttpContext.Request;
return !string.IsNullOrEmpty(req.Form[this.ButtonName]);
}
}
then you should add this attribute on action to call corresponding action
In Controller
[HttpPost]
[FormValueRequired(ButtonName = "AddExperience")]
public ActionResult Index(CandidateViewModel viewModel)
{
return View();
}
[HttpPost]
[ActionName("Index")]
[FormValueRequired(ButtonName = "AddJobExperience")]
public ActionResult AddJobExperience_Index(CandidateViewModel viewModel)
{
return View();
}
Note if your Html.BeginForm method in Index.cshtml then you don't need specify ActionName attribute on Index Action, now AddJobExperience_Index act same as Index Action.
I'm looking into using partial views in MVC3 using Razor, and I get my partial view to render and it works fine.
What I'd like to do, though, is refresh the parent view when the partial view is submitted.
Code in my parent view to render partial view
<div id="mydiv">
#{ Html.RenderAction("Add", "Request"); }
</div>
Action for parent view is simple,
public ActionResult Index()
{
List<obj> reqs = //some query
return View(reqs);
}
In my partial view's get action I have:
public ActionResult Add()
{
AddRequestViewModel vm = new AddRequestViewModel();
//set some stuff on the VM here
return PartialView(vm);
}
In the post action called by the partial view, if modelstate isn't valid, return PartialView(vm)
If it is valid, I'd like the parent and partial views to refresh.
I tried RedirectToAction, but this can't be called in an action called by a partial, apparently, and I tried return Index();, but this causes an issue with the code used to render the partial view,
Exception Details: System.InvalidOperationException: The model item passed into the dictionary is of type 'System.Collections.Generic.List'1[DatRequests.Models.ReqRequest]', but this dictionary requires a model item of type 'DatRequests.ViewModels.AddRequestViewModel'.
Any suggestions on how to do this would be appreciated. The purpose of the page is to show a list of elements, and the partial contains a form to add a new element to the list.
Edit: The partial's model is different, as it contains data for selection, which is from a db, which is why I tried RenderAction, but I'm not sure if there are other ways of doing this.
When the partial view is submitted normally you submit it to some controller action. You could either submit it using a normal request or an AJAX request. If you use a normal request you could perform a standard redirect to the Index inside the POST controller action that will handle the form submission. If you use AJAX, you could return a JSON result pointing to the url that you want to redirect:
[HttpPost]
public ActionResult Foo(MyViewModel model)
{
if (!ModelState.IsValid)
{
return PartialView(model);
}
return Json(new { url = Url.Action("Index") });
}
and inside your AJAX success callback:
success: function(result) {
if (result.url) {
// we have a success
window.location.href = result.url;
} else {
// invalid modelstate => refresh the partial
$('#mydiv').html(result);
}
}
Probably RenderAction should not be used this way.
When using Html.RenderAction, a new/seperate request would be sent to the server. And you got another chance to load some data from db or somewhere else to display to the client. Also, you could apply OutputCache to this action. this is usually the way doing global cache.
Here you are doing a POST to the server. Either directly put a element here or using a partial view to do the Post. And in the corresponding action, do a RedirectToAction.
Do it with ajax or not isn't the point. my opinion is more about the right way using RenderAction