Multiselect does not work when .Event(e => e...) is applied

5 posts, 0 answers
  1. Nicklas
    Nicklas avatar
    45 posts
    Member since:
    Oct 2012

    Posted 27 Jun 2013 Link to this post

    Not quite sure if I'm going about this wrong or it's the widget that has a bug in it.
    Whenever I use the .Event() in my code, the controller does not work properly. It transforms back to a textbox, and does not display the elements at all. I've even tried this with your code, found here:
    http://docs.kendoui.com/getting-started/using-kendo-with/aspnet-mvc/helpers/multiselect/overview

    This is your code:
    @(Html.Kendo().MultiSelect()
      .Name("multiselect")
      .BindTo(new string[] { "Item1", "Item2", "Item3" })
      .Events(e => e
            .Select("multiselect_select")
            .Change("multiselect_change")
      )
    )
    <script>
    function multiselect_select() {
        //Handle the select event
    }
     
    function multiselect_change() {
        //Handle the change event
    }
    </script>
    This is my code:
    @(Html.Kendo().MultiSelect()
      .Name("tags")
      .Placeholder("No tags selected for this unit")
      .BindTo(new SelectList(Model.TagNames))
      .Value(Model.TagNames)
      .Events(e => e
                .Select("tags_select")
                .Change("tags_change")
             )
      )
    <script>
    ...
    </script>
    Doing this results in the widget breaking, somehow. See attached images. I should also mention that the widget, when initialized without the .Event(), works. Allthough, it flickers before the initialization is completed and the inputbox, textbox or whatever it is before the css-styling is applied to it, appears.
  2. Dimiter Madjarov
    Admin
    Dimiter Madjarov avatar
    2159 posts

    Posted 01 Jul 2013 Link to this post

    Hi Nicklas,


    I tried the sample code from the documentation and it is working as expected on my side. Could you please check if there are any JavaScript errors in the console and that the names of the event handlers are defined correctly. If the problem still persist, could you reproduce it in some sample runnable project, that I could inspect on my side and send it to me in order to assist you further?

    I am looking forward to hearing from you.

     

    Regards,
    Dimiter Madjarov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. UI for ASP.NET MVC is VS 2017 Ready
  4. Nicklas
    Nicklas avatar
    45 posts
    Member since:
    Oct 2012

    Posted 02 Jul 2013 Link to this post

    Thank you Dimiter!

    Turns out that the multiselect is somewhat sensitive in regards to typos ;)
    In my .Events(), I had misspelled the js-method to be called on the event. This seem to have solved the issue! :) 
  5. salique
    salique avatar
    1 posts
    Member since:
    Jul 2013

    Posted 22 Aug 2013 Link to this post

    Hi,
    I faced the same issue regarding the multiselect the .Events does not work can you kindly help me on this

    <td style="width: 25%;">
                    @(Html.Kendo().MultiSelect()
                  .Name("markets")
                  .HtmlAttributes(new { style = "width:250px" })
                  .Placeholder("Select Market...")
                  .DataTextField("MarketName")
                  .DataValueField("MarketId")
                  .DataSource(source =>
                  {
      
                      source.Read(read =>
                      {
                          read.Action("GetMarket", "Controller")
                              .Data("filterMarket");
                      })
                      .ServerFiltering(true);
                  })
                  .Enable(false)
                  .AutoBind(false)
                .Events(evt => evt.Change("onChangeMarket"))
                  )
               
                    <script>
                        function filterMarket() {
                              
                            return {
                                scp: $("#scp").val()                         };
                        }
                    </script>
                    <script>
                        function onChangeMarket() {
                            debugger;
    // script code
      
                            }
                        </script>
                </td>
  6. Daniel
    Admin
    Daniel avatar
    2118 posts

    Posted 26 Aug 2013 Link to this post

    Hello,

    The code looks correct. How is the MultiSelect loaded? If it is in an editor template for a Grid or a ListView or is loaded via Ajax then the scripts containing the event handlers should be added before the widget.

    Regards,
    Daniel
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top
UI for ASP.NET MVC is VS 2017 Ready