Hi,
- I have 4 sections on the page
- Each section has multiple questions
- Each questions has 3 radio buttons.
- My radio buttons are getting the same name and id across the 4 sections rather than being unique at the question level. (My Problem)
How can i fix this issue? Thanks
View - showing code for section 1 only
@[COLOR=blue]using[/COLOR] (Html.BeginForm([COLOR=#2b91af]ActionNames[/COLOR].Index, [COLOR=#2b91af]ControllerNames[/COLOR].PaperSurveyQualityControl, [COLOR=blue]new[/COLOR] { Area = [COLOR=#2b91af]AreaNames[/COLOR].OngoingProjects }, [COLOR=#2b91af]FormMethod[/COLOR].Post, [COLOR=blue]new[/COLOR] { @id = [COLOR=#a31515]"PaperSurveyQualityControlForm"[/COLOR] })){
@Html.HiddenFor(x => x.Header.SurveyValidationId)
[COLOR=blue]if[/COLOR] (Model.PersonalInformation != [COLOR=blue]null[/COLOR] && Model.PersonalInformation.Count > 0)
{
[COLOR=blue]<[/COLOR][COLOR=maroon]div[/COLOR] [COLOR=red]class[/COLOR][COLOR=blue]=[/COLOR][COLOR=blue]"distanceBottom"[/COLOR][COLOR=blue]>[/COLOR]
[COLOR=blue]<[/COLOR][COLOR=maroon]table[/COLOR] [COLOR=red]class[/COLOR][COLOR=blue]=[/COLOR][COLOR=blue]"siteTable"[/COLOR][COLOR=blue]>[/COLOR]
[COLOR=blue]<[/COLOR][COLOR=maroon]thead[/COLOR][COLOR=blue]>[/COLOR]
[COLOR=blue]<[/COLOR][COLOR=maroon]th[/COLOR] [COLOR=red]style[/COLOR][COLOR=blue]=[/COLOR][COLOR=blue]"[/COLOR][COLOR=red]width[/COLOR][COLOR=blue]: [/COLOR][COLOR=blue]38%[/COLOR][COLOR=blue];"[/COLOR][COLOR=blue]>[/COLOR]Description[COLOR=blue]</[/COLOR][COLOR=maroon]th[/COLOR][COLOR=blue]>[/COLOR]
[COLOR=blue]<[/COLOR][COLOR=maroon]th[/COLOR] [COLOR=red]style[/COLOR][COLOR=blue]=[/COLOR][COLOR=blue]"[/COLOR][COLOR=red]width[/COLOR][COLOR=blue]: [/COLOR][COLOR=blue]30%[/COLOR][COLOR=blue];"[/COLOR][COLOR=blue]>[/COLOR]Keyed Value[COLOR=blue]</[/COLOR][COLOR=maroon]th[/COLOR][COLOR=blue]>[/COLOR]
[COLOR=blue]<[/COLOR][COLOR=maroon]th[/COLOR] [COLOR=red]style[/COLOR][COLOR=blue]=[/COLOR][COLOR=blue]"[/COLOR][COLOR=red]width[/COLOR][COLOR=blue]: [/COLOR][COLOR=blue]10%[/COLOR][COLOR=blue];"[/COLOR][COLOR=blue]><[/COLOR][COLOR=maroon]center[/COLOR][COLOR=blue]>[/COLOR]Correct[COLOR=blue]</[/COLOR][COLOR=maroon]center[/COLOR][COLOR=blue]></[/COLOR][COLOR=maroon]th[/COLOR][COLOR=blue]>[/COLOR]
[COLOR=blue]<[/COLOR][COLOR=maroon]th[/COLOR] [COLOR=red]style[/COLOR][COLOR=blue]=[/COLOR][COLOR=blue]"[/COLOR][COLOR=red]width[/COLOR][COLOR=blue]: [/COLOR][COLOR=blue]10%[/COLOR][COLOR=blue];"[/COLOR][COLOR=blue]><[/COLOR][COLOR=maroon]center[/COLOR][COLOR=blue]>[/COLOR]Typo[COLOR=blue]</[/COLOR][COLOR=maroon]center[/COLOR][COLOR=blue]></[/COLOR][COLOR=maroon]th[/COLOR][COLOR=blue]>[/COLOR]
[COLOR=blue]<[/COLOR][COLOR=maroon]th[/COLOR] [COLOR=red]style[/COLOR][COLOR=blue]=[/COLOR][COLOR=blue]"[/COLOR][COLOR=red]width[/COLOR][COLOR=blue]: [/COLOR][COLOR=blue]12%[/COLOR][COLOR=blue];"[/COLOR][COLOR=blue]><[/COLOR][COLOR=maroon]center[/COLOR][COLOR=blue]>[/COLOR]Mismatched[COLOR=blue]</[/COLOR][COLOR=maroon]center[/COLOR][COLOR=blue]></[/COLOR][COLOR=maroon]th[/COLOR][COLOR=blue]>[/COLOR]
[COLOR=blue]</[/COLOR][COLOR=maroon]thead[/COLOR][COLOR=blue]>[/COLOR]
[COLOR=blue]<[/COLOR][COLOR=maroon]tbody[/COLOR][COLOR=blue]>[/COLOR]
@[COLOR=blue]foreach[/COLOR] ([COLOR=blue]var[/COLOR] item [COLOR=blue]in[/COLOR] Model.PersonalInformation)
{
@Html.HiddenFor(x => item.CategoryCode)
[COLOR=blue]<[/COLOR][COLOR=maroon]tr[/COLOR][COLOR=blue]>[/COLOR]
[COLOR=blue]<[/COLOR][COLOR=maroon]td[/COLOR][COLOR=blue]>[/COLOR]@item.Description[COLOR=blue]</[/COLOR][COLOR=maroon]td[/COLOR][COLOR=blue]>[/COLOR]
[COLOR=blue]<[/COLOR][COLOR=maroon]td[/COLOR][COLOR=blue]>[/COLOR]@item.KeyedValue[COLOR=blue]</[/COLOR][COLOR=maroon]td[/COLOR][COLOR=blue]>[/COLOR]
[COLOR=blue]<[/COLOR][COLOR=maroon]td[/COLOR][COLOR=blue]><[/COLOR][COLOR=maroon]center[/COLOR][COLOR=blue]>[/COLOR]@Html.RadioButtonFor(model => item.Response, [COLOR=#a31515]"C"[/COLOR])[COLOR=blue]</[/COLOR][COLOR=maroon]center[/COLOR][COLOR=blue]></[/COLOR][COLOR=maroon]td[/COLOR][COLOR=blue]>[/COLOR]
[COLOR=blue]<[/COLOR][COLOR=maroon]td[/COLOR][COLOR=blue]><[/COLOR][COLOR=maroon]center[/COLOR][COLOR=blue]>[/COLOR]@Html.RadioButtonFor(model => item.Response, [COLOR=#a31515]"T"[/COLOR])[COLOR=blue]</[/COLOR][COLOR=maroon]center[/COLOR][COLOR=blue]></[/COLOR][COLOR=maroon]td[/COLOR][COLOR=blue]>[/COLOR]
[COLOR=blue]<[/COLOR][COLOR=maroon]td[/COLOR][COLOR=blue]><[/COLOR][COLOR=maroon]center[/COLOR][COLOR=blue]>[/COLOR]@Html.RadioButtonFor(model => item.Response, [COLOR=#a31515]"M"[/COLOR])[COLOR=blue]</[/COLOR][COLOR=maroon]center[/COLOR][COLOR=blue]></[/COLOR][COLOR=maroon]td[/COLOR][COLOR=blue]>[/COLOR]
[COLOR=blue]</[/COLOR][COLOR=maroon]tr[/COLOR][COLOR=blue]>[/COLOR]
}
[COLOR=blue]</[/COLOR][COLOR=maroon]tbody[/COLOR][COLOR=blue]>[/COLOR]
[COLOR=blue]</[/COLOR][COLOR=maroon]table[/COLOR][COLOR=blue]>[/COLOR]
[COLOR=blue]</[/COLOR][COLOR=maroon]div[/COLOR][COLOR=blue]>[/COLOR]
}
}
Source View
<form action="[/OngoingProjects/PaperSurveyQualityControl](http://www.sitepoint.com/forums/view-source:http://localhost:52341/OngoingProjects/PaperSurveyQualityControl)" id="PaperSurveyQualityControlForm" method="post">
<input data-val="true" data-val-number="The field SurveyValidationId must be a number." data-val-required="The SurveyValidationId field is required." id="Header_SurveyValidationId" name="Header.SurveyValidationId" type="hidden" value="1" />
<div class="distanceBottom">
<table class="siteTable">
<thead>
<th style="width: 38%;">Description</th>
<th style="width: 30%;">Keyed Value</th>
<th style="width: 10%;"><center>Correct</center></th>
<th style="width: 10%;"><center>Typo</center></th>
<th style="width: 12%;"><center>Mismatched</center></th>
</thead>
<tbody><input id="item_CategoryCode" name="item.CategoryCode" type="hidden" value="FN" />
<tr>
<td>First Name</td>
<td>Firstname</td>
<td><center><input data-val="true" data-val-required="Message missing!" id="item_Response" name="item.Response" type="radio" value="C" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="T" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="M" /></center></td>
</tr><input id="item_CategoryCode" name="item.CategoryCode" type="hidden" value="LN" />
<tr>
<td>Last Name</td>
<td>Lastname</td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="C" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="T" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="M" /></center></td>
</tr><input id="item_CategoryCode" name="item.CategoryCode" type="hidden" value="AD" />
<tr>
<td>Address</td>
<td>123 Test</td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="C" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="T" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="M" /></center></td>
</tr><input id="item_CategoryCode" name="item.CategoryCode" type="hidden" value="CT" />
<tr>
<td>City</td>
<td>Marcelius</td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="C" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="T" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="M" /></center></td>
</tr><input id="item_CategoryCode" name="item.CategoryCode" type="hidden" value="ST" />
<tr>
<td>State</td>
<td>NV</td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="C" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="T" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="M" /></center></td>
</tr><input id="item_CategoryCode" name="item.CategoryCode" type="hidden" value="ZC" />
<tr>
<td>Zip Code</td>
<td>13108</td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="C" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="T" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="M" /></center></td>
</tr><input id="item_CategoryCode" name="item.CategoryCode" type="hidden" value="EM" />
<tr>
<td>Email</td>
<td>abc@abc.com</td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="C" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="T" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="M" /></center></td>
</tr>
</tbody>
</table>
</div>
<div class="distanceBottom">
<table class="siteTable">
<thead>
<th style="width: 38%;">Description</th>
<th style="width: 30%;">Keyed Value</th>
<th style="width: 10%;"><center>Correct</center></th>
<th style="width: 10%;"><center>Typo</center></th>
<th style="width: 12%;"><center>Mismatched</center></th>
</thead>
<tbody><input id="item_CategoryCode" name="item.CategoryCode" type="hidden" value="Q1" />
<tr>
<td>Q1 - blah blah blah</td>
<td>A</td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="C" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="T" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="M" /></center></td>
</tr><input id="item_CategoryCode" name="item.CategoryCode" type="hidden" value="Q2" />
<tr>
<td>Q2 - blah blah blah</td>
<td>ADF</td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="C" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="T" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="M" /></center></td>
</tr><input id="item_CategoryCode" name="item.CategoryCode" type="hidden" value="Q3" />
<tr>
<td>Q3 - blah blah blah</td>
<td>BC</td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="C" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="T" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="M" /></center></td>
</tr><input id="item_CategoryCode" name="item.CategoryCode" type="hidden" value="Q4" />
<tr>
<td>Q4 - blah blah blah</td>
<td>D</td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="C" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="T" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="M" /></center></td>
</tr>
</tbody>
</table>
</div>
<div class="distanceBottom">
<table class="siteTable">
<thead>
<th style="width: 38%;">Description</th>
<th style="width: 30%;">Keyed Value</th>
<th style="width: 10%;"><center>Correct</center></th>
<th style="width: 10%;"><center>Typo</center></th>
<th style="width: 12%;"><center>Mismatched</center></th>
</thead>
<tbody><input id="item_CategoryCode" name="item.CategoryCode" type="hidden" value="S1" />
<tr>
<td>Declared State 1</td>
<td>MO</td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="C" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="T" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="M" /></center></td>
</tr><input id="item_CategoryCode" name="item.CategoryCode" type="hidden" value="S2" />
<tr>
<td>Declared State 2</td>
<td>NY</td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="C" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="T" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="M" /></center></td>
</tr><input id="item_CategoryCode" name="item.CategoryCode" type="hidden" value="S3" />
<tr>
<td>Declared State 3</td>
<td>AZ</td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="C" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="T" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="M" /></center></td>
</tr>
</tbody>
</table>
</div>
<div class="distanceBottom">
<table class="siteTable">
<thead>
<th style="width: 38%;">Description</th>
<th style="width: 30%;">Keyed Value</th>
<th style="width: 10%;"><center>Correct</center></th>
<th style="width: 10%;"><center>Typo</center></th>
<th style="width: 12%;"><center>Mismatched</center></th>
</thead>
<tbody><input id="item_CategoryCode" name="item.CategoryCode" type="hidden" value="C1" />
<tr>
<td>Declared College 1</td>
<td>US Naval Academy</td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="C" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="T" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="M" /></center></td>
</tr><input id="item_CategoryCode" name="item.CategoryCode" type="hidden" value="C2" />
<tr>
<td>Declared College 2</td>
<td>Don't know any others</td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="C" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="T" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="M" /></center></td>
</tr><input id="item_CategoryCode" name="item.CategoryCode" type="hidden" value="C3" />
<tr>
<td>Declared College 3</td>
<td></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="C" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="T" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="M" /></center></td>
</tr><input id="item_CategoryCode" name="item.CategoryCode" type="hidden" value="C4" />
<tr>
<td>Declared College 4</td>
<td></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="C" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="T" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="M" /></center></td>
</tr><input id="item_CategoryCode" name="item.CategoryCode" type="hidden" value="C5" />
<tr>
<td>Declared College 5</td>
<td></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="C" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="T" /></center></td>
<td><center><input id="item_Response" name="item.Response" type="radio" value="M" /></center></td>
</tr>
</tbody>
</table>
</div>
<div class="distanceTop">
<button type="submit" title="Update Email" id="ButtonUpdate" class="gradientbuttonRight gradientbutton gradientorange">Update</button>
<a id="ButtonExit" class="gradientbuttonLeft gradientbutton gradientblue" href="[/OngoingProjects/PaperSurveyQualityControl/Exit?badEmailId=1](http://www.sitepoint.com/forums/view-source:http://localhost:52341/OngoingProjects/PaperSurveyQualityControl/Exit?badEmailId=1)" title="Exit">EXIT</a>
</div>
</form>
View Model
[COLOR=blue]using[/COLOR] Sqc.BusinessEntities; [COLOR=blue]namespace[/COLOR] Sqc.ViewModels.OngoingProject{
[COLOR=blue]public[/COLOR] [COLOR=blue]partial[/COLOR] [COLOR=blue]class[/COLOR] [COLOR=#2b91af]PaperSurveyQualityControlVideoModel[/COLOR] {
[COLOR=blue]public[/COLOR] [COLOR=#2b91af]PaperSurveyQualityControlHeader[/COLOR] Header { [COLOR=blue]get[/COLOR]; [COLOR=blue]set[/COLOR]; }
[COLOR=blue]public[/COLOR] [COLOR=#2b91af]List[/COLOR]<[COLOR=#2b91af]PaperSurveyQualityControlItem[/COLOR]> PersonalInformation { [COLOR=blue]get[/COLOR]; [COLOR=blue]set[/COLOR]; }
[COLOR=blue]public[/COLOR] [COLOR=#2b91af]List[/COLOR]<[COLOR=#2b91af]PaperSurveyQualityControlItem[/COLOR]> QuestionAnswers { [COLOR=blue]get[/COLOR]; [COLOR=blue]set[/COLOR]; }
[COLOR=blue]public[/COLOR] [COLOR=#2b91af]List[/COLOR]<[COLOR=#2b91af]PaperSurveyQualityControlItem[/COLOR]> DeclaredStates { [COLOR=blue]get[/COLOR]; [COLOR=blue]set[/COLOR]; }
[COLOR=blue]public[/COLOR] [COLOR=#2b91af]List[/COLOR]<[COLOR=#2b91af]PaperSurveyQualityControlItem[/COLOR]> DeclaredColleges { [COLOR=blue]get[/COLOR]; [COLOR=blue]set[/COLOR]; }
}
}
Business Entities:
Header
[COLOR=blue]namespace[/COLOR] Sqc.BusinessEntities{ [COLOR=blue]public[/COLOR] [COLOR=blue]partial[/COLOR] [COLOR=blue]class[/COLOR] [COLOR=#2b91af]PaperSurveyQualityControlHeader[/COLOR] {
[COLOR=blue]public[/COLOR] [COLOR=blue]int[/COLOR] SurveyValidationId { [COLOR=blue]get[/COLOR]; [COLOR=blue]set[/COLOR]; }
[COLOR=blue]public[/COLOR] [COLOR=blue]string[/COLOR] ImageFront { [COLOR=blue]get[/COLOR]; [COLOR=blue]set[/COLOR]; }
[COLOR=blue]public[/COLOR] [COLOR=blue]string[/COLOR] ImageBack { [COLOR=blue]get[/COLOR]; [COLOR=blue]set[/COLOR]; }
}
}
Item
[COLOR=blue]namespace[/COLOR] Sqc.BusinessEntities{ [COLOR=blue]public[/COLOR] [COLOR=blue]partial[/COLOR] [COLOR=blue]class[/COLOR] [COLOR=#2b91af]PaperSurveyQualityControlItem[/COLOR] {
[COLOR=blue]public[/COLOR] [COLOR=blue]string[/COLOR] CategoryCode { [COLOR=blue]get[/COLOR]; [COLOR=blue]set[/COLOR]; }
[COLOR=blue]public[/COLOR] [COLOR=blue]string[/COLOR] Description { [COLOR=blue]get[/COLOR]; [COLOR=blue]set[/COLOR]; }
[COLOR=blue]public[/COLOR] [COLOR=blue]string[/COLOR] KeyedValue { [COLOR=blue]get[/COLOR]; [COLOR=blue]set[/COLOR]; }
[COLOR=blue]public[/COLOR] [COLOR=blue]string[/COLOR] Response { [COLOR=blue]get[/COLOR]; [COLOR=blue]set[/COLOR]; } [COLOR=green]//C=Correct, T=Typo, M=Mismatch REQUIRED - radio button response
[/COLOR] }
}
Item Validation
[COLOR=blue]using[/COLOR] System.ComponentModel.DataAnnotations;[COLOR=blue]using[/COLOR] DataAnnotationsExtensions;[COLOR=blue]using[/COLOR] System.Web.Mvc; [COLOR=blue]namespace[/COLOR] Sqc.BusinessEntities{
[[COLOR=#2b91af]MetadataType[/COLOR]([COLOR=blue]typeof[/COLOR]([COLOR=#2b91af]PaperSurveyQualityControlItem[/COLOR].[COLOR=#2b91af]PaperSurveyQualityControlItemMetaData[/COLOR]))]
[COLOR=blue]public[/COLOR] [COLOR=blue]partial[/COLOR] [COLOR=blue]class[/COLOR] [COLOR=#2b91af]PaperSurveyQualityControlItem[/COLOR] {
[COLOR=blue]public[/COLOR] [COLOR=blue]class[/COLOR] [COLOR=#2b91af]PaperSurveyQualityControlItemMetaData[/COLOR] {
[[COLOR=#2b91af]Required[/COLOR](ErrorMessage = [COLOR=#2b91af]ValidationMessageConstants[/COLOR].MessageRequired)]
[COLOR=blue]public[/COLOR] [COLOR=blue]string[/COLOR] Response { [COLOR=blue]get[/COLOR]; [COLOR=blue]set[/COLOR]; }
}
}
}