Page hangs when trying to load data

[realtekParticipant]

Hi,

I have the following source to get my data for a jqxChart.

    $(document).ready(function () {
        var source =
        {
             datatype: "json",
             datafields: [
                 { name: 'datetime', type: 'date'},
                 { name: 'temperature'},
                 { name: 'location'}
            ],
            url: './getdata.php'
        };

However, I have an issue with the datetime datafield. Basically, the page just sits there trying to load when I have the datetime field specified.

If I rename this to something that does not exist like datetimetest it loads ok without that data.

My source is from a mySQL database and the JSON looks like this:

[{"temperature":"20.69","datetime":"2015-01-28 15:17:21","location":"Hall"}] for example

Any help would be great. Thanks

[realtekParticipant]

hmm, seems to be caused by date being used for the Category Axis

categoryAxis

  {
                    text: 'Category Axis',
                    textRotationAngle: 0,
                    dataField: 'datetime',
                    formatFunction: function (value) {
                        return $.jqx.dataFormat.formatdate(value, 'dd/MM/yyyy');
                    },

[Peter StoevKeymaster]

Hi realtek,

In your code you missed to set the “format’ property of your “datetime” field. I suppose your Date is not parsed to a JavaScript Date Object and in your formatFunction you actually try to format a String not JavaScript Date object which is the expected parameter.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[realtekParticipant]

Thanks Peter, I have tried { name: 'datetime', type: 'date', format:'dd/mm/yyyy'} but it still does not work.

Des my date need to be converted to a Javascript date object first in the getdata.php ?

Thanks

[realtekParticipant]

Hi Peter,

I now have this:

 datatype: "json",
             datafields: [
                 { name: 'mydate', type: 'date', format:'yyyy-mm-dd hh:mi:ss'},
                 { name: 'temperature'},
                 { name: 'location'}
            ],
            url: './getdata.php'

and

    {
                    text: 'Category Axis',
                    textRotationAngle: 0,
                    dataField: 'mydate',
                    formatFunction: function (value) {
                        return $.jqx.dataFormat.formatdate(value, 'yyyy-mm-dd hh:mi:ss');
                    },

Here is the JSON:

[{"temperature":"20.31","mydate":"2015-01-28T20:42:43+00:00","location":"Hall"}]

But I still seem to get the same issue?

Thanks

[yodaParticipant]

I don’t see the axis type and unit in the the code.
You should specify the type of the axis and set it to ‘date’ if you’re using dates. Also provide the unit (like ‘year’, ‘month’, ‘day’, ‘hour’, etc…):

xAxis 
{
  dataField: 'datetime',
  formatFunction: function (value) {
     return $.jqx.dataFormat.formatdate(value, 'dd/MM/yyyy');
  },
  type: 'date',
  baseUnit: 'day'
}

[Author]

Posts