Dropdown issue/questions

4 posts, 0 answers
  1. Michael
    Michael avatar
    4 posts
    Member since:
    Jun 2016

    Posted 29 Jun Link to this post

    I have an angular directive that wraps a virtual kendo ui dropdown.  The issue i'm having is that even though i am setting the dataValueField when i select an dropdown item the k-ng-model bound field is set to the entire item object rather than  the property of the object specified by the dataValueField.  Not sure what i'm doing wrong.

     

    var selectDataSource = new kendo.data.DataSource({
                transport: {
                  read: function(options) {
                    var currentPage = getItemPage(options.data.skip, options.data.take);
                    options.success(currentPage);
                  }
                },
                schema: {
                  data: "currentPage",
                  total: "total"
                },
                pageSize: pageSize,
                serverPaging: true // enable serverPaging so take and skip are sent as
              });  
     
            //setup the dropdown options object
            scope.dropDownListOptions = {
              dataTextField: scope.textField,    // 'name' 
              dataValueField: scope.valueField,  // 'id'
              dataSource: selectDataSource,
              height: height,
              virtual: {
                itemHeight: 26,
                valueMapper: function(options) {
                    var itemIndex = scope.itemList.findIndex(function(element, index, array){
                    return options.value === element[scope.textField];
                  });
                  options.success(itemIndex);
                }
              }
            }

     

     

    /*directive html*/

    <select id="{{selectId}}"
            kendo-drop-down-list 
            k-options="dropDownListOptions" 
            k-ng-model="modelValue"></select>

     

    The other question relates to the optionLabel default option.  Is there any way to disable this option so that the user can't select it?

     

  2. Georgi Krustev
    Admin
    Georgi Krustev avatar
    3706 posts

    Posted 01 Jul Link to this post

    Hello Michael,

    I would suggest you check the k-ng-model documentation and more specifically the k-value-primitive support:

    http://docs.telerik.com/kendo-ui/AngularJS/introduction#the-k-value-primitive-attribute

    Regards,
    Georgi Krustev
    Telerik
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
  3. Kendo UI is VS 2017 Ready
  4. Michael
    Michael avatar
    4 posts
    Member since:
    Jun 2016

    Posted 01 Jul in reply to Georgi Krustev Link to this post

    That fixed the one issue.  However i need to find a way to prevent the user from selecting the default optionLabel.  I don't want them selecting this.  Is there any way to disable/prevent the uses from selecting this/disable it?
  5. Michael
    Michael avatar
    4 posts
    Member since:
    Jun 2016

    Posted 01 Jul in reply to Michael Link to this post

    Figured out a fix:

     

    open: function () { $('.k-list-optionlabel').hide(); },

Back to Top
Kendo UI is VS 2017 Ready