Need example of code that handles change event for dropdown

4 posts, 1 answers
  1. Bob
    Bob avatar
    7 posts
    Member since:
    Jan 2013

    Posted 20 Jan 2013 Link to this post

    I'm starting to worry a little that I paid a lot of money for something that may not work. The comments on this forum about MVC are scaring me.
    What I want to do is to post to my controller when someone changes the selected item on a kendo dropdown list. All of the examples show this as how to process the change event:

    function change(e) {
        // handle change event
    };


    I've got this in my view:
    @(Html.Kendo().DropDownList()
        .Name("StatesDDL")
        .DataTextField("StateName")
        .DataValueField("StateID")
        .DataSource(s =>
        {
            s.Read(r =>
                {
                    r.Action("GetStates", "Donation");
                });
        })
        .SelectedIndex(selectedState)
        .Height(300)
        //.HtmlAttributes(new { id = "StateDDL" })
         
        .Events(e =>
            {
                  
                e.Change("change")/*.Select("select")*/;
            })
    )


    The control gets populated with all the items and when I click on an item the value in the control changes. The event fires - I can hit the breakpoint that I set in my event handler but I've tried everything I can think of to find out what the new selected value is, but everything shows up as undefined.

    Here are just some of the things I've tried:

    function change(e) {
     
        var x = $('StatesDDL option:selected').text();
        var y = $('StateDDL option:selected').val();
        var z = $("StatesDDL").val("DataTextField").val("StateName");
        var z1 = $("StatesDDL").data("DataTextField", "StateName").val();
        var z2 = $("StatesDDL").data("DataValueField", "StateID").val();
        var z3 = $('StatesDDL').data();
        var z4 = $(this).text();
     
        alert("Changed");
     
        // how to get value that was selected?
        // how to get the changed value?
        // I want to then use ajax to sent that up to my controller
    };



    Nothing works. I just don't seem to be able to get the selected value and I can't find any example of how to "handle" the event. I cannot believe that it isn't something really stupid that I'm doing.


  2. Answer
    Dimiter Madjarov
    Admin
    Dimiter Madjarov avatar
    2156 posts

    Posted 21 Jan 2013 Link to this post

    Hello Bob,

    This is a quote from my answer in the support thread, that you opened:

    Thanks for contacting Telerik support. You are on the right way with this. You can get the selected item in the Select Event of the DropDownList. To get information about this item, you could use the dataItem() method. Here you can find a detailed demo on this topic:

    Drop Down List Events Demo

    Please let me know if this information helps you. Have a nice day.

     

    If you need additional assistance, please continue only one of those threads (forum or support). 

    Kind regards,
    Dimiter Madjarov
    the Telerik team
    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. Thomas
    Thomas avatar
    7 posts
    Member since:
    Sep 2011

    Posted 22 Apr 2014 Link to this post

    I'm trying to do the same thing as Bob, I need to get the displayed value when a user tab out of the box. if a user Tab out then shift-Tab to go back into the box and use the up or down arrow to select another value, the select event is not called again if they tab out the second time.
  5. Thomas
    Thomas avatar
    7 posts
    Member since:
    Sep 2011

    Posted 22 Apr 2014 in reply to Thomas Link to this post

    Thomas said:I'm trying to do the same thing as Bob, I need to get the displayed value when a user tab out of the box. if a user Tab out then shift-Tab to go back into the box and use the up or down arrow to select another value, the select event is not called again if they tab out the second time.


    Figured it out myself. Use the same script as the select but instead of e.item.index() you want to use this.selectedIndex
    ~Robert John
Back to Top
UI for ASP.NET MVC is VS 2017 Ready