jqueryui

Tweet

$("#ddl").kendoDropDownList({
    height: 300,
    optionLabel: "select...",
    index: 0,
    dataTextField: "name",
    dataValueField: "name",
    dataSource: {
        serverFiltering: true,
        transport: {
            read: {
                url: "http://ws.geonames.org/searchJSON",
                dataType: "json",
                data: {
                    featureClass: "P",
                    style: "full",
                    maxRows: 12,
                    name_startsWith: function() {
                        return "g";
                    }
                }
            }
        },
        schema: {
            data: "geonames"   
        }
    }
});

$("#combobox").kendoComboBox({
    index: 0,
    dataTextField: "name",
    dataValueField: "name",
    filter: "startswith",
    dataSource: {
        serverFiltering: true,
        transport: {
            read: {
                url: "http://ws.geonames.org/searchJSON",
                dataType: "json",
                data: {
                    featureClass: "P",
                    style: "full",
                    maxRows: 12,
                    name_startsWith: function() {
                        return $("#combobox").data("kendoComboBox").text();
                    }
                }
            }
        },
        schema: {
            data: "geonames"   
        }
    }
});

$("#autocomplete").kendoAutoComplete({
    dataTextField: "name",
    animation: false,
    dataSource: {
        serverFiltering: true,
        transport: {
            read: {
                url: "http://ws.geonames.org/searchJSON",
                dataType: "json",
                data: {
                    featureClass: "P",
                    style: "full",
                    maxRows: 12,
                    name_startsWith: function() {
                        return $("#autocomplete").val();
                    }
                }
            }
        },
        schema: {
            data: "geonames"   
        }
    }
});