Kendo DropDownList get element from json data other than dataTextField or dataValueField

Question

So i have two dropdownlists and i would like to get another json property from the second dropdownlist other than the ones attributed to dataTextField or dataValueField. Here's the refered dropdownlist:

$("#campoFormLinha"+index).kendoDropDownList({

        optionLabel: "Campo",
        dataTextField: "name",
        dataValueField: "id",
        dataSource: {
            type: "json",
            serverFiltering:true,
            transport: {

                read:{
                    url:"${pageContext.request.contextPath}" + "/newlayout/mySearchesFormFieds.do",
                    data:function(){
                        return {formId: $("#dynamicFormLinha"+index).val()
                        };
                    }
                }
            }
        },
        cascadeFrom: "dynamicFormLinha"+index
    }).data("kendoDropDownList");

here's the json it returns:

[{"id":9,"name":"Cliente","type":"STRING"},{"id":10,"name":"Contribuinte","type":"STRING"},{"id":11,"name":"Facturação","type":"STRING"},{"id":12,"name":"Conta","type":"STRING"},{"id":13,"name":"Factura","type":"STRING"},{"id":14,"name":"Valor","type":"STRING"}]

So assuming all this, i would like to get the type property according to the selected option.

How can i do this?

Answer 1

Please try with the below code snippet.

<script type="text/javascript">
    function getSlectedItem() {
        var ddl = $("#color").data("kendoDropDownList");
        alert(ddl.dataSource.data()[ddl.selectedIndex - 1].type);
    }

    function onSelect(e) {
        alert(e.sender.dataSource.data()[e.item.index() - 1].type);
    }

    $(document).ready(function () {
        var data = [
                { text: "Black", value: "1", type: "string" },
                { text: "Orange", value: "2", type: "int" },
                { text: "Grey", value: "3", type: "string" }
            ];

        $("#color").kendoDropDownList({
            dataTextField: "text",
            dataValueField: "value",
            dataSource: data,
            optionLabel: "select",
            select: onSelect
        });
    });

</script>

1. On selection you will get the type field of this item
2. On button click you will also get the type field of this item

Let me know if any concern.