Accessing the Selected DataText and DataValue withing an Event Script

3 posts, 0 answers
  1. Kevin Gill
    Kevin Gill avatar
    2 posts
    Member since:
    Oct 2006

    Posted 12 Jul Link to this post

    Accessing the Selected DataText and DataValue

    Please help...

    @(Html.Kendo().ListBox()
    .HtmlAttributes(new { title = "Accounts"})
    .Name("ListAccounts")
    .DataTextField("AccountName")
    .DataValueField("AccountID")
    .BindTo(Model)
    .Events(events => events.Change("onChange"))
    )

    <script>
    function onChange(e) {
    var value = $("#ListAccounts").data("kendoListBox").dataSource._data[$("#ListAccounts").data("kendoListBox").selectedIndex].value;
    GetFleetAssets(value);
    }
    </script>

    How can i get the DataValueField "AccountID" for the selected item within an Event Script? I can see that the data is loaded by viewing the source.

    script above does not function

  2. Kevin Gill
    Kevin Gill avatar
    2 posts
    Member since:
    Oct 2006

    Posted 12 Jul Link to this post

    Just tried the following but still no joy...

    <script>
        function onChange(e) {
            var selectedID = $.map(this.select(), function (item) {
                return $(item).index("AccountID");
            });
            GetFleetAssets(selectedID);
        }
    </script>

  3. Stefan
    Admin
    Stefan avatar
    1365 posts

    Posted 14 Jul Link to this post

    Hello Kevin,

    I already provided an answer to the same question in a ticket.

    I will share the approach in the thread, so more people can benefit from it:

    "
    The desired result can be achieved on the change(or another custom) event, by retrieving first the selected element, and then based on the selected element to retrieve the information for the dataItem associated with that line:

    function onChange(e) {
        var element = e.sender.select();
        var dataItem = e.sender.dataItem(element[0])
        console.log(dataItem)//In the application dataItem.AccountID should return the desired value
    }


    http://docs.telerik.com/kendo-ui/api/javascript/ui/listbox#methods-select

    http://docs.telerik.com/kendo-ui/api/javascript/ui/listbox#methods-dataItem
    "


    Regards,
    Stefan
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top