[Solved] Clientside "validateCombo" doesn't work for combobox in RadSchuler form template

[MfE_Developer]

I've tried to use:

http://www.telerik.com/community/forums/aspnet-ajax/combobox/validate-user-input-in-radcombobox-with-allowcustomtext-quot-true-quot-filter-quot-contains-quot.aspx

however, the javascript never fires. I've debugged in the browser and the javascript is never called. The requirefield validator works fine, but if a user tpyes somejunk into the filter and presses 'ok' without selecting an item, the form accepts the input, writes to teh database and closes the modal form.
I've included the AdvancedInsertTemplate of the RadScheduler below.

<AdvancedInsertTemplate>
            <div class="rsAdvancedEdit rsAdvancedModal"
               style="position: relative; width:560px; left: 30%;">
               <div class="rsModalBgTopLeft">
               </div>
               <div class="rsModalBgTopRight">
               </div>
               <div class="rsModalBgBottomLeft">
               </div>
               <div class="rsModalBgBottomRight">
               </div>
               <div class="rsAdvTitle">
                  <h1 class="rsAdvInnerTitle">
                     <%#Container.Appointment.Owner.Localization.AdvancedNewAppointment%>
                  </h1>
                  <asp:LinkButton ID="LinkButton1" runat="server" CausesValidation="false"
                     CommandName="Cancel" CssClass="rsAdvEditClose"
                     ToolTip="<%# Container.Appointment.Owner.Localization.AdvancedClose %>"> <%#Container.Appointment.Owner.Localization.AdvancedClose%></asp:LinkButton>

               </div>
               <div class="rsAdvContentWrapper">
                  <div style="display: inline-block">
                     <!-- ** -->
                     <div style="float: left;">
                        <p>
                           <telerik:RadComboBox ID="UsersComboBox" runat="server" DataSourceID="UsersDataSource" DataTextField="Fullname" DataValueField="Username"  AllowCustomText="true" EnableTextSelection="false" EmptyMessage="Please select..." Filter="Contains"
                              Label="User" SelectedValue='<%# Bind("Username") %>'>
                           </telerik:RadComboBox>
                           <asp:RequiredFieldValidator ID="RequiredFieldValidator1" ControlToValidate="UsersComboBox" runat="server" ErrorMessage="Required"></asp:RequiredFieldValidator>
                           <asp:CustomValidator ID="CustomValidator331" runat="server"
                              ControlToValidate="UsersComboBox"
                               ClientValidationFunction="validateCombo" ValidateEmptyText="true"
                               ErrorMessage="You cansubmit only existing name">

                           </asp:CustomValidator>
                        </p>
                        <p>
                           <div style="display: inline-block">
                              <div style="float: left; width: 76px; text-align: right; padding-right: 5px; padding-top: 5px;">
                                 <asp:Label ID="Label1" runat="server" ForeColor="#333333" Text="Start"></asp:Label>
                              </div>
                              <div>
                                 <telerik:RadDateTimePicker ID="StartInput" runat="server" Culture="en-NZ"
                                    SelectedDate='<%# Bind("Start") %>'>
                                    <TimeView CellSpacing="-1" Culture="en-NZ" EndTime="17:30:00"
                                       Interval="00:30:00" RenderDirection="Vertical" StartTime="08:30:00">
                                    </TimeView>
                                    <TimePopupButton HoverImageUrl="" ImageUrl="" />
                                    <Calendar UseColumnHeadersAsSelectors="False" UseRowHeadersAsSelectors="False"
                                       ViewSelectorText="x">
                                    </Calendar>
                                    <DateInput DateFormat="d/MM/yyyy" DisplayDateFormat="d/MM/yyyy">
                                    </DateInput>
                                    <DatePopupButton HoverImageUrl="" ImageUrl="" />
                                 </telerik:RadDateTimePicker>
                              </div>
                           </div>
                        </p>
                        <p>
                           <div style="display: inline-block">
                              <div style="float: left; width: 76px; text-align: right; padding-right: 5px; padding-top: 5px;">
                                 <asp:Label ID="Label2" runat="server" ForeColor="#333333" Text="End"></asp:Label>
                              </div>
                              <div>
                                 <telerik:RadDateTimePicker ID="EndInput" runat="server" Culture="en-NZ"
                                    SelectedDate='<%# Bind("End") %>'>
                                    <TimeView CellSpacing="-1" Culture="en-NZ" EndTime="17:30:00"
                                       Interval="00:30:00" RenderDirection="Vertical" StartTime="08:30:00">
                                    </TimeView>
                                    <TimePopupButton HoverImageUrl="" ImageUrl="" />
                                    <Calendar UseColumnHeadersAsSelectors="False" UseRowHeadersAsSelectors="False"
                                       ViewSelectorText="x">
                                    </Calendar>
                                    <DateInput DateFormat="d/MM/yyyy" DisplayDateFormat="d/MM/yyyy">
                                    </DateInput>
                                    <DatePopupButton HoverImageUrl="" ImageUrl="" />
                                 </telerik:RadDateTimePicker>
                              </div>
                           </div>
                        </p>
                        <p>
                           <div style="display: inline-block">
                              <div style="float: left; width: 76px; text-align: right; padding-right: 5px; padding-top: 5px;">
                                 <asp:Label ID="Label3" runat="server" ForeColor="#333333" Text="Permanent"></asp:Label>
                              </div>
                              <div>
                                 <asp:CheckBox ID="chkPerm" runat="server" />
                                 <asp:HiddenField ID="hidPerm" runat="server" Value='<%# Bind("Perman") %>' />
                              </div>
                           </div>
                        </p>
                        <p>
                           <telerik:RadComboBox ID="StatusComboBox" runat="server"
                              DataSourceID="StatusDataSource" DataTextField="Status"
                              DataValueField="StatusId" Label="Status"
                              SelectedValue='<%# Bind("StatusId") %>' Visible="false">
                           </telerik:RadComboBox>
                        </p>
                     </div>
                     <!-- ** -->
                     <div>
                        <telerik:RadTextBox ID="DescriptionTextBox" runat="server" Columns="30"
                           Label="Notes" Rows="4" Text='<%# Bind("Description") %>' TextMode="MultiLine">
                        </telerik:RadTextBox>
                     </div>
                  </div>
                  <asp:Panel ID="Panel1" runat="server" CssClass="rsAdvancedSubmitArea">
                     <div class="rsAdvButtonWrapper">
                        <asp:LinkButton ID="UpdateButton" runat="server" CommandName="Insert"  CausesValidation="true"
                           CssClass="rsAdvEditSave"> <span><%# Container.Appointment.Owner.Localization.Save%></span></asp:LinkButton>
                        <asp:LinkButton ID="CancelButton" runat="server" CausesValidation="false"
                           CommandName="Cancel" CssClass="rsAdvEditCancel">
                           <span><%# Container.Appointment.Owner.Localization.Cancel%></span>
                           </asp:LinkButton>


                     </div>
                  </asp:Panel>
               </div>
            </div>
         </AdvancedInsertTemplate>

[Ivana]

Hello Mike,

The custom validator should work fine in that scenario if you have set the ClientValidationFunction right.
Here is an example how it should be:
JS:

function clientValidationFunction(source, arguments) {
        }

In that method, you could check if the typed text in the input field of the RadComboBox corresponds to the text of any item from the RadComboBox items collection, and respectively set arguments.IsValid to "true".

Another approach is to prevent the users from typing some particular characters in the RadComboBox's input field, using regular expressions.

If you are still having troubles, please send us a support ticket with a runnable sample page attached to it, so we can troubleshoot the issue locally. 

Greetings,
Ivana
the Telerik team