Using a combo box to refresh a grid

3 posts, 0 answers
  1. Robert
    Robert avatar
    3 posts
    Member since:
    Nov 2012

    Posted 22 Dec 2013 Link to this post

    I am very much a newbie with Kendo. I have worked with some examples and been able to populate a grid with data from my API.

    I am trying to use a combo box to select the number of days of data to display, modify the API call and refresh the grid. Are there any examples or tutorials that cover that combination of controls?

    Thanks in advance,

    Rob
  2. Petur Subev
    Admin
    Petur Subev avatar
    1882 posts

    Posted 23 Dec 2013 Link to this post

    Hello Robert,

    Basically you need to send the values of those combo box to the server, and return the records based on these values. 

    You should use the data function of the read configuration of the dataSource's transport or you can also pass the parameters directly to the read method of the dataSource:

     $('#myGrid').data().kendoGrid.dataSource.read({myCombo: $('#comboname').data('kendoComboBox').value()})


    Kind Regards,
    Petur Subev
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. Robert
    Robert avatar
    3 posts
    Member since:
    Nov 2012

    Posted 24 Dec 2013 Link to this post

    Thanks for the reply Peter,

    What I was trying to do was build a URL and hit the API to get alternative data and display the results. I was able to do this as follows:

                $("#DaysDisp").change(function () {                              
                    CBdays = DaysDisp.value
                    dataU = "api/missionlist?days=" + CBdays
                    //alert(dataU);
                    $("#Mgrid").data("kendoGrid").setDataSource(
                        new kendo.data.DataSource({
                        type: "GET",
                        dataType: "json",
                        transport: {
                            read: dataU
                        },
                        pageSize: 10
                    }))

    Probably to verbose but it works.

    Regards,

    Rob
Back to Top