Filter on grid (in code), not datasource

4 posts, 1 answers
  1. Scott Buchanan
    Scott Buchanan avatar
    38 posts
    Member since:
    Dec 2008

    Posted 09 Aug 2015 Link to this post

    Greetings!  I wish to fill three grids from a single datasource (call to metered API).  The API returns 30 rows, I want rows 1 - 10 in grid1, rows 11-20 in grid2 and rows 21-30 in grid3.

    My data source (copied from your web API demo) is 

    $(document).ready(function () {
        var MedicareRiskDataSource = new kendo.data.DataSource(
        {
            transport: {
                read: {
                    url: "http://apiqa.frankcohengroup.com/ProcedureUtil/1/2013",
                    type: "GET",
                    dataType: "json",
                    beforeSend: function (req) {
                        req.setRequestHeader("FCG-ApiKey", "DA103B60C7A340FFA85532F716FC478D");
                    }
                }
            },
            schema: {
                data: function (response) {
                    return response.Metrics;
                },
                model: {
                    id: "MetricID",
                    fields: {
                        MetricID: {
                            type: "number"
                        },
                        MetricDescription: {
                            type: "string"
                        },
                        PhysicianValue: {
                            type: "number"
                        },
                        SpecialtyValue: {
                            type: "number"
                        },
                        VarianceValue: {
                            type: "number"
                        }
                    }
                }
            },

    I can filter here, with 

    filter: { field: "MetricID", operator: "lt", value: 11 }

     or 

    filter: {
        logic: "and",
        filters: [
            { field: "MetricID", operator: "gt", value: 10 },
            { field: "MetricID", operator: "lt", value: 21 }
        ]
    }
    etc.

    However, that would require three data sources and thus three calls to the API, which we pay for.

    My grids look alike, with different names

    $("#allServicesGrid").kendoGrid({
        dataSource: MedicareRiskDataSource,
        scrollable: false,
        columns: [
            {
                field: "MetricDescription",
                title: "Name",
                width: 400
            },
            {
            field: "PhysicianValue",
            title: "Physician",
            width: 100
        },
        {
            field: "SpecialtyValue",
            title: "Specialty",
            width: 100
        },
        {
            field: "VarianceValue",
            title: "Variance",
            width: 100
        }]
    });

    I've added "filterable" to the grid, but that
        1) enables the icon on the column header which I do not want

    2) 

     

     

     

     ​

  2. Scott Buchanan
    Scott Buchanan avatar
    38 posts
    Member since:
    Dec 2008

    Posted 09 Aug 2015 in reply to Scott Buchanan Link to this post

    Had some trouble with the backspace and posted the message whilst entering it.

    Anyway, adding filterable to the grid 
    1) enables the icon on the column header which I do not want
    2) did not seem to let me set initial values, which I do want.

    Thanks,
    Scott

  3. Kendo UI is VS 2017 Ready
  4. Answer
    Rosen
    Admin
    Rosen avatar
    3234 posts

    Posted 11 Aug 2015 Link to this post

    Hello Scott,

     

    I'm afraid that the DataSource does not support simultaneous having multiple views of data. Therefore, it is not possible single instance to be bound to separate widgets displaying different results. However, in this particular scenario, shown in the code you have pasted, you could use 3 separate DataSources which to be populated from the data of a remote one. Here is a test page which demonstrates such implementation.

     

    Regards,
    Rosen
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  5. Scott Buchanan
    Scott Buchanan avatar
    38 posts
    Member since:
    Dec 2008

    Posted 13 Aug 2015 in reply to Rosen Link to this post

    Rosen,

     That's very clever, but still simple.  Great answer.

    Scott

Back to Top
Kendo UI is VS 2017 Ready