I added checkbox dynamically in the view with PropertiesList
select box. When submiting the form it posted the checkbox data but in controller Properties
in null that presented in below image.
Model:
public class ModelView
{
[HiddenInput]
public int Id { get; set; }
public string Title { get; set; }
public IEnumerable<SelectListItem> PropertiesList { get; set; }
public List<PropertyModels> Properties { get; set; }
}
public class PropertyModels
{
public int PropertyID { get; set; }
public string PropertyIcon { get; set; }
public int PropertyType { get; set; }
public string PropertyName { get; set; }
public bool IsSelected { get; set; }
}
View:
<div class="form-group">
<label>Properties</label>
<select id="PropertiesList" class="form-control" placeholder="Add ...">
@for (var i = 0; i < Model.Properties.Count(); i++)
{
<option value="@Model.Properties[i].PropertyID" data-value="@Model.Properties[i].IsSelected" data-icon="@Model.Properties[i].PropertyIcon">@Model.Properties[i].PropertyName</option>
}
</select>
</div>
<div>
<dl class="dl-horizontal"></dl>
</div>
JQuery:
$("#PropertiesList").on("change", function (e) {
var id = $(this).val();
var icon = $('#PropertiesList option:selected').attr('data-icon');
var name = $('#PropertiesList option:selected').text();
var dt = "<dt><span class='" + icon + "'></span> <span>" + name + "</span></dt>";
var value = ($('#PropertiesList option:selected').attr('data-value') === "True");
var dd = "<dd><input id='Properties_" + id + "__IsSelected' name='Properties[" + id + "].IsSelected' type='checkbox' class='minimal' value='false'> \
<input name='Properties[" + id + "].IsSelected' type='hidden'></dd>";
}
$('.dl-horizontal').append(dt + dd);
});
Conrtoller:
public virtual ActionResult EditView(int Id)
{
List<PropertyModels> PropertyItems = new List<PropertyModels>();
using (var context = new DB())
{
var properties = context.Property
.Where(prpinfo => prpinfo.Status == true)
.Select(prpinfo => new
{
prp_id = prpinfo.PropertyID,
prp_name = prpinfo.PropertyName
prp_icon = prpinfo.PropertyIcon,
});
foreach (var prp in properties)
{
PropertyModels prop = new PropertyModels();
prop.PropertyID = prp.prp_id;
prop.PropertyName = prp.prp_name.FirstOrDefault().prp_name;
prop.PropertyIcon = prp.prp_icon;
prop.IsSelected = false;
PropertyItems.Add(prop);
}
AddPlanModelView EPW = new AddPlanModelView()
{
Properties = PropertyItems
};
return View(EPW);
}
}
[HttpPost]
public virtual ActionResult EditView(ModelView MW)
{
if (TryUpdateModel(Plan, includeProperties: new[] { "PlanId","Title","Properties" }))
{
if (ModelState.IsValid)
{
using (var context = new DB())
{
var selected_property = context.ModelProperty.Where(d => d.ID == MW.Id)
.Select(prpinfo => new
{
prp_id = prpinfo.PropertyID,
prp_val = prpinfo.PropertyValueID
}).ToList();
IList<ModelProperty> modelprps = new List<ModelProperty>();
foreach (var cc in ModelView .Properties)
{
var match = selected_property.Where(c => c.prp_id == cc.PropertyID).Count();
if (match == 0)
{
modelprps.Add(new ModelProperty() { ModelID = Plan.PlanId, PropertyID = cc.PropertyID, Value = cc.IsSelected.ToString() });
}
}
context.ModelProperty.AddRange(modelprps);
}
}
context.SaveChanges();
return Json(new { success = true });
}
}
else
{
return Json(new { success = false });
}
}
else
{
return Json(new { success = false });
}
}