ParamQuery grid support forum
General Category => Help for ParamQuery Pro => Topic started by: Joseken on September 24, 2025, 03:21:12 pm
-
Subject: pqGrid Spreadsheet Toolbar initialization throws "nodeName" error
Message:
Hello ParamQuery team,
I’m trying to reproduce the official Spreadsheet demo (with toolbar, import/export, formatting, etc.) using my licensed PQ Pro package.
My environment:
• pqGrid Pro 10.1
• jQuery 2.2.4 (also tried jQuery 3.7.1)
• jQuery UI 1.12.1
• Files loaded in this order:
1. jquery.min.js
2. jquery-ui.min.js
3. jszip.min.js
4. pqgrid.min.js
5. pq-localize-en.js
• CSS included: jquery-ui.min.css, pqgrid.min.css, pqgrid.ui.min.css, themes/office/pqgrid.css, and pq-icons/pq.css
When I initialize the grid with the Spreadsheet options and official toolbar items, the grid fails to render and I consistently get this error in the console:
pqgrid.min.js:9 Uncaught TypeError: Cannot read properties of undefined (reading 'nodeName')
at t.<computed>.<computed>.getInner (pqgrid.min.js:9:182089)
at t.<computed>.<computed>._create (pqgrid.min.js:9:181810)
at t.<computed>.<computed>._create (jquery-ui.min.js:6:4499)
at t.<computed>.<computed>._createWidget (jquery-ui.min.js:6:6645)
...
I noticed the error comes from pqToolbar initialization. If I disable the toolbar (toolbar:false) the grid renders fine. If I enable the toolbar with items: [] (empty), it also works. But as soon as I add standard items like { type:'bold' }, { type:'italic' }, or { type:'button' }, the error occurs.
Other notes:
• I am not overriding the whole dataModel (I read your advice about not using $("#grid").pqGrid("option","dataModel", obj) to avoid unsetting sub-options).
• I verified there is only one <div id="spreadsheet"> container in the page.
• jQuery UI icons and pq-icons fonts are loading correctly (no 404).
My question:
• Is there a known issue in v10.1 Spreadsheet demo when using the official toolbar items (bold, italic, underline, wrap, select, etc.)?
• Is there a specific dependency, option, or order of script includes required for the toolbar items to work without causing the nodeName error?
• Could you provide a minimal working sample (with toolbar enabled) for pqGrid Pro 10.1 that we can compare against?
Thanks in advance for your help
• “In the older v8 demo, toolbar items like bgColor, fgColor, border are assumed built-in and work with Spectrum color picker. But in 10.1, toolbar initialization fails with nodeName when these items are present.”
• “I（GPT） suspect the issue lies in select.options structure or missing UI modules (color picker, border UI). I matched the old demo’s code but still get the error.”
• “I（GPT） also tried delaying the grid init until DOM ready, and avoided overriding entire dataModel, but the error still occurs only when toolbar items beyond file/separator are included.”
• “Could you please share the minimal complete sample (HTML + CSS + JS) from your 10.1 import-xlsx demo (with toolbar fully enabled) so I can compare resource loading and toolbar module dependencies?”
-
{ type:'bold' }, { type:'italic' } are new addition to toolbar API in v11.0.0
Since you are using pqgrid v10.1.0, please follow the corresponding example:
https://paramquery.com/pro/demos10/import-xlsx
-
Thank you, I have upgraded to 11 and the toolbar is working fine now!
-
Thanks a lot for your support! With the upgrade to v11, the spreadsheet demo is now running perfectly on my side.
I’m going to integrate this Spreadsheet with our database using a cross-tabulation (matrix) approach. With proper mapping, it can become a very powerful editing tool for solving a wide range of real business problems.