I'm trying to use the chosen
( link ) plugin with DropDownListFor
, however when using this plugin the validation of the field not working.
Caixa.cshtml
@model CaixaViewModel
<div class="row">
<div class="col-lg-12">
<div class="panel panel-default">
<div class="panel-heading">
@if (Model.CaixaId > 0)
{
<label>Edição do caixa - @Model.Descricao</label>
}
else
{
<label>Cadastro de caixa</label>
}
</div>
<div class="panel-body">
@using (Html.BeginForm("Salvar", "Caixa"))
{
@Html.AntiForgeryToken()
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
@Html.Partial("_Caixa")
<div class="row">
<div class="col-lg-12">
<a href="@Url.Action("Index")" class="btn btn-default"><i class="fa fa-arrow-left fa-fw"></i> Voltar</a>
<button type="submit" class="btn btn-primary"><i class="fa fa-save fa-fw"></i> Salvar</button>
</div>
</div>
}
</div>
</div>
</div>
</div>
@section styles {
<link href="~/Content/bootstrap-chosen/bootstrap-chosen.css" rel="stylesheet" />
}
@section scripts {
@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/bundles/ajax")
<script src="~/Content/chosen_v1.5.1/chosen.jquery.js"></script>
<script type="text/javascript">
var config = {
'.chosen-select': {},
'.chosen-select-deselect': { allow_single_deselect: true },
'.chosen-select-no-single': { disable_search_threshold: 10 },
'.chosen-select-no-results': { no_results_text: 'Oops, nothing found!' },
'.chosen-select-width': { width: "95%" }
}
for (var selector in config) {
$(selector).chosen(config[selector]);
}
</script>
}
_Cash.cshtml
@model CaixaViewModel
@Html.HiddenFor(a => a.CaixaId)
@Html.HiddenFor(a => a.Ativo)
<div class="row form-group">
<div class="col-lg-12">
@Html.LabelFor(model => model.PessoaId, htmlAttributes: new { @class = "control-label" })
@Html.DropDownListFor(model => model.PessoaId, Html.PessoaLista(), htmlAttributes: new { @class = "form-control chosen-select" })
@Html.ValidationMessageFor(model => model.PessoaId, "", new { @class = "text-danger" })
</div>
</div>
<div class="row form-group">
<div class="col-lg-6">
@Html.LabelFor(model => model.CentroCustoId, htmlAttributes: new { @class = "control-label" })
@Html.DropDownListFor(model => model.CentroCustoId, Html.CentroCustoLista(), htmlAttributes: new { @class = "form-control chosen-select" })
@Html.ValidationMessageFor(model => model.CentroCustoId, "", new { @class = "text-danger" })
</div>
<div class="col-lg-6">
@Html.LabelFor(model => model.CategoriaId, htmlAttributes: new { @class = "control-label" })
@Html.DropDownListFor(model => model.CategoriaId, Html.CategoriaLista(), htmlAttributes: new { @class = "form-control chosen-select" })
@Html.ValidationMessageFor(model => model.CategoriaId, "", new { @class = "text-danger" })
</div>
</div>
<div class="row form-group">
<div class="col-lg-12">
@Html.LabelFor(model => model.Descricao, htmlAttributes: new { @class = "control-label" })
@Html.EditorFor(model => model.Descricao, new { htmlAttributes = new { @class = "form-control", @autofocus = "" } })
@Html.ValidationMessageFor(model => model.Descricao, "", new { @class = "text-danger" })
</div>
</div>
<div class="row form-group">
<div class="col-lg-12">
@Html.LabelFor(model => model.Observacao, htmlAttributes: new { @class = "control-label" })
@Html.EditorFor(model => model.Observacao, new { htmlAttributes = new { @class = "form-control", @autofocus = "" } })
@Html.ValidationMessageFor(model => model.Observacao, "", new { @class = "text-danger" })
</div>
</div>
<div class="row form-group">
<div class="col-lg-4">
@Html.LabelFor(model => model.Valor, htmlAttributes: new { @class = "control-label" })
@Html.EditorFor(model => model.Valor, new { htmlAttributes = new { @class = "form-control", @autofocus = "" } })
@Html.ValidationMessageFor(model => model.Valor, "", new { @class = "text-danger" })
</div>
<div class="col-lg-4">
@Html.LabelFor(model => model.Tipo, htmlAttributes: new { @class = "control-label" })
@Html.EditorFor(model => model.Tipo, new { htmlAttributes = new { @class = "form-control", @autofocus = "" } })
@Html.ValidationMessageFor(model => model.Tipo, "", new { @class = "text-danger" })
</div>
</div>
-
public class CaixaViewModel
{
public int CaixaId { get; set; }
public bool Ativo { get; set; }
[Display(Name = "Pessoa")]
[Required]
public int? PessoaId { get; set; }
[Display(Name = "Categoria")]
[Required]
public int? CategoriaId { get; set; }
[Display(Name = "Centro de custo")]
[Required]
public int? CentroCustoId { get; set; }
[Display(Name = "Tipo")]
public CaixaTipo Tipo { get; set; }
[Display(Name = "Descrição")]
[Required]
public string Descricao { get; set; }
[Display(Name = "Observação")]
public string Observacao { get; set; }
[Display(Name = "Valor R$")]
[Required]
public decimal Valor { get; set; }
}
public static SelectList PessoaLista(this HtmlHelper html)
{
SelectList list = null;
using (CaixaCorridoContext context = new CaixaCorridoContext())
{
var pessoas = context.Pessoa
.OrderBy(a => a.Nome)
.Select(a => new SelectListItem()
{
Value = a.PessoaId.ToString(),
Text = a.Nome
}).ToList();
pessoas.Add(new SelectListItem() { Value = "", Text = "", Selected = true });
list = new SelectList(pessoas.OrderBy(a => a.Text), "Value", "Text");
}
return list;
}