Multiselect with free text

6 posts, 0 answers
  1. Ivailo
    Ivailo avatar
    2 posts
    Member since:
    Jul 2013

    Posted 07 Apr 2015 Link to this post

    Hi,

     is there a multiselect with an option to add free text values ?

  2. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2564 posts

    Posted 09 Apr 2015 Link to this post

    Hello Ivailo,

    I am afraid that there is no such functionality currently available. You can submit this as a feature request on UserVoice, so that it is considered for implementation in a future release.

    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. Luciano Kaesemodel
    Luciano Kaesemodel avatar
    26 posts
    Member since:
    Apr 2007

    Posted 14 Jul 2015 Link to this post

    Hello Kiril,

    It has been implemented?

    tks.
  5. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2564 posts

    Posted 15 Jul 2015 Link to this post

    Hello Luciano,

     

    We still do not have this implemented. As I said you can open or vote for a feature request in our feedback portal and if it gets popular we will see it implemented.

     

    Regards,
    Kiril Nikolov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  6. Nariman
    Nariman avatar
    32 posts
    Member since:
    Aug 2013

    Posted 23 Jul 2015 in reply to Kiril Nikolov Link to this post

    Hi Ivailo and Kiril,

    You might be interested in my solution below which does exactly what you are looking for, however it's working with all the previous version of Kendo Builds except "Kendo 2015 Q2". I have already reported the bug under another post in this forum and waiting for reply.

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <title>Kendo UI Snippet</title>
     
     
        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    </head>
    <body>
       
    <select id="multiselect"></select>
       
    <script>
    var data = [{TagText: "Albania", id: "Albania"},
                {TagText: "America", id: "America"}];
    var _savedOld = "";
     
    function multiselect_change(e) {
      var previous = _savedOld
      var current = this.value();
      var diff = [];
      if (previous) {
        //check for removed selected items
        diff = $(previous).not(current).get();
        if (diff.length > 0){
          alert("Removed Item = "+diff);
        }else{
          //check for new selected items
          diff = $(current).not(previous).get();
          if (diff.length > 0){
            alert("New Item = "+diff);
            }
        }
        this.refresh();
      }
      _savedOld = current.slice(0);
    }
    function multiselect_filtering(e) {
      //get filter descriptor
      var filter = e.filter;
      if (filter.value.indexOf(",") > 0){
        var newtag = filter.value.replace(",","");
        var values = this.value().slice();
        this.dataSource.filter({});
        //e.preventDefault();
        this.dataSource.add({ id: newtag, TagText: newtag });
     
        var add = [newtag];
        if (values.length > 0) {
          var merge = $.merge(add,values);
          this.value($.unique(merge));
        }else{
          this.value(add);
        }
        this.trigger("change");
        this.dataSource.refresh();
      }
    $("#multiselect").kendoMultiSelect({
      dataTextField: "TagText",
      dataValueField: "id",
        filter: "contains",
      dataSource: data
    });
    var multiselect = $("#multiselect").data("kendoMultiSelect");
    multiselect.bind("filtering", multiselect_filtering); 
    multiselect.bind("change", multiselect_change);
    _savedOld = multiselect.value(); 
       
      </script>
    </body>
    </html>

  7. Georgi Krustev
    Admin
    Georgi Krustev avatar
    3706 posts

    Posted 27 Jul 2015 Link to this post

    Hello Nariman,

    I answered the forum thread you've mentioned. For those who are interest in this solution please refer to the demo posted in the thread:
    Regards,
    Georgi Krustev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
Back to Top
Kendo UI is VS 2017 Ready