Problems with DataSource

[n/a]

Hi,

i have a question regarding the DataSource.

I am using the code below. I don't have it in a separate file but in the <script> tag of the HTML. It's not the entire code either, that would probably be an unnecessary amount here. My problem concerns the valueOrderFinished. Inside the DataSource in the schema, the value is set. That works well, because when I set the innerhtml of #outputtest, the right value is displayed. But when I try to access it outside, in my document ready function, I always get that valueOrderFinihed is undefined. 
What I also don't understand, when I debug this code, it jumps from the transport part of the DataSource directly into my createCharts() function, and then back into the schema part of the DataSource. 

I am really stumped and can't manage to solve the problem... can someone help me?

var showProfile = 0;

var valueOrderFinished;

[...]

            var dataSourceOrderFinished = new kendo.data.DataSource({
                transport: {
                    read: {
                        url: "Services/OrderServices.asmx/GetCountOrderFinished",
                        contentType: 'application/json; charset=utf-8',
                        type: "POST"
                    },
                    parameterMap: function (options) { return JSON.stringify({ parameter: options }); }
                },
                schema: {
                    data: function (result) {
                        console.log(result.d.Count);
                        document.getElementById("outputtest").innerHTML = result.d.Count;
                        valueOrderFinished = result.d.Count;
                    },
                    total: function (result) { return result.d.Count; }
                }
            }
            );



            /* */
            /* */
            /* ++++ Funktionen ++++ */
            $(document).ready(function () {
                console.log("dokument ready");
                hideProfileElements();
                console.log("Profilelemente versteckt");
                valueOrderFinished = dataSourceOrderFinished.read();
                console.log("datasource gelesen");
                console.log(valueOrderFinished);
                createCharts();
            });

[...]

[Neli]

Hi Markus,

I would suggest you double-check if the data is received by the time you are trying to get the valueOrderFinished in the document.ready() function. A possible reason for the variable being undefined is that the response is not received yet, thus there is no available value for the result.d.Count.

When the data.read() method is used you can use the returned promise to ensure that the data is loaded, byt the time you are trying to use the response. You can take a look at the second example in the following link from the API:

- https://docs.telerik.com/kendo-ui/api/javascript/data/datasource/methods/read

And here you will find a Dojo example where the fetch method is used to load the data from the remote endpoint. The createCharts function is also invoked after the data is fetched.

I hope you will find the provided information helpful.

Regards,
Neli
Progress Telerik

[n/a]

Hello,

 

thank you for your help. I tried using it and (at least i think) it almost works. But I have another problem. Whenever I use my DataSource as follows:

var dataSourceOrderFinished = new kendo.data.DataSource({
                transport: {
                    read: {
                        url: "Services/OrderServices.asmx/GetCountOrderFinished",
                        contentType: 'application/json; charset=utf-8',
                        type: "POST"
                    },
                    //parameterMap: function (data) { return JSON.stringify({ data }); }
                },
                schema: {
                    data: function (result) {
                        console.log("there were " + result.d.Count + " orders placed in the last " + result.d.Days + " days.");
                        document.getElementById("outputtest").innerHTML = result.d.Count;
                        valueOrderFinished = result.d.Count;
                    },
                    //total: function (result) { return result.d.Count; }
                }
            });

I get a specific error (this is in firefox):

in Chrome it is this one:

I do not understand where it comes from and how to solve.

When I look at my result in the F12 it looks fine:

[Neli]

Hi Markus,

Usually such error appears when the response which is received from the remote data source is not an array.

In the provided result I see that there is a peoperty for the count and number of days, but is there a list with the items that the remote endpoint returns? As the count I see in the result is 145, are there 145 items returned? Please provide more details about the entire response, so we could advise you further.

Regards,

Neli

[n/a]

Hi,

I tried gathering more information for you: to make it less confusing (Count not being the row count etc.), I have renamed the return values of my DataSource. The DataSource returns data according to the following scheme:

In the code, the DataSource variable is created as follows:

var dataSourceCountOrderFinished = new kendo.data.DataSource({
    type: "json",
    serverPaging: true,
    serverSorting: true,
    serverFiltering: true,
    pageSize: 25,
    transport: {
        read: {
            url: "Services/OrderServices.asmx/GetCountOrderFinished",
            contentType: 'application/json',
            type: "POST"
        },
        parameterMap: function (data) { return JSON.stringify({ parameter: data }); }
    },
    schema: {
        data: function (result) {
            console.log(result);
            console.log("there were " + result.d.OrderCount + " orders finished in the last " + result.d.OrderCountUsedDays + " days.");
            document.getElementById("finishedCount").innerHTML = result.d.OrderCount;
            document.getElementById("finished_numbers_footer").innerHTML = "in the last " + result.d.OrderCountUsedDays + " days";
            /*valueOrderFinished = result.d.Count;
            return result;*/
        },
        total: function (result) { return result.d.Count; }
    }
});

and is called in Document.Ready as follows:

$(document).ready(function () {


    var myWindow = $("#orderWindow");
    var undo = $("#selection-button");

    console.log("document ready");

    hideProfileElements();
    
    console.log("profile-elements hidden");

    dataSourceCountOrderFinished.read();
    dataSourceCountOrderNew.read();
    dataSourceCountOrderInProcess.read();
    dataSourceCountOrderTotal.read();
    dataSourceaverageProductionTime.read();


… more code follows here :-)

}

 

I have the following error in the console:

 

The code that fills the return is a C# script with a database query. Only the OrderCount variable is set and the OrderCountUsedDays variable.

I found a way to work around the error by writing the value in the DataSource variable to an InnerHTML element and reading that value later, but of course that's not a nice solution and not the point, and the constant error messages in the console bother me a lot.
I also tried to solve the whole thing with a list, because I have several DataSources that do not cause errors and they also work with list elements. Unfortunately this did not work.

For comparison, here is another DataSource that works without errors. This looks like this:

var inProgressOrdersDataSource = new kendo.data.DataSource({
    type: "json",
    serverPaging: true,
    serverSorting: true,
    serverFiltering: true,
    pageSize: 25,
    transport: {
        read: {
            url: "Services/OrderServices.asmx/GetOrderOpen",
            contentType: 'application/json; charset=utf-8',
            type: "POST"
        },
        parameterMap: function (options) { return JSON.stringify({ parameter: options }); }
    },
    schema: {
        data: function (result) {
            for (var i = 0; i < result.d.Order.length; i++) { result.d.Order[i].CreationDate = parseDate(result.d.Order[i].CreationDate); result.d.Order[i].CompleteDate = parseDate(result.d.Order[i].CompleteDate); }
            return result.d.Order;
        },
        total: function (result) { return result.d.Total; }
    }
});

I really am cueless, I hope you can somehow help me.

Thank you so much!

Markus

[Neli]

Hi Markus,

It is hard to suggest the reason for the observed issue without being able to troubleshoot and debug locally.

May I ask you to prepare and send us a Fiddler Jam log. 

Fiddler is a Chrome extension that captures network traffic, scripts, console errors, and other useful information that could potentially help me to identify the problem. You can find more information about Fiddler here:

- https://docs.telerik.com/kendo-ui/fiddler-jam-integration

Please make sure that you load the problematic page after the capturing has started.

Looking forward to your reply.

Regards,

Neli