I have a RadGrid which pops an WebUserControl to allow the user to update the data. I want to perform some simple validation on some of the NumericTextBoxes in the control and need to get the values of other controls to do this but my JavaScript returns null values for each of the other controls I need. Unfortunately my knowledge of JavaScript is limited and I really don't know why the $find is returning nulls so and pointers in the right direction much appreciated.
My WebUserControl includes the following controls:
<tr> <td class="style2"> <label id="Label2" for="rtbProductGroup">Product Group:</label> </td> <td class="style1"> <telerik:RadTextBox ID="rtbProductGroup" runat="server" Font-Names="Segoe UI" Resize="None" ResolvedRenderMode="Classic" Skin="Metro" AutoPostBack="false" Text='<%# DataBinder.Eval(Container, "DataItem.Product_Group") %>' TabIndex="2" ReadOnly="True" Width="250px"> </telerik:RadTextBox> </td></tr><tr> <td style="width:10%;"> <label id="Label64" for="Qty">Qty:</label> </td> <td style="width:5%;"> <telerik:RadNumericTextBox ID="ntbQty" runat="server" CssClass="rounded" Culture="en-GB" DbValueFactor="1" width="60px" ResolvedRenderMode="Classic" Skin="Metro" LabelCssClass="" AutoPostBack="false" MaxValue="1000" MinValue="1" Text='<%# DataBinder.Eval(Container, "DataItem.Qty") %>' TabIndex="6"> <NegativeStyle Resize="None" /> <NumberFormat DecimalDigits="0" ZeroPattern="n" /> <EmptyMessageStyle Resize="None" /> <ReadOnlyStyle Resize="None" /> <FocusedStyle Resize="None" /> <DisabledStyle Resize="None" /> <InvalidStyle Resize="None" /> <HoveredStyle Resize="None" /> <EnabledStyle HorizontalAlign="Right" Resize="None" /> </telerik:RadNumericTextBox> </td> <td style="width:10%;">Qty (SA): </td> <td style="width:5%;"> <telerik:RadNumericTextBox ID="ntbQtySA" runat="server" CssClass="rounded" Width="60px" Culture="en-GB" DbValueFactor="1" ResolvedRenderMode="Classic" AutoPostBack="false" Text='<%# DataBinder.Eval(Container, "DataItem.Qty_SA") %>' TabIndex="7"> <NegativeStyle Resize="None" /> <NumberFormat DecimalDigits="0" ZeroPattern="n" /> <EmptyMessageStyle Resize="None" /> <ReadOnlyStyle Resize="None" /> <FocusedStyle Resize="None" /> <DisabledStyle Resize="None" /> <InvalidStyle Resize="None" /> <HoveredStyle Resize="None" /> <EnabledStyle Resize="None" HorizontalAlign="Right" /> </telerik:RadNumericTextBox> </td></tr>My Validation is triggered by a standard ASP CustomValidator:
<asp:CustomValidator ID="cvNtbQty" runat="server" ForeColor="Red" ControlToValidate="ntbQty" ClientValidationFunction="ntbQty_FieldValidate" ErrorMessage="Number of Licences must be greater than or equal to the number of SA Licences"></asp:CustomValidator>The Javascript to perform the validation is in a linked script file within a RadScriptBlock:
<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server"> <script src="../Scripts/EditValidation.js" type="text/javascript"></script></telerik:RadScriptBlock>and which contains this validation function:
function ntbQty_FieldValidate(sender, args) { var ntbQtySA = $find("<%= ntbQtySA.ClientID %>"); var rtbProductGroup = $find("<%= rtbProductGroup.ClientID %>"); if (rtbProductGroup.get_value().toUpperCase() != "CONSULTANCY") { if (sender.get_value() < ntbQtySA.get_value()) { args.isValid = false; }}
I have a break a the 'if' statement in FireBug and this is hit so I know the script is being executed but when I look at the 2 vars 'ntnQtySA' and 'rtbProductGroup' both are null.
There's probably a simple solution bu as I said, my JavaScript is very basic currently.
Thanks,
Kyle