ParamQuery grid support forum

General Category => Bug Report => Topic started by: qcdatabase.com on June 27, 2018, 07:54:07 am

Title: CSV export "Uncaught TypeError: Cannot read property 'hidden' of undefined"
Post by: qcdatabase.com on June 27, 2018, 07:54:07 am
I was trying to track down this error so i beautified pqgrid.min.js and saved it as grid.max.js.
When trying to export to CSV, I get the following output to the chrome console:
Uncaught TypeError: Cannot read property 'hidden' of undefined                                                             grid.max.js:10281
    at e.cExport.getCsvHeader (grid.max.js:10281)
    at e.cExport.getCSVContent (grid.max.js:10290)
    at e.cExport.Export (grid.max.js:10150)
    at e.(/app/db/anonymous function).(anonymous function).n.exportData (http://localhost/app/db/paramquery/grid.max.js:10105:18)
    at e.(/app/db/anonymous function).(anonymous function).listener (http://localhost/app/db/grid.php?table=no_pkg_drawings:151:27)
    at HTMLButtonElement.<anonymous> (grid.max.js:6159)
    at HTMLButtonElement.dispatch (jquery-1.9.1.min.js:3)
    at HTMLButtonElement.v.handle (jquery-1.9.1.min.js:3)
// beautified grid.max.js
        },
        getCsvHeader: function(t, e, n, r) {
            for (var i, o, a, l = this, s = [], d = [], c = 0; e > c; c++) {
                for (var u = t[c], h = null, f = 0, p = u.length; p > f; f++) i = n[f], i.hidden || i.copy === !1 || (o = u[f], c > 0 && o == t[c - 1][f] ? s.push("") : h && f > 0 && o == h ? s.push("") : (a = l.getTitle(o, f), a = a ? a.replace(/\"/g, '""') : "", h = o, s.push('"' + a + '"')));
                d.push(s.join(r)), s = []
            }
            return d
        },


(http://)

This seems like a bug. Here is my export code just in case I am doing something wrong.
// jsZip scripts from the SDK
<script src="paramquery/jsZip-2.5.0/jszip.min.js"></script>
<script src="paramquery/jsZip-2.5.0/fileSaver.js"></script>
// toolbar property/object
toolbar: {
   items: [
      {    type: 'select',
         attr: 'id="export_format"',
         options: [{
                  xlsx: 'Export to Excel',
                  csv: 'Export as CSV',
                  htm: 'Export as HTML',
                  json: 'Export as JSON'}]},
      { type: 'button', label: "Export", icon: 'ui-icon-arrowthickstop-1-s',
         listener: function () {
            $grid.pqGrid("refresh");
            var format = $("#export_format").val(),                           
               blob = this.exportData({
                  format: format,                               
                  render: true
               });
            if(typeof blob === "string"){                           
               blob = new Blob([blob]);
            }
            saveAs(blob, "'.$this->tableTitle.' export."+ format );
         }
      },
      { type: 'separator' },
      { type: "<span class=\"feedback\"></span>" }
   ]
},
Title: Re: CSV export "Uncaught TypeError: Cannot read property 'hidden' of undefined"
Post by: paramvir on June 27, 2018, 12:12:19 pm
It's difficult to reproduce the error from provided information and Csv export is working fine in the demos.

Could you please share a small test case via jsfiddle to reproduce the error.
Title: Re: CSV export "Uncaught TypeError: Cannot read property 'hidden' of undefined"
Post by: Kenneth on July 13, 2018, 06:27:53 am
Hi there,

I come across the same issue with the latest version of ParamQuery Pro v5.0.0. It can be easily reproduced when you have column(s) in your grid which have been to set the property "copy" to false.

If you replace the colM object in the demo page with the following, you will see the error:

        var colM = [
            { title: "ShipCountry", width: 120, dataIndx: "ShipCountry",
                filter: {
                    type: 'select',
                    prepend: { '': 'All Countries' },
                    valueIndx: 'ShipCountry',
                    labelIndx: 'ShipCountry',
                    condition: 'equal',
                    listeners: ['change']
                }
            },
            { title: "Customer Name", width: 130, dataIndx: "ContactName" },
       { title: "Test2 Customer Name", width: 130, dataIndx: "ContactName", copy: false },
            { title: "Freight", width: 120, format: '$##,###.00',
                summary: {
                    type: "sum"
                },
                dataType: "float", dataIndx: "Freight"
            },
            { title: "Shipping Via", width: 130, dataIndx: "ShipVia" },
          //{ title: "Shipped Date", width: 100, dataIndx: "ShippedDate", dataType: "date" },
            { title: "Shipping Address", width: 220, dataIndx: "ShipAddress" },
            { title: "Shipping City", width: 130, dataIndx: "ShipCity" }
      ];


When I dig into the source code of the library, I figure out that there may be a potential bug in the method getCsvHeader.

        getCsvHeader: function(hc, hcLen, CM, separator) {
            var self = this,
                header = [],
                csvRows = [],
                column, cell, title;
           
            for (var i = 0; i < hcLen; i++) {
                var row = hc,
                    laidCell = null;
                for (var ci = 0, lenj = row.length; ci < lenj; ci++) {
                      // Bug causing not able to download CSV file

                    column = CM[ci]; <------ this line causing issue;

                    if (column.hidden || column.copy === false) {
                        continue
                    }
                    cell = row[ci];
                    if (i > 0 && cell == hc[i - 1][ci]) {
                        header.push("")
                    } else if (laidCell && ci > 0 && cell == laidCell) {
                        header.push("")
                    } else {
                        title = self.getTitle(cell, ci);
                        title = title ? title.replace(/\"/g, '""') : "";
                        laidCell = cell;
                        header.push('"' + title + '"')
                    }
                }
                csvRows.push(header.join(separator));
                header = []
            }
            return csvRows
        },

I am not sure if this is a bug, if yes, I am looking forward to a fix as we cannot export our data to CSV now.

Thanks!


Title: Re: CSV export "Uncaught TypeError: Cannot read property 'hidden' of undefined"
Post by: paramvir on July 13, 2018, 03:59:28 pm
Thanks for reporting issue, it can be reproduced when copy:false is used for csv export, it has been fixed in upcoming version.

As a workaround instead of copy: false, please add hidden: true to columns in beforeExport event and restore them in export event.
Title: Re: CSV export "Uncaught TypeError: Cannot read property 'hidden' of undefined"
Post by: paramvir on July 24, 2018, 11:04:05 am
This is fixed in v5.2.0