I am adding rows dynamically using jquery on change event of drop down. Row contains checkbox, TextArea and Dropdown. All controls are binded with properties of model. Checkbox is also binded with bool property of Model. On submit of form, controller receives Model, Other controls like TextArea and dropdown have values entered in form, but checkbox property is always false in spite of checking the checkbox.
This is how HtmlHelper classes are used to bind model.
<tr>
<td>
@Html.CheckBoxFor(model => model.FunctionalRequirementsList[i].isSelected, new { @class = "checkbox" })
@Html.HiddenFor(model => model.FunctionalRequirementsList[i].FunctionalRequirementId)
</td>
<td>
@Html.TextAreaFor(model => model.FunctionalRequirementsList[i].FunctionalRequirement, 5, 80, new { @class = "text form-control col-md-10", style = "background-color:#fcf999;max-width:100%;height:50px;", ReadOnly = "true" })
</td>
<td>
@Html.DropDownListFor(model => model.FunctionalRequirementsList[i].DefaultPriorityId, new SelectList(Model.FunctionalRequirementsList[i].ApllicabilityOptions, "Value", "Text", Model.FunctionalRequirementsList[i].DefaultPriorityId), new { @class = "form-control col-md-1" })
</td>
</tr>
Jquery code for dynamic addition:
var oldFRSelected_Id = $trlast.find("input[type='checkbox'][id*='isSelected']").attr('id')
var oldFRSelected_Id_Slice = oldFRSelected_Id.split('_');
var newFRSelected_Id = oldFRSelected_Id_Slice[0] + "_" + (i + 1) + "__" + oldFRSelected_Id_Slice[3]
var newFRSelected_name = oldFRSelected_Id_Slice[0] + "[" + (i + 1) + "]." + oldFRSelected_Id_Slice[3]
$trclone.find("input[type='checkbox'][id*='isSelected']").attr('id', newFRSelected_Id);
$trclone.find("input[type='checkbox'][id*='isSelected']").attr('name', newFRSelected_name);