pageSize()

5 posts, 0 answers
  1. Dr.YSG
    Dr.YSG avatar
    210 posts
    Member since:
    Dec 2009

    Posted 18 Jun 2012 Link to this post

    I have a dataSource that is configurable by the user. Programmatically, that means I want to set the pageSize each time before I do the .read() on the dataSource.

    But I am finding (version 515) using Fiddler that when I change the pageSize (the datasource fires off a read (with no parameters) and then when the read() happens a few lines later there is a second getURL request:

    I want to configure the DataSource so that it is only fired manually.

    Here is another oddity, this double HTTP Get only happens once. The next time I proceed through the code, setting pageSize() does not cause an HTTP Get, (only the .read() does).

    Just to make this more clear the setting .pageSize() fires this request
    GET /SearchBoxInRange HTTP/1.1

    and two lines later the searchData.read() fires of this request:

    GET /SearchBoxInRange?requestBox=((42.23903905725251%2C+-71.22695843505858)%2C+(42.49270487579739%2C+-70.90904156494139))&within=false HTTP/1.1

    The second is the correct one. The first is spurious.

        var pagesize = $("#PageSizeSelect").data("kendoDropDownList").value();
        alert("page size is now: " + pagesize);
        searchData.pageSize(parseInt(pagesize));
     
    // makes a second request - which works and has the new pagesize set
    // searchData is a kendo dataSource object
      searchData.read(searchBox);
  2. Rosen
    Admin
    Rosen avatar
    3234 posts

    Posted 20 Jun 2012 Link to this post

    Hi,

    The behavior you have described is expected and it is by design. When the page size is changed (and some of the server operations are enabled) request is made as more and/or different data may be needed. 

    Note that if DataSource is not populated yet, calling pageSize, sort, filter, group or any similar method will issue a request through the transport  to populate the component. Also if you are setting multiple options such as pageSize, filter, sort, page etc. simultaneously you may find the query method more appropriate (it will also issue a request to populate the DataSource if it is not populated yet).

    Regards,
    Rosen
    the Telerik team
    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. Dr.YSG
    Dr.YSG avatar
    210 posts
    Member since:
    Dec 2009

    Posted 20 Jun 2012 Link to this post

    I am not sure why only when the DataSource is not populated, does a .pageSize() request cause a GET. I don't doubt you have a reason for this, but the logic is eluding me. (also an DataSource.enabled: true/false attribute  would be useful, that way I could build it incrementally and now worry about these things till I enabled it for the first .search() ).

    I know I can hack this so that it will work, but I am a much more prudent programmer, and I like to go with Telerik design philosophy. Tell me if I am approaching this problem wrong.

    What I have is a "template datasource" shown below that is created once at start-up:

        searchData = new kendo.data.DataSource({
            type:"json",
    //        pageSize:2000,
            transport:{
                read:{
                    url: AppGlobals.serverURL + "SearchBoxInRange",
                    dataType:"json"
                }
            },
            schema:{
                data:"results",
                total:"count",
                model:{
                    fields:{
                        idx:{ type:"string" },
                        size:{ type:"number" },
                        date:{ type:"date" },
                        type:{ type:"string" },
                        elevation:{ type:"number" },
                        source:{ type:"string" },
                        egplDate:{ type:"date" },
                        classification:{ type:"string" },
                        classificationVal:{ type:"number" },
                        handling:{ type:"string" },
                        originator:{ type:"string" },
                        datum:{ type:"string" },
                        product:{ type:"string" },
                        description:{ type:"string" },
                        bbox: {type:"string"},
                        path:{ type:"string" }
                    }
                }
            },
            error:function (e) {
                alert("DataMode.js datasource error: " +
                    "\nthrew: " + e.errorThrown +
                    "\nstatus: " + e.status +
                    "\nurl: " + e.sender.transport.options.read.url);
            },
            change:function (e) {
                newData(e);
            }
        });

    The server (transport.read.url: is typically localhost:4326/myWCFDataService )
    And for now it does not support paged data. It will return one large chunk of JSON data. So I really don't need pageSize here.

    But the data will be shown in a Grid so I do need to set pageSize later on in this dataSource (and pageSize can change depending on the user (I used to have a fixed value, which was working fine).

    The user will fill in a form and then press a search button (which might happen many times). Each time he does I execute the following:
    var searchBox = {
        requestBox:bounds,
        within:within,
        startDate:startDate.toISOString(),
        endDate:endDate.toISOString(),
        imageTypes:typeFilter
    };
    var pagesize = $("#PageSizeSelect").data("kendoDropDownList").value();
    searchData.pageSize(parseInt(pagesize));
    searchData.read(searchBox);

    Which you can see fills in various parameters for the DataSource.search() call and then executes it.

    This is all working just fine, but as I said, the very first call  of the day to searchData.pageSize() fires off a blank searchData.read() which has no parameters on the GET URL command.

    This means that the searchData.error function gets called. I can hack this so that the very first error is ignored, but that is really gross!

    (btw, searchData is also used to fill in Charts and other DataViz tools).

  5. Rosen
    Admin
    Rosen avatar
    3234 posts

    Posted 21 Jun 2012 Link to this post

    Hello,

    Directly sending data through the read method is not a suggested approach. You should use the transport.read's data setting instead (as shown here). This will ensure that those additional parameters will be send to the server every time a request is made. Thus, there will be no need for the additional read after the pageSize is set in case DataSource is not populated yet.

    All the best,
    Rosen
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  6. Dr.YSG
    Dr.YSG avatar
    210 posts
    Member since:
    Dec 2009

    Posted 21 Jun 2012 Link to this post

    Excellent Rosen,

    I had just marked this answered, and then I did a few more tests and I found out it is not really done yet.

    So now I am fetching the transport.read.data on demand:

    transport:{
        read:{
            url: AppGlobals.serverURL + "SearchBoxInRange",
            dataType:"json",
            data: function () {return SearchBox(); }
        }
    },

    and using DataSource.query({pageSize: newPageSize}) for each query invocation. And it feels good to do things in the recommended way.

    The issue now is that for each subsequent call to .query() the dataSource says that transport.read.data is now filled in, and it does not get the updated search parameters to add to the URL call.

    If I change this to a DataSource.read() then SearchData() does get called each time, and the call is correct. But only .query() has the ability to pass in {pageSize:} and .read() does not.

    The only thing is that there is no clue in the documentation that .read(data) is not recommended. It only says what it does.
Back to Top
Kendo UI is VS 2017 Ready