Posting Back DropDownList à partir d'une vue fortement typée
Ceci est lié à une question précédente sur la liaison d'une liste déroulante à partir d'une base de données. La liste déroulante est liée et remplie mais renvoie une erreur "Référence d'objet non définie à une instance d'un objet" dans le navigateur lors de la soumission du formulaire.
Lors du débogage, j'ai ajouté une surveillance rapide sur le paramètre m => m.SelectedDepartment de la méthode d'assistance Html.DropDownListFor (...) et j'ai obtenu: "Impossible de convertir l'expression lambda en type 'objet' car ce n'est pas un type de délégué" .
Vue:
@model BudgetDemo.Models.BudgetsActualsViewModel
@using (Html.BeginForm("GetBudgetsActuals", "BudgetsActuals", FormMethod.Post))
{
@Html.DropDownListFor(m => m.SelectedDepartment, Model.Departments,
"Select Department", new { @class = "form-control" })
}
VoirModèle:
public class BudgetsActualsViewModel
{
[Display(Name = "Cost Center/Department")]
[Required(ErrorMessage = "Cost Center/Department is required.")]
[StringLength(62)]
public string SelectedDepartment { get; set; }
public List<SelectListItem> Departments { get; set; }
}
Manette:
// GET: Render view with dropdowns
public ActionResult GetBudgetsActuals()
{
repo = new BudgetDemoRepository();
ModelState.Clear();
try
{
return View(repo.GetBudgetsActuals());
}
catch
{
return View("Error");
}
}
Dépôt:
public BudgetsActualsViewModel GetBudgetsActuals()
{
...
BudgetsActualsViewModel budgetsActuals = new BudgetsActualsViewModel()
{ Departments = new List<SelectListItem>() };
// Query returning correct data from DB here
for (int i = 0; i < ds.Tables[0].Rows.Count; i++)
{
budgetsActuals.Departments.Add(
new SelectListItem
{
Text = ds.Tables[0].Rows[i]["Department"].ToString(),
Value = ds.Tables[0].Rows[i]["ListValue"].ToString()
}
);
}
return budgetsActuals;
}
METTRE À JOUR
Ça marche maintenant. Le code suivant a été mis à jour / ajouté pour obtenir le rendu du formulaire après une publication avec un message de réussite contenant la valeur du service sélectionné.
Vue:
@model BudgetDemo.Models.BudgetsActualsViewModel
@Html.AntiForgeryToken()
@using (Html.BeginForm("GetBudgetsActuals", "BudgetsActuals",
FormMethod.Post))
{
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
@if (TempData["SuccessMessage"] != null)
{
<p class="alert alert-success"
id="successMessage">@TempData["SuccessMessage"]</p>
}
@Html.DropDownListFor(m => m.SelectedDepartment, Model.Departments,
"Select Department", new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.SelectedDepartment, "",
new { @class = "text-danger" })
}
Contrôleurs:
// GET
public ActionResult GetBudgetsActuals()
{
Populate Department dropdown from DB and Year dropdown (static) here
repo = new BudgetDemoRepository();
//ModelState.Clear();
try
{
return View(repo.GetBudgetsActuals());
}
catch
{
return View("Error");
}
}
// POST
[HttpPost]
public ActionResult GetBudgetsActuals(BudgetsActualsViewModel model)
{
try
{
repo = new BudgetDemoRepository();
if (ModelState.IsValid)
{
TempData["SuccessMessage"] = "Value of SelectedDepartment is: "
+ model.SelectedDepartment;
return View(repo.GetBudgetsActuals(model));
}
else
{
model.Departments = repo.GetBudgetsActuals().Departments;
return View(model);
}
}
catch
{
return View("Error");
}
}
Référentiel - Nouvelle méthode surchargée pour gérer POST
public BudgetsActualsViewModel GetBudgetsActuals(BudgetsActualsViewModel model)
{
....
// Get the data again
....
budgetsActuals.SelectedDepartment = model.SelectedDepartment;
for (int i = 0; i < ds.Tables[0].Rows.Count; i++)
{
budgetsActuals.Departments.Add(
new SelectListItem
{
Text = ds.Tables[0].Rows[i]["Department"].ToString(),
Value = ds.Tables[0].Rows[i]["ListValue"].ToString()
}
);
}
return budgetsActuals;
}
Réponses
Modifiez le controller
pour avoir une nouvelle API prenant en charge un POST
appel. Faites comme suit.
Ajoutez à cette méthode une méthode get qui est appelée lorsque la vue est chargée, comme ceci:
[HttpGet]
public ActionResult GetBudgetsActuals()
{
repo = new BudgetDemoRepository();
ModelState.Clear();
try
{
return View(repo.GetBudgetsActuals());
}
catch
{
return View("Error");
}
}
Ajoutez une méthode de publication qui est appelée lorsque le formulaire est soumis:
[HttpPost] // Decorate with this attribute
public ActionResult PostBudgetsActuals(BudgetDemo.Models.BudgetsActualsViewModel model)
{
var selectedDepartment = model.SelectedDepartment;
// dostuff with the model
return somethingFromHere;
}
Et changez la vue comme ceci:
@model BudgetDemo.Models.BudgetsActualsViewModel
@using (Html.BeginForm("PostBudgetsActuals", "BudgetsActuals", FormMethod.Post))
{
@Html.DropDownListFor(m => m.SelectedDepartment, Model.Departments,
"Select Department", new { @class = "form-control" })
}
Si vous rencontrez un problème avec la surcharge de DropDownListFor
méthode, vous pouvez également essayer la DropDownList
méthode comme ci-dessous:
@using (Html.BeginForm("PostBudgetsActuals", "BudgetsActuals", FormMethod.Post))
{
@Html.DropDownList("SelectedDepartment", Model.Departments,
"Select Department", new { @class = "form-control" })
}
METTRE À JOUR
// POST
[HttpPost]
public ActionResult GetBudgetsActuals(BudgetsActualsViewModel model)
{
try
{
repo = new BudgetDemoRepository();
if (model.SelectedDepartment != null)
{
TempData["SuccessMessage"] = "Value of SelectedDepartment is:
" + model.SelectedDepartment;
}
model.Departments = repo.GetBudgetsActuals().Departments;
return View(model);
}
catch
{
return View("Error");
}
}