ASP .NET MVC 2 - How do I pass an object from View to Controller w/ Ajax? - asp.net-mvc-2

I have an object MainObject with a list of objects, SubObjects, among other things. I am trying to have the user click a link on the View to add a new SubObject to the page. However, I am unable to pass the MainObject I am working with into the Action method. The MainObject I currently receive is empty, with all its values set to null. How do I send my controller action the MainObject that was used to render the View originally?
The relevant section of the view looks like this:
<div class="editor-list" id="subObjectsList">
<%: Html.EditorFor(model => model.SubObjects, "~/Views/MainObject/EditorTemplates/SubObjectsList.ascx")%>
</div>
<%: Ajax.ActionLink("Add Ajax subObject", "AddBlanksubObjectToSubObjectsList", new AjaxOptions { UpdateTargetId = "subObjectsList", InsertionMode = InsertionMode.Replace })%>
The relevant function from the controller looks like this:
public ActionResult AddBlanksubObjectToSubObjectsList(MainObject mainobject)
{
mainobject.SubObjects.Add(new SubObject());
return PartialView("~/Views/MainObject/EditorTemplates/SubObjectsList.acsx", mainobject.SubObjects);
}

I ended up with the following:
View:
<div class="editor-list" id="subObjectsList">
<%: Html.EditorFor(model => model.SubObjects, "~/Views/MainObject/EditorTemplates/SubObjectsList.ascx")%>
</div>
<input type="button" name="addSubObject" value="Add New SubObject" onclick="AddNewSubObject('#SubObjectList')" />
Control:
public ActionResult GetNewSubObject()
{
SubObject subObject= new SubObject();
return PartialView("~/Views/TestCase/EditorTemplates/SubObject.ascx", subObject);
}
And, finally, I added this JQuery script:
function AddNewSubObject(subObjectListDiv) {
$.get("/TestCase/GetNewSubObject", function (data) {
//there is one fieldset per SubObject already in the list,
//so this is the index of the new SubObject
var index = $(subObjectListDiv + " > fieldset").size();
//the returned SubObject prefixes its field namess with "[0]."
//but MVC expects a prefix like "SubObjects[0]" -
//plus the index might not be 0, so need to fix that, too
data = data.replace(/name="\[0\]/g, 'name="SubObject[' + index + "]");
//now append the new SubObject to the list
$(subObjectListDiv).append(data);
});
}
If someone has a better way to do this than kludging the MVC syntax for nested objects onto a returned View using JQuery, please post it; I'd love to believe that there is a better way to do this. For now, I'm accepting my answer.

Related

EF4.3 linking viewbag item to viewmodel

I have the following action method in my Tournament controller:
public ActionResult Edit(int id) {
EditTournamentViewModel viewModel = new EditTournamentViewModel {
Tournament = _tournamentService.GetTournamentByID(id),
TournamentDivisions = _divisionService.GetTournamentDivisions(id).ToList()
};
ViewBag.SportID = new SelectList(_sportService.GetSports(), "SportID", "Name");
ViewBag.CountryID = new SelectList(_countryService.GetCountries(), "CountryID", "Name");
return View(viewModel);
}
The two viewbag items are select lists which will be filled up. When I inspect the page with firebug the name of the SelectList for ViewBag.SportID is SportID, which is what I would expect. But I want the value that is selected there to be entered in the SportID property of the Tournament property in my viewModel. So the name should be Tournament.SportID.
I don't understand how I can achieve this, I wasn't able to change the SelectList's name in Razor like this:
<div class="editor-field">
#Html.DropDownList("SportID", "Select a sport", new { name = "Tournament.SportID" } )
#Html.ValidationMessageFor(t => t.Tournament.Sport)
</div>
This is the code I have in my view:
<div class="editor-field">
#Html.DropDownList("SportID", "Select a sport")
#Html.ValidationMessageFor(t => t.Tournament.Sport)
</div>
A solution I could take is instead of having a Tournament property in my viewmodel, I could copy over the individual properties and then use automapper but I would like to hear if there is a fix without having to do that (unless of course what I am doing is considered very bad practice).
Did you try
#Html.DropDownListFor(m => m.Tournament.SportID, ViewBag.SportID, "Select a sport")
?
(if you need the acual value of Tournament.SportId, for an update, for example, you can just look at the different constructors of SelectList and change it in your "ViewBag creation")
CORRECTION :
SelectList sportList = ViewBag.SportID;
#Html.DropDownListFor(m => m.Tournament.SportID, sportList, "Select a sport")

Creating a generic edit view with ASP.NET, MVC, and Entity Framework

In my database, I have 40 tables that contain only an ID number and a name. My database is accessed using Entity Framework. While I have no trouble editing them each by generating a strongly-typed view and postback methods for each object, I would like to create a more generic method and view for viewing and editing these objects.
I am currently using the following code to access each object. In this case, it is for an object of 'AddressType':
public ActionMethod EditAddressType(int ID)
{
var result = database.AddressType.Single(a => a.ID == ID);
View(result);
}
[HttpPost]
public ActionMethod EditAddressType(int ID, FormCollection formValues)
{
var result = database.AddressType.Single(a => a.ID == ID);
UpdateModel(result);
database.SaveChanges();
return View("SaveSuccess");
}
The view 'EditAddressType' is strongly typed and works fine, but there's a lot of repeated code (one instance of this for each object). I've been told that I need to use reflection, but I'm at a loss for how to implement this. My understanding is that I need to retrieve the object type so I can replace the hardcoded reference to the object, but I'm not sure how to get this information from the postback.
I've had success binding the information to ViewData in the controller and passing that to a ViewPage view that knows to look for this ViewData, but I don't know how to postback the changes to a controller.
Thanks for any help you can give me!
If you are going to edit the object you don't need to refetch it from the database in your POST action. The first thing would of course be to abstract my data access code from the controller:
public class AddressesController: Controller
{
private readonly IAddressesRepository _repository;
public AddressesController(IAddressesRepository repository)
{
_repository = repository;
}
public ActionMethod Edit(int id)
{
var result = _repository.GetAddress(id);
return View(result);
}
[HttpPut]
public ActionMethod Update(AddressViewModel address)
{
_repository.Save(address);
return View("SaveSuccess");
}
}
You will notice that I have renamed some of the actions and accept verbs to make this controller a bit more RESTFul.
The associated view might look like this:
<% using (Html.BeginForm<AddressesController>(c => c.Update(null))) { %>
<%: Html.HttpMethodOverride(HttpVerbs.Put) %>
<%: Html.HiddenFor(model => model.Id) %>
<%: Html.TextBoxFor(model => model.Name) %>
<input type="submit" value="Save" />
<% } %>
As far as the implementation of this IAddressesRepository interface is concerned, that's totally up to you: Entity Framework, NHibernate, XML File, Remote Web Service call, ..., that's an implementation detail that has nothing to do with ASP.NET MVC.

How to support multiple forms that target the same Create action on the same page?

I want to have two separate forms on a single create page and one action in the controller for each form.
In the view:
<% using (Html.BeginForm()) { %>
// Contents of the first (EditorFor(Model.Product) form.
<input type="submit" />
<% } %>
<% using (Html.BeginForm()) { %>
// Contents of the second (generic input) form.
<input type="submit" />
<% } %>
In the controller:
// Empty for GET request
public ActionResult Create() {
return View(new ProductViewModel("", new Product()));
}
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Create(Product product) {
return View(new ProductViewModel("", product));
}
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Create(string genericInput) {
if (/* problems with the generic input */) {
ModelState.AddModelError("genericInput", "you donkey");
}
if (ModelState.IsValid) {
// Create a product from the generic input and add to database
return RedirectToAction("Details", "Products", new { id = product.ID });
}
return View(new ProductViewModel(genericInput, new Product()));
}
Results in "The current request for action 'MyMethod' on controller type 'MyController' is ambiguous between the following action methods" - error or the wrong Create action is called.
Solutions?
Combine those two POST Create actions
into one public ActionResult
Create(Product product, string
genericInput);
Name one of the POST Create actions differently and add the new name to the corresponding Html.BeginForm()
I have no idea what are the caveats in these. How would you solve this?
You cannot have two actions with the same name and verb that differ only with argument types. IMHO naming your two actions differently would be a good idea assuming that they perform different tasks and take different inputs.
Actually, I believe you can do this if you are more specific with your BeginForm() call.
Using(Html.BeginForm<ControllerName>(c => c.Create((Product)null)) { }
Using(Html.BeginForm<ControllerName>(c => c.Create((string)null)) { }

Where and how to load dropdownlists used in masterpage

I'm new to MVC!
I am trying to use two DropDownLists (Cities, Categories) in a PartialView that will be used in MasterPage, meaning they will be visble all the time.
I tried to load them in HomeCOntroller, but that didn't work. I got an Exception.
I read something about making a baseController that the other controllers will inherit from, I have tried that, kind of, but I guess i'm doing something wrong.
This is the only code I got today:
Masterpage
<% Html.RenderPartial("SearchForm"); %>
PartialView (SearchForm.ascx)
<% using (Html.BeginForm("Search", "Search")) { %>
<% } %> // dont know why I need two BeginForms, if I dont have this the other form won't trigger at all! Weird!
<% using (Html.BeginForm("Search", "Search", FormMethod.Get)) { %>
<%= Html.DropDownList("SearchForm.Category", new SelectList(ViewData["Categories"] as IEnumerable, "ID", "Name", "--All categories--")) %>
<%= Html.DropDownList("Search.City", Model.Cities, "--All cities--") %>
<input name="search" type="text" size="16" id="search" />
<input type="submit" id="test" title="Search" />
<% } %>
Two question:
Where and how to load the DropDownLists is the problem. I have tried to load it in the HomeController, but when go to another page then it says that the DDLs is empty and I get a Excecption.
Why do I have to use two forms for the ActionMethod to trigger ?
Hope anyone can help me out!
It sounds like you're only setting the property for a single action result. The Model.Cities data will have to be populated for every single view that needs to use it.
One solution would be to move the population of it to an ActionFilter
public class CityListAttribute : ActionFilterAttribute
{
public override void OnActionExecuted(ActionExecutedContext filterContext) {
var result = filterContext.Result as ViewResult;
result.ViewData.Model = //populate model
base.OnActionExecuted(filterContext);
}
}
and then add the filter to your controller
[CityList]
public class HomeController : Controller {
public ActionResult Index() {
return View();
}
}
As for the two forms issue, there should be no reason that i can think of that you need an empty form.
Take a look at the html that's being output and make sure it's ok. Also check the action is being generated correcly
Better way to do this, is to create something like MasterController and have action method on it like this:
[ChildActionOnly]
public ActionResult SearchForm()
{
//Get city data, category data etc., create SearchFormModel
return PartialView(model);
}
I recommend you create strongly typed view (SearchForms.ascx of type ViewUserControl<SearchFormModel>). Also it may be a good idea to have a model like this:
public class SearchViewModel
{
public IList<SelectListItem> Cities { get; set; }
public IList<SelectListItem> Categories { get; set; }
}
and use a helper like this: http://github.com/Necroskillz/NecroNetToolkit/blob/master/Source/NecroNet.Toolkit/Mvc/SelectHelper.cs to convert raw data to DDL friendly format beforehand.
In any case, you now use Html.RenderAction() instead of Html.RenderPartial() and specify you want "SearchForm" action from "MasterController".

How can I make ASP.NET MVC 2 persist submitted form values across multiple submits?

Say I have a strongly-typed view of ViewPage<Song> and some additional fields in the form of create/edit scenarios that are not directly part of the Song entity (because I have to do some parsing before I fetch the composers from a foreign table and create the bridge entities SongComposers).
public ActionResult Create(Song song, string composers) {
if (ModelState.IsValid) {
// redirect to details
}
// return a view with errors
return View(song);
}
And in the view
<% using (Html.BeginForm()) { %>
<%= Html.EditorForModel() %>
<div class="editor-label"><label for="composers">Composers</label></div>
<div class="editor-field"><input id="composers" type="text" name="composers" /></div>
<% } %>
Now when I try to create a food and get validation errors, the previously entered form values for fields in Html.EditorForModel get filled properly but the composers field is blank after a submit. How can I fix this (ie. make it so that it "remembers" what the user wrote in the composers field)?
ViewData["composers"] = composers;