.NET 3.5 using VB
After hours of research and trial-and-error, I find myself still stuck on trying to validate individual radio buttons (NOT radiobuttonlist). At the end of this question, I'll explain why I don't think I can use a radiobuttonlist (which may just be that I don't want to!).
In short, I have a rather large matrix of questions that need answered. Answers are provided by radiobutton option, not dropdown (client demands radiobuttons).
I need to validate that each question has a radiobutton selected at form submission. I want the validation to occur client side.
I created javascript to return the validation, but I continue to run into various roadblocks trying to get the error message to display.
First roadblock was by not using radiobuttonlist, I was having difficulty obtaining the desired radio buttons to validate by group name. I found various examples that seemed like it would have worked, but never did. I ended up with the function I have posted below. Pretty it is not, but it works. Sadly, I will need one of these functions for each row, but at this point, I don't care.
Second roadblock was that the CustomValidator requires some input element as its ControlToValidate. I have no such control since RadioButton is not a valid input element (odd?). So to circumnavigate this problem, I inserted a text box to pass as the control to validate. Obviously I would not want this text box to show, so I set a style to display: none. Well, this didn't work because it seems the CustomValidator inherits the display property of the ControlToValidate (again, odd?); so when the TextBox is hidden, the error message from the validator is also hidden. I have confirmed the validator is fired, and the validator works if the display property is set to something other than none.
Okay, sorry for the long intro, but I know if I don't answer that stuff it will all be asked anyway.
So onto the juicy stuff, here's the code I have to this point.
CSS:
.DoNotShow
{
display: none;
}
.Show
{
display: block;
}
javascript:
function validateEvaluationTableRow1(oSrc, args)
{
var rbtnValue = null;
var valueCol1 = document.getElementsByName('<%= rdoEvalSatRow1.ClientID %>')[0].checked;
var valueCol2 = document.getElementsByName('<%= rdoEvalNeedsImprovRow1.ClientID %>')[0].checked;
var valueCol3 = document.getElementsByName('<%= rdoEvalUnsatRow1.ClientID %>')[0].checked;
var valueCol4 = document.getElementsByName('<%= rdoEvalUnableRow1.ClientID %>')[0].checked;
var valueCol5 = document.getElementsByName('<%= rdoEvalNARow1.ClientID %>')[0].checked;
alert(valueCol1 || valueCol2 || valueCol3 || valueCol4 || valueCol5);
args.IsValid = (valueCol1 || valueCol2 || valueCol3 || valueCol4 || valueCol5);
}
ASP.NET Code:
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<th>
</th>
<th valign="top" align="center">
Satisfactory
</th>
<th valign="top" align="center">
Needs<br />
Improvement
</th>
<th valign="top" align="center">
Unsatisfactory
</th>
<th valign="top" align="center">
Unable<br />
To Evaluate
</th>
<th valign="top" align="center">
N/A
</th>
</tr>
<tr bgcolor="#E1E1EA">
<td>
<asp:CustomValidator ID="vldRow1" runat="server" ControlToValidate="TextBox1" Enabled="True"
Height="18px" ErrorMessage="Selection Required<br>" SetFocusOnError="True" Visible="True" CssClass="Show"
Display="Dynamic" ValidateEmptyText="true" ClientValidationFunction="validateEvaluationTableRow1" />
<asp:Label ID="Label1" runat="server" Text="Label">Level of clinical activity</asp:Label>
<asp:TextBox ID="TextBox1" runat="server" Visible="true" Width="0" CssClass="DoNotShow" />
</td>
<td align="center">
<asp:RadioButton ID="rdoEvalSatRow1" runat="server" GroupName="Row1" />
</td>
<td align="center">
<asp:RadioButton ID="rdoEvalNeedsImprovRow1" runat="server" GroupName="Row1" />
</td>
<td align="center">
<asp:RadioButton ID="rdoEvalUnsatRow1" runat="server" GroupName="Row1" />
</td>
<td align="center">
<asp:RadioButton ID="rdoEvalUnableRow1" runat="server" GroupName="Row1" />
</td>
<td align="center">
<asp:RadioButton ID="rdoEvalNARow1" runat="server" GroupName="Row1" />
</td>
</tr>
{... lots more rows ...}
</table>
I would love to do away with the silly textbox; I'm okay with the javascript function; I just need the validator to work!
So, can I use radiobuttonlist? Perhaps, but I don't know of a good way to align the header of the matrix with the individual radiobuttons in each column. And this matrix is pretty large and I have several other forms that have a similar matrix, so to redo this matrix in some other fashion is going to take a pretty lot of work too. Sadly, the validation requirement was not part the initial requirements when this form was developed, but the client decided it would be nice to have it.
Thanks for taking the time to read all this. Any help and suggestions would be greatly appreciated! Keep in mind the code you see here is obviously a subset of a larger project and some of it is done just for troubleshooting, so please don't get hung-up on naming or wording.