Grid doesn't get loaded when there is no data

[Amila DomingoMember]

Hi,

I came across an issue where the grid doesn’t get loaded when the data (i.e. array, json) supplied to it is empty. I tested this on one of the demo files of jqxgrid, and i got the same result. Following is the error message i get on the error console,

Error: d.datafield is undefined
Source File: file:///C:/jqwidgets-ver1.6/jqwidgets/jqxgrid.filter.js
Line: 6

Is there a workaround for this?

Amila Domingo

[Peter StoevKeymaster]

Hi Amila,

Thank you for the feedback.

I have tested the reported issue and I have reproduced it. When you bind the Grid to an empty data source and apply filtering to the data, the grid will not be loaded. The issue can be reproduced with loca, json and xml data. I will create a new work item regarding it and we will fix it in the next release which is expected in the beginning of the next week. I will update this thread when the new version is uploaded.

Best Regards,
Peter Stoev

http://www.jqwidgets.com
jQWidgets Team

[Peter StoevKeymaster]

Hi Amila,

I am happy to tell you that the new version has been released. You can download it from here: http://www.jqwidgets.com/download.

Best Regards,
Peter Stoev

http://www.jqwidgets.com
jQWidgets Team

[sadranyiMember]

i also have problems loading my xml data it wont show in the grid
this is the code

js file
————————————————————————–
var theme = getTheme();
var repurl = “../data/reps.xml”;

// Preparing Data
var repSource =
{
datatype: “xml”,
datafields:
[
{ name: ‘RepName’ },
{ name: ‘RepCode’ },
{ name: ‘Branch’ },
{ name: ‘CRDNumber’ },
{ name: ‘NumberofAccounts’ },
{ name: ‘NumberofTrades’ },
{ name: ‘NumberofCancels’ },
{ name: ‘AverageCommission’ },
{ name: ‘AveragePH’ },
{ name: ‘AverageCOA’ },
{ name: ‘AverageTurnover’ }
],
root: “Reps”,
record: “Rep”,
id: “RepID”,
url: repurl
};

var repDataAdapter = new $.jqx.dataAdapter(repSource, {
downloadComplete: function (data, status, xhr) { },
loadComplete: function (data) {},
loadError: function (xhr, status, error) { }
});

// Initialize Grid
$(“#repGrid”).jqxGrid(
{
width: 760,
source: repDataAdapter,
theme: theme,
//pageable: true,
//autoheight: true,
//sortable: true,
//altrows: true,
//selectionmode: ‘singlecell’,
//enabletooltips: true,
columnsresize: true,
columns:
[
{ text: ‘Rep Name’, datafield: ‘RepName’, width: 100 },
{ text: ‘Rep Code’, datafield: ‘RepCode’, width: 100 },
{ text: ‘Branch’, datafield: ‘Branch’, width: 100 },
{ text: ‘CRD Number’, datafield: ‘CRDNumber’, width: 100, cellsalign: ‘right’ },
{ text: ‘No. of Accounts’, datafield: ‘NumberofAccounts’, width: 120, cellsalign: ‘right’},
{ text: ‘No. of Trades’, datafield: ‘NumberofTrades’, width: 110, cellsalign: ‘right’},
{ text: ‘No. of Cancels’, datafield: ‘NumberofCancels’, width: 120, cellsalign: ‘right’},
{ text: ‘Avg Comm.’, datafield: ‘AverageCommission’, width: 100, cellsalign: ‘right’},
{ text: ‘Avg P & H’, datafield: ‘AveragePH’, width: 100, cellsalign: ‘right’},
{ text: ‘Avg COA’, datafield: ‘AverageCOA’, width: 100, cellsalign: ‘right’},
{ text: ‘Avg Turnover’, datafield: ‘AverageTurnover’, width: 120, cellsalign: ‘right’},
]
});
————————————

xml file
—————–

Smith, Paul
ABC
Wall ST
21378945
50
1050
3
539
45
0.04
2.2

Ballas, Peter
BCA
Wall ST
56123987
85
1785
5
85.47000000000001
30
0.055
3.7

Barnet, Joe
GRP
Wall ST
49638251
92
1932
6
155.05
30
0.037
5.4

Smith, Bill
123
Wall ST
21654654
110
2310
7
93.10000000000001
50
0.08
7.8

Hutchens, Dan
WZD
Wall ST
51651651
200
4200
12
408.9225
30
0.05
6

Lee, Eric
BE4
Wall ST
66651566
105
2205
7
3402.0000000000005
45
0.021
4.1

Lord, Dustin
DFH
Wall ST
77656565
66
1386
4
11690.000000000002
30
0.01
2.9

Abate, John
SE7
Wall ST
65654654
20
420
1
753.9000000000001
50
0.025
3.4

Rupp, Mike
883
Wall ST
93321986
77
1617
5
222.40750000000003
50
0.06
5.7

[Peter StoevKeymaster]

Hi sadranyi,

Could you post a valid .xml file because the provided data is not in xml format? I also suggest you to take a look at this help topic which shows how to load XML into the Grid.

Looking forward to your reply.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[sadranyiMember]

how can i send the xml without the editor striping it
i have tried just about everything u listed in the help topic but still having the same issue.

i really need it for i presentation that will lead to purchase

[Peter StoevKeymaster]

Hi sadranyi,

I have been able to show the data in the Grid using the following code:

<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxdata.js"></script> 
    <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxmenu.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.selection.js"></script> 
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.columnsresize.js"></script> 
    <script type="text/javascript" src="../../scripts/gettheme.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var repurl = "reps.xml";
            // Preparing Data
            var repSource =
            {
                datatype: "xml",
                datafields:
                [
                    { name: 'RepName' },
                    { name: 'RepCode' },
                    { name: 'Branch' },
                    { name: 'CRDNumber' },
                    { name: 'NumberofAccounts' },
                    { name: 'NumberofTrades' },
                    { name: 'NumberofCancels' },
                    { name: 'AverageCommission' },
                    { name: 'AveragePH' },
                    { name: 'AverageCOA' },
                    { name: 'AverageTurnover' }
                ],
                root: 'Reps',
                record: 'Rep',
                id: 'RepID',
                url: repurl
            };
            var repDataAdapter = new $.jqx.dataAdapter(repSource, {
            downloadComplete: function (data, status, xhr) { },
            loadComplete: function (data) {},
            loadError: function (xhr, status, error) { }
            });
            // Initialize Grid
            $("#jqxgrid").jqxGrid(
            {
            width: 760,
            source: repDataAdapter,
            columns:
            [
                { text: 'Rep Name', datafield: 'RepName', width: 100 },
                { text: 'Rep Code', datafield: 'RepCode', width: 100 },
                { text: 'Branch', datafield: 'Branch', width: 100 },
                { text: 'CRD Number', datafield: 'CRDNumber', width: 100, cellsalign: 'right' },
                { text: 'No. of Accounts', datafield: 'NumberofAccounts', width: 120, cellsalign: 'right'},
                { text: 'No. of Trades', datafield: 'NumberofTrades', width: 110, cellsalign: 'right'},
                { text: 'No. of Cancels', datafield: 'NumberofCancels', width: 120, cellsalign: 'right'},
                { text: 'Avg Comm.', datafield: 'AverageCommission', width: 100, cellsalign: 'right'},
                { text: 'Avg P & H', datafield: 'AveragePH', width: 100, cellsalign: 'right'},
                { text: 'Avg COA', datafield: 'AverageCOA', width: 100, cellsalign: 'right'},
                { text: 'Avg Turnover', datafield: 'AverageTurnover', width: 120, cellsalign: 'right'}
            ]
            });
         
        });
    </script>
</head>
<body class='default'>
    <div id='jqxWidget' style="font-size: 13px; font-family: Verdana; float: left;">
        <div id="jqxgrid"></div>
    </div>
</body>
</html>

xml file:

<?xml version="1.0" encoding="UTF-8"?>
<Reps>
    <Rep RepID="1">
        <RepName>Smith, Paul</RepName>
        <RepCode>ABC</RepCode>
        <Branch>Wall ST</Branch>
        <CRDNumber>21378945</CRDNumber>
        <NumberofAccounts>50</NumberofAccounts>
        <NumberofTrades>1050</NumberofTrades>
        <NumberofCancels>3</NumberofCancels>
        <AverageCommission>539</AverageCommission>
        <AveragePH>45</AveragePH>
        <AverageCOA>0.04</AverageCOA>
        <AverageTurnover>2.2</AverageTurnover>
    </Rep>
    <Rep RepID="2">
        <RepName>Ballas, Peter</RepName>
        <RepCode>BCA</RepCode>
        <Branch>Wall ST</Branch>
        <CRDNumber>56123987</CRDNumber>
        <NumberofAccounts>85</NumberofAccounts>
        <NumberofTrades>1785</NumberofTrades>
        <NumberofCancels>5</NumberofCancels>
        <AverageCommission>85.47000000000001</AverageCommission>
        <AveragePH>30</AveragePH>
        <AverageCOA>0.055</AverageCOA>
        <AverageTurnover>3.7</AverageTurnover>
    </Rep>
    <Rep RepID="3">
        <RepName>Barnet, Joe</RepName>
        <RepCode>GRP</RepCode>
        <Branch>Wall ST</Branch>
        <CRDNumber>49638251</CRDNumber>
        <NumberofAccounts>92</NumberofAccounts>
        <NumberofTrades>1932</NumberofTrades>
        <NumberofCancels>6</NumberofCancels>
        <AverageCommission>155.05</AverageCommission>
        <AveragePH>30</AveragePH>
        <AverageCOA>0.037</AverageCOA>
        <AverageTurnover>5.4</AverageTurnover>
    </Rep>
    <Rep RepID="4">
        <RepName>Smith, Bill</RepName>
        <RepCode>123</RepCode>
        <Branch>Wall ST</Branch>
        <CRDNumber>21654654</CRDNumber>
        <NumberofAccounts>110</NumberofAccounts>
        <NumberofTrades>2310</NumberofTrades>
        <NumberofCancels>7</NumberofCancels>
        <AverageCommission>93.10000000000001</AverageCommission>
        <AveragePH>50</AveragePH>
        <AverageCOA>0.08</AverageCOA>
        <AverageTurnover>7.8</AverageTurnover>
    </Rep>
    <Rep RepID="5">
        <RepName>Hutchens, Dan</RepName>
        <RepCode>WZD</RepCode>
        <Branch>Wall ST</Branch>
        <CRDNumber>51651651</CRDNumber>
        <NumberofAccounts>200</NumberofAccounts>
        <NumberofTrades>4200</NumberofTrades>
        <NumberofCancels>12</NumberofCancels>
        <AverageCommission>408.9225</AverageCommission>
        <AveragePH>30</AveragePH>
        <AverageCOA>0.05</AverageCOA>
        <AverageTurnover>6</AverageTurnover>
    </Rep>
    <Rep RepID="6">
        <RepName>Lee, Eric</RepName>
        <RepCode>BE4</RepCode>
        <Branch>Wall ST</Branch>
        <CRDNumber>66651566</CRDNumber>
        <NumberofAccounts>105</NumberofAccounts>
        <NumberofTrades>2205</NumberofTrades>
        <NumberofCancels>7</NumberofCancels>
        <AverageCommission>3402.0000000000005</AverageCommission>
        <AveragePH>45</AveragePH>
        <AverageCOA>0.021</AverageCOA>
        <AverageTurnover>4.1</AverageTurnover>
    </Rep>
    <Rep RepID="7">
        <RepName>Lord, Dustin</RepName>
        <RepCode>DFH</RepCode>
        <Branch>Wall ST</Branch>
        <CRDNumber>77656565</CRDNumber>
        <NumberofAccounts>66</NumberofAccounts>
        <NumberofTrades>1386</NumberofTrades>
        <NumberofCancels>4</NumberofCancels>
        <AverageCommission>11690.000000000002</AverageCommission>
        <AveragePH>30</AveragePH>
        <AverageCOA>0.01</AverageCOA>
        <AverageTurnover>2.9</AverageTurnover>
    </Rep>
    <Rep RepID="8">
        <RepName>Abate, John</RepName>
        <RepCode>SE7</RepCode>
        <Branch>Wall ST</Branch>
        <CRDNumber>65654654</CRDNumber>
        <NumberofAccounts>20</NumberofAccounts>
        <NumberofTrades>420</NumberofTrades>
        <NumberofCancels>1</NumberofCancels>
        <AverageCommission>753.9000000000001</AverageCommission>
        <AveragePH>50</AveragePH>
        <AverageCOA>0.025</AverageCOA>
        <AverageTurnover>3.4</AverageTurnover>
    </Rep>
    <Rep RepID="9">
        <RepName>Rupp, Mike</RepName>
        <RepCode>883</RepCode>
        <Branch>Wall ST</Branch>
        <CRDNumber>93321986</CRDNumber>
        <NumberofAccounts>77</NumberofAccounts>
        <NumberofTrades>1617</NumberofTrades>
        <NumberofCancels>5</NumberofCancels>
        <AverageCommission>222.40750000000003</AverageCommission>
        <AveragePH>50</AveragePH>
        <AverageCOA>0.06</AverageCOA>
        <AverageTurnover>5.7</AverageTurnover>
    </Rep>
</Reps>

The XML file is at the same folder where the .htm file is. I am also using jQWidgets ver. 1.8.

To format HTML, JavaScript or any other code, use the white button before the text color button in the toolbar above the Editor. Select the text for formatting and click the button.

Hope this helps you.

Best Regards,
Peter Stoev

http://www.jqwidgets.com
jQWidgets Team

[sadranyiMember]

i still have a blank grid
when i download the zip file which folders should i include in my project ?

[Peter StoevKeymaster]

Hi sadranyi,

I prepared online demo from your xml and using the code I posted in my last post. Here’s the demo link: Online Demo

Download Project: bindtoxml.zip.

I suppose that the url to your xml data was incorrect.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts