Custom Editor For a Bound Property and validation

7 posts, 0 answers
  1. Alain
    Alain avatar
    5 posts
    Member since:
    Sep 2014

    Posted 07 Jan 2015 Link to this post

    Based on your documentation example (http://docs.telerik.com/kendo-ui/aspnet-mvc/helpers/grid/editor-templates), I replaced the DropDownList by a ComboBox element, used it with an editable Grid displaying orders and tried to achieve following scenario:
    -when I add a new Order, I want the Grid to switch in inline edit mode with ComboBox having no item selected (means displaying Placeholder text)
    -use of client validation to ensure that an Employee has been selected in the ComboBox

    I ran in 2 issues:
    -If I did not set a DefaultValue for my model field in the View I got an error saying that "employee is not defined". So I set a DefaultValue with a new instance of Employee. But it affected my Combobox comportment by displaying a "0" (because EmployeeID in new instance of Employee was not set and is a type of int)
    -I was unable to set client validation by using annotation in Order model for Employee property, because dat-val-* was not added to Combobox element (worked fine for other element like textbox)

    So, what am I doing wrong? What am I missing? Please provide sample code.

    Thanks
    Alain
  2. Alain
    Alain avatar
    5 posts
    Member since:
    Sep 2014

    Posted 08 Jan 2015 Link to this post

    Would it be a better approach to use ForeignKeyColumn to handle null value (instead of Bound Property Column) and display a "Please select" in the ComboBox ?

    Thanks
    Alain
  3. Petur Subev
    Admin
    Petur Subev avatar
    1882 posts

    Posted 09 Jan 2015 Link to this post

    Hello Alain,

    I would suggest you to use ID column instead of "nested object" column. You just need to set the data-value-primitive options of the ComboBox to true. And Also specify that the value field of the placeholder of the ComboBox is an empty string or 0,  and the default vlaue for that item is also empty string or 0.

    Here is a simplified example that should give you the idea:

    http://dojo.telerik.com/@pesho/uRaQU/2

    Kind Regards,
    Petur Subev
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  4. Alain
    Alain avatar
    5 posts
    Member since:
    Sep 2014

    Posted 12 Jan 2015 in reply to Petur Subev Link to this post

    Thanks for your reply

    I extended your simple example. I want to validate user input, more than just having the Position field as required. As this field is a ComboxBox in editing mode, how can I ensure that user writes only values contained in the list?

    I tried to implement a custom validation rule based on your demo (http://demos.telerik.com/aspnet-mvc/grid/editing-custom-validation) but I am not able to get the validation fired.

    I am using Kendo UI Server-Side wrappers (Html.Kendo().ComboBox()), C# models () and JS (to register custom validation rules). Do I need to strickly follow your simplified example a only use JS ?

    Regards
    Alain
  5. Petur Subev
    Admin
    Petur Subev avatar
    1882 posts

    Posted 14 Jan 2015 Link to this post

    Hello Alain,

    ComboBox's purpose is to allow user to pick item from the list or to type cusotm value, this is why it is called ComboBox. If you want to restrict the user to only pick value from a list consider using a DropDownList. I assume  you were looking for the ComboBox becase it has filtering but notice the DropDownList also sports such filter

    Kind Regards,
    Petur Subev
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  6. Alain
    Alain avatar
    5 posts
    Member since:
    Sep 2014

    Posted 14 Jan 2015 in reply to Petur Subev Link to this post

    Hi Petur,

    You are right, DropDownList might be a better choice to restrict the user to only pick value from a list. But then, how can I validate user choice (to be different from Option Label) ? I've tried to use validation rules (with data annotations) but the validation is not fired and tooltips are never display for the DropDownList.

    Regards
    Alain
  7. Alain
    Alain avatar
    5 posts
    Member since:
    Sep 2014

    Posted 15 Jan 2015 in reply to Alain Link to this post

    Thanks for your help. 

    I finally manage to make it work. The main issue with custom validation and data annotations was that some data-val-* attribute were not correctly generated. Using ComboBoxFor or DropDownListFor helpers instead of (ComboBox or DropDownList) helped me to solved the issue.

    Regards
    Alain
Back to Top