jqwidget


JqWidgets treegrid issues wiring up dataAdapter object


I'm in the AngularJS environment, and trying to get a jqWidgets TreeGrid working.
I have the dataAdapter all wired up with the Json formatted data, however the grid renders only one row.
I also have a test treeGrid on the same page, and with sample data, which is working fine.
I'm putting the final Json data setting side-by-side to try and determine where I'm going wrong.
I've used this page as a guide to wire up the treegrid settings, etc. http://www.jqwidgets.com/jquery-widgets-documentation/documentation/angularjs/angularjs.htm
Here is the html showing the jqx treegrid directive for the "bad" grid:
<jqx-tree-grid jqx-instance="jqGridHierObj" jqx-settings="vm.jqGridHierSettings"></jqx-tree-grid>
And the "bad" Json data tree settings binded vm.jqGridHierSettings (too large to post inline):
http://www.bobmazzo.com/grid/TreeGrid_Data_Bad.txt
and here is the "good" grid with Employee test data :
HTML:
<jqx-tree-grid jqx-instance="jqGridEmpObj" jqx-settings="vm.jqGridEmpSettings"></jqx-grid>
vm.jqGridEmpSettings Json data :
http://www.bobmazzo.com/grid/TreeGrid_Data_Good.txt
and from my Angular controller code, a snippet of the javascript with Json data bindings :
I need help to figure out why the "bad" grid is not working ! And why it only renders one row, where is should be showing a hierarchy of data.
thanks.
Bob
I found the solution. You must define the “children” as an array type in the 'source' object; that is, prior to passing that object into the dataAdapter. See the dataFields property below :
var source = {
dataType: "json",
dataFields: [
{
"name": "id",
"type": "number"
},
{
"name": "field0",
"type": "string"
},
{
"name": "field1",
"type": "number"
},
{
"name": "field2",
"type": "number"
},
{
name: 'children', // MUST DEFINE CHILDREN AS ARRAY TYPE
type: 'array'
},
],
hierarchy: {
root: 'children'
},
id: 'id',
localData: myData
};
var dataAdapter = new $.jqx.dataAdapter(source);

Related Links

Customize jqxEditor to change colors
Centering Tabs in jqxTabs Widget
in jqwidgets jquery framework bootstrap integration is my issue for a dropdown
How to create a responsive webpage using jqwidget?
How to hide top header bar with back button while using jqxChart of jqWidget for iOS app.
JqWidget tabs - dynamically add tab with ajax content
How to auto-resize jqxWindow based on content?
JQWidgets treegrid with dataAdapter not rendering
JqWidgets treegrid issues wiring up dataAdapter object
Auto serial number column to jqxgrid
set maximum number of grid rows in jqWidgets
jqxDropDownList set multiple item selected

Categories

HOME
twitter
gerrit
image-processing
isabelle
tizen
kde
relayjs
syntax
xmpp
c#-2.0
binary-tree
directx
portia
esper
python-unittest
gnupg
izpack
modelica
spring-tool-suite
vb.net-2010
iolanguage
clearcase-ucm
dosgi
seaborn
tostring
apache-metamodel
oxyplot
beyondcompare
autocad-plugin
graphicsmagick
wkwebview
chromium-embedded
claims-based-identity
rundeck
java-7
p-value
spark-jobserver
traffic
libssl
kendo-datasource
junit5
data-manipulation
rotational-matrices
abstract-class
hilbert-curve
sqlite2
webdriver-manager
android-tabhost
reportingservices-2005
core-plot
ibpy
nand2tetris
eigenvalue
websphere-mq-fte
upstart
yii2-extension
tropo
jspdf-autotable
crosswalk-runtime
topbeat
nxt
multi-level
trash
xml-attribute
paypal-express
impresspages
connect-by
simplewebrtc
sdf
dlna
bluegiga
pyke
ford-fulkerson
intellij-14
citrus-pay
libressl
varargs
notify
bridge.net
c++03
directoryservices
kineticjs
angularjs-ng-click
html-helper
openexr
seaside
intentservice
terminal-services
padarn
chronoforms
sharp-repository
sabredav
ocunit
android-hardware
referrer
anonymous-methods
jspinclude
jquery-ui-layout
asp.net-mvc-areas
wise
suppress
routedevent
thread-local-storage
putchar
private-members

Resources

Mobile Apps Dev
Database Users
javascript
java
csharp
php
android
MS Developer
developer works
python
ios
c
html
jquery
RDBMS discuss
Cloud Virtualization
Database Dev&Adm
javascript
java
csharp
php
python
android
jquery
ruby
ios
html
Mobile App
Mobile App
Mobile App