multiSelect in kendo grid popup

5 posts, 0 answers
  1. Michael
    Michael avatar
    27 posts
    Member since:
    May 2011

    Posted 10 Sep 2015 Link to this post

    I have an editor configured for a column which can reflect multiple values - the multiselect control binds to the source datasource just fine when a grid row is edited or a new record is being created but for the pure edit portion I need to preselect the current values from the grid row datasource - the values are there in the row object because I can see them when I do a console.log of the model field via e.model.get("UserRoleSectors") (example of value is  ["2","25"] ) - however in the grid edit event handler if I try to set the value for the multi-select to ensure it reflects what values are already bound to the record via the statement e.container.find('[name="UserRoleSectors"]').data("kendoMultiSelect").value(e.model.get("UserRoleSectors")); - nothing is selected even though the values are available in the multiselect.  Am I doing something wrong?

    editor: function (container, options) {
                      // create an input element
                      var input = $('<select multiple="multiple" />');
                      // set its name to the field to which the column is bound
                      input.attr("name", options.field);
                      // append it to the container
                      input.appendTo(container);
                      // initialize a Kendo UI MultiSelect
                      input.kendoMultiSelect({
                          autoBind: true,
                          valuePrimitive: true,
                          dataTextField: "SectorAcronym",
                          dataValueField: "SectorNo",
                          dataSource: $scope.sectorsDataSource
                      });

  2. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2565 posts

    Posted 12 Sep 2015 Link to this post

    Hello Michael,

     

    I would suggest you check this code library (or this one), which shows how to use a MultiSelect widget as an editor in grid widget. Please check it and let me if I can be of any further assistance.

     

    I would also suggest you to check this blog post that looks really useful:

     

    https://onabai.wordpress.com/2013/07/17/kendoui-multiselect-in-a-grid-yes-we-can/

     

    https://onabai.wordpress.com/2013/07/17/kendoui-multiselect-in-a-grid-part-2-yes-we-can/

     

    Regards,
    Kiril Nikolov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
  4. Michael
    Michael avatar
    27 posts
    Member since:
    May 2011

    Posted 14 Sep 2015 Link to this post

    Kiril,

    I had seen those articles before but kind of glossed over them - after looking over them again it dawned on me what was possibly wrong and have resolved the issues.  The basic gist is that the array of current values from the model object the grid is bound to was not truly being treated as an array so I had to encapsulate it in a JSON.parse call like so in order to get the values to be selected after the multi-select control was bound to its datasource.  The new logic in the kendo grid edit event handler is like so:

     

    e.container.find('[name="UserRoleSectors"]').data("kendoMultiSelect").value(JSON.parse(e.model.get("UserRoleSectors")));

  5. Nariman
    Nariman avatar
    32 posts
    Member since:
    Aug 2013

    Posted 17 Jul Link to this post

    Hello,

    I've implemented the MultiSelect Editor (with grouping) in Kendo Grid which was working fine with previous version of Kendo UI Professional version 2016.2.607 but right after we upgraded to the latest version 2016.2.714 the MultiSelect grouping inside the grid editor is no longer working (grouping is not showing). and I managed to pinpoint the problem to "autobind: false". In the new kendo 2016.2.714 version if the autobind is false in multiselect editor inside the grid THEN the Multiselect grouping is not shown!!! but in previous versions (2016.2.607) my very same code is working fine! Herewith below is my MultiSelect Editor code:

            $('<select name="prd" multiple="multiple" data-bind="value : ' + options.field + '"/>')
            .appendTo(container)
            .kendoMultiSelect({
                placeholder: "Select lookup group...",
                dataTextField: "txt",
                dataValueField: "val",
                autoBind: false,
                dataSource: {
                    data: [
                        { txt: "110", val: "Color:110", tag: "Color" },
                        { txt: "XTXX20K", val: "Item Group:XTXX20K", tag: "Item Group" },
                        { txt: "A", val: "Color Class:RM", tag: "Color Class" }
                    ],
                    group: { field: "tag" }
                }
            });

    Please help to address this new bug and let us have the fix ASAP.

    Thank you.

  6. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2565 posts

    Posted 18 Jul Link to this post

    Hi,

    Can you please try with the latest version released last week? If this does not help - open a separate support request with more details and we will be happy to help.

    Regards,
    Kiril Nikolov
    Telerik by Progress
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
Back to Top
Kendo UI is VS 2017 Ready