This is a migrated thread and some comments may be shown as answers.

Validating combobox for a set of values

5 Answers 1641 Views
Validation
This is a migrated thread and some comments may be shown as answers.
Raja
Top achievements
Rank 1
Raja asked on 16 Jul 2014, 09:18 PM

Hi,

i am trying to validate input for a combobox and trying to make sure that user entered/selected value from a pre-defined list of values. I am using MVVM. I tried this in two ways.

1. Using onChange event of the combobox
     I am able to validate the input as below.
     

selectionChanged: function (e) {
        if (e.sender.value() && e.sender.selectedIndex == -1)
        {
           //how to mark the control as invalid??
        }
    }

     Problem is i am not able to mark the control as invalid so that kendo framework displays the error message. I have a required validation on this field already.

2. Using rules
$(".entryform").kendoValidator({
        rules: {
            validRoom: function (input) {
                if(input.is("[name=Room]"))
                {
                    if (input.val() && input.selectedIndex != -1)
                    {
 
                    }
                }
                return true;
            }
        }
    });
Here there is no selectedIndex.

Please help.

5 Answers, 1 is accepted

Sort by
0
Raja
Top achievements
Rank 1
answered on 17 Jul 2014, 05:30 PM
I am able to do this with custom rules (Point 2 above) with change in the code. But there is a little hiccup. Here is the code.

$(".entryform").kendoValidator({
        rules: {
            invalidRoom: function (input) {
                if(input.is("[name=Room]"))
                {
                    if (input.val()!= "" && $("#Room").data("kendoComboBox").selectedIndex == -1)
                    {
                        return false;
                    }
                    return true;
                }
            }
        },
        messages: {
            invalidRoom: "Room number is invalid."         
      }

Is this the right way? Actual hiccup now is the validation message appears at two places. See the attached image.
0
Raja
Top achievements
Rank 1
answered on 17 Jul 2014, 05:37 PM
Few minutes after my previous post I found out that it is an issue with the code. It is a problem with the placement of return statement. Below code worked fine.

$(".entryform").kendoValidator({
        rules: {
            invalidRoom: function (input) {
                if(input.is("[name=Room]"))
                {
                    if (input.val()!= "" && $("#Room").data("kendoComboBox").selectedIndex == -1)
                    {
                        return false;
                    }
                }
                return true;
            }
        },
        messages: {
            invalidRoom: "Room number is invalid."        
      }
0
Rosen
Telerik team
answered on 18 Jul 2014, 12:04 PM
Hello Raja,

Indeed, the "double" messages is due to the fact that not all of execution path of custom rule function returns value. As you may know in JavaScript all functions return false if they do not return something explicitly. Thus, in you case the function returns false for all of the inputs which does not have name Room (there is no return in "the else path" of this if statement), marking them as invalid and showing the invalid message for this rule.

Regards,
Rosen
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Raja
Top achievements
Rank 1
answered on 07 Aug 2014, 05:49 PM
Some how this broke again. Code is not changed. I have two validations on this combobox. Required validation and a custom validation as mentioned above to validate if user has selected a value from the list.

I can see the validation hits the function and returns false. I can also see the message if I go to html markup in debugger tools but the tool tip is not displayed. It always has display:none. Not sure whats gone wrong.
0
Alexander Valchev
Telerik team
answered on 11 Aug 2014, 12:24 PM
Hi Raja,

Is it possible for you to set-up a small runnable Kendo UI Dojo test page which isolates the issue? In this way I will be able to examine your exact scenario in details and assist you further.
Thank you in advance for the cooperation.

Regards,
Alexander Valchev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
Validation
Asked by
Raja
Top achievements
Rank 1
Answers by
Raja
Top achievements
Rank 1
Rosen
Telerik team
Alexander Valchev
Telerik team
Share this question
or