Dynamic Content?

3 posts, 0 answers
  1. Matt
    Matt avatar
    3 posts
    Member since:
    Jan 2015

    Posted 14 Apr 2015 Link to this post

    my attempt (Where I have Kendo DropDownList 1 as #Type and Kendo DropDownList 2 as #Units:

                $('#Type').change(function (e) {
                    //if (e.target.value == "Electirc") {
                    var val = e.target.value;
                    var ddL = $('#Units').data("kendoDropDownList")

                    if (val == "Electric") {
                        ddl.dataSource.data({Text:"-", value:"null"},{Text:"kW", value:"kW"},{Text:"GJ", value:"GJ"})
                        //$("#Units").html("<option value='null'>item1:-</option><option value='kW'>item1: kW</option><option value='GJ'>item1: GJ</option>");
                    } 
                })

    The goal would be to have the contents of DDL2 to change based on the selection by DDL1

  2. Matt
    Matt avatar
    3 posts
    Member since:
    Jan 2015

    Posted 14 Apr 2015 in reply to Matt Link to this post

    in case anyone is intrested:

                $('#Type').change(function (e) {
                    var val = e.target.value;
                    var ddL = $('#Units').data("kendoDropDownList").dataSource;

                    var length = ddL._data.length;
                    if (length != 0) {
                        for (var i = length; i >= 0; i--) {
                            ddL._data.remove(ddL._data[i]);
                        }
                    }
                    if (val == "Electric") {
                        ddL.add({Text:"-", value:"null"});
                        ddL.add({Text:"kW", value:"kW"});
                        ddL.add({ Text: "GJ", value: "GJ" });
                    }
                    else if (val == "Natural Gas" || val == "Fuel Oil") {
                        ddL.add({ Text: "-", value: "null" });
                        ddL.add({ Text: "ft³", value: "CubicFeet" });
                        ddL.add({ Text: "therms", value: "therms" });
                    }
                    else if (val == "Water") {
                        ddL.add({Text:"-", value:"null"});
                        ddL.add({Text:"Gal", value:"Gallons"});
                        ddL.add({ Text: "L", value: "Liters" });
                    }
                })

  3. UI for ASP.NET MVC is VS 2017 Ready
  4. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2566 posts

    Posted 16 Apr 2015 Link to this post

    Hello Matt,

    You can also check the cascading dropdownlists demo, where the content is filtered based on parent selection:

    http://demos.telerik.com/kendo-ui/dropdownlist/cascadingdropdownlist

    Regards,
    Kiril Nikolov
    Telerik
     

    See What's Next in App Development. Register for TelerikNEXT.

     
Back to Top