Reputation: 426
In my ASP.Net MVC3 Razor project i have to implement a customer registration form(Screen Shot Attached).In that form , a single entity (say :purpose of doing DMIt) contains more than one answer.So i use checkbox to select the multiple or single answer.I have the view page and also a Model.How to code the View page to select multiple checkbox and also in Controller.
Controller Code
public ActionResult CustomerRegistration()
{
return View();
}
Model Code
namespace Elixir.Models
{
[Table("tbl_ElixirCustomer")]
public class Customer
{
[Key]
public int CusId { get; set; }
public string Name { get; set; }
public int age { get; set; }
public int Gender { get; set; }
public string FathName { get; set; }
public string MothName { get; set; }
public string OrgSchooName { get; set; }
public string Address { get; set; }
public string city { get; set; }
public string State { get; set; }
public string PIN { get; set; }
public string tele { get; set; }
public string Mob { get; set; }
public string Email { get; set; }
public string Web { get; set; }
public string Purpose { get; set; }
public string brief { get; set; }
}
public class CustomerViewModel
{
public string Purpose { get; set; }
public int Id { get; set; }
public bool IsChecked { get; set; }
}
}
View Code
<div class="col-lg-10">@Html.TextBoxFor(Model => Model.Mob, new { @class = "form-control" })</div>
<label class="col-lg-2 control-label">
Email</label>
<div class="col-lg-10">@Html.TextBoxFor(Model => Model.Email, new { @class = "form-control" })</div>
<label class="col-lg-2 control-label">
Web Site</label>
<div class="col-lg-10">@Html.TextBoxFor(Model => Model.Web, new { @class = "form-control" })</div>
<label class="col-lg-2 control-label">
Purpose of doing DMIT</label>
<div class="col-lg-10">
<div class="styled-chekbox">
<input type="checkbox" checked class="icheck-box-flat">
</div>
<span class="checkbox-label">Career Planning</span>
<div class="styled-chekbox">
<input type="checkbox" checked class="icheck-box-flat">
</div>
<span class="checkbox-label">Personel</span>
<div class="styled-chekbox">
<input type="checkbox" checked class="icheck-box-flat">
</div>
<span class="checkbox-label">Relationship</span>
<div class="styled-chekbox">
<input type="checkbox" checked class="icheck-box-flat">
</div>
<span class="checkbox-label">Parenting</span>
<div class="styled-chekbox">
<input type="checkbox" checked class="icheck-box-flat">
</div>
<span class="checkbox-label">Activity Plan for children</span>
<div class="styled-chekbox">
<input type="checkbox" checked class="icheck-box-flat">
</div>
<span class="checkbox-label">Stress Management</span>
</div>
<label class="col-lg-2 control-label">
Any Challenges</label>
<div class="col-lg-10">@Html.TextAreaFor(model => model.brief, new { @class = "tinymce-simple span12", @row = "170", @cols = "45", @width = "40%" })</div>
<div class="col-lg-2 control-label"></div>
<div class="col-lg-10">
@*<input type="button" class="" />*@ @* <button type="submit" class = "btn btn-success">@Html.ActionLink("Save", "EmployeeRegistration", "Home")</button>*@
@* <button type="submit" >@Html.ActionLink("Save", "EmployeeRegistration", "Home", new { @class = "btn btn-success" })</button>*@
<input type="submit" class="btn btn-success" value="Save" />
<button class="btn btn-success">
Clear</button>
<button class="btn btn-success">
Cancel</button>
</div>
Upvotes: 4
Views: 7170
Reputation: 10704
In CustomerViewModel
you can have separate properties
for every option
public bool CareerPlanning { get; set; }
public bool Personal{ get; set; }
public bool RelationShip{ get; set; }
and So on.....
Then in view you can have field for these properties
@Html.CheckBoxFor(Model => Model.CareerPlanning )<span> Career Planning </span>
@Html.CheckBoxFor(Model => Model.Personal)<span> Personal </span>
@Html.CheckBoxFor(Model => Model.RelationShip) <span> RelationShip</span>
and So on.....
Now in controller you need to modify Purpose
depending on all checkbox value
StringBuilder sb=new StringBuilder();
if(model.CareerPlanning)
sb.Append("Carrer Planning");
if(model.Personal)
sb.Append("-Personal");
and so on....
and at the end
model.Purpose=sb.ToString();
Upvotes: 3
Reputation: 3914
Create a Boolean property in model
Model:
public String Question{ get; set; }
public Boolean Options{ get; set; }
public String OptionContent{ get; set; }
...so on
Pass this model into the view and then use EditorFor html helper.
@using (Html.BeginForm("actionname", "Home", FormMethod.Post, null)){
<div>
@Html.LabelFor(model => model.Question)
</div>
<div>
@Html.EditorFor(model => model.Option)
@Html.LabelFor(model => model.OptionContent)
</div>
}
Upvotes: 3