problem in grouping data field

[guruParticipant]

i want grouping my tree grid based on program name , but here i have some problems, below is my grid,
it will grouping correctly but program names was printing ‘undifined’

var finalizationsource =
{
dataType: “json”,
dataFields: [
{name: ‘fpcId’, type: ‘number’},
{name: ‘programId’, type: ‘number’},
{name: ‘ReportsTo’, type: ‘number’},
{name: ‘program’, type: ‘string’},
{name: ‘breakRelativityId’, type: ‘string’},
{name: ‘AdDuration’, type: ‘string’},
{name: ‘Caption’, type: ‘string’},
{name: ‘CaptionId’, type: ‘string’},
{name: ‘Commercial’, type: ‘string’},
{name: ‘CommercialId’, type: ‘string’},
{name: ‘Remarks’, type: ‘string’},
{name: ‘BrkDuration’, type: ‘string’}
],
hierarchy:
{
keyDataField: {name: ‘fpcId’},
parentDataField: {name: ‘ReportsTo’},
groupingDataFields:
[
{
name: “program”,
}
],
},
id: ‘fpcId’,
url: “getPrograms
};
var finalizationdataAdapter = new $.jqx.dataAdapter(finalizationsource);

$(“#finalizationGrid”).jqxTreeGrid(
{
width: “98%”,
height: “350”,
theme: ‘ui-redmond’,
columnsResize: true,
columnsReorder: true,
autoRowHeight: false,
scrollBarSize: 10,
source: finalizationdataAdapter,
ready: function() {
$(“#finalizationGrid”).jqxTreeGrid(‘expandRow’, ‘1’);
},
columns: [
{text: ‘Program’, dataField: ‘program’, width: 150, pinned: true, align: ‘center’},
{text: ‘Ad Duration’, dataField: ‘AdDuration’, width: 95, align: ‘center’},
{text: ‘Caption’, dataField: ‘Caption’, width: 95, align: ‘center’},
{text: ‘Commercial’, dataField: ‘Commercial’, cellsFormat: ‘d’, width: 200, align: ‘center’},
{text: ‘Remarks’, dataField: ‘Remarks’, cellsFormat: ‘d’, width: 85, align: ‘center’},
{text: ‘Brk Duration’, dataField: ‘BrkDuration’, width: 95, align: ‘center’},
{text: ‘Start Time’, dataField: ‘StartTime’, width: 95, align: ‘center’},
{text: ‘End Time’, dataField: ‘EndTime’, align: ‘center’, width: 95},
{text: ‘Ad Start Time’, dataField: ‘AdStartTime’, align: ‘center’, width: 95},
{text: ‘Ad End Time’, dataField: ‘AdEndTime’, align: ‘center’, width: 95},
{text: ‘Release Order No’, dataField: ‘ReleaseOrderNo’, align: ‘center’, width: 95},
]

});
});

please help some body

[Peter StoevKeymaster]

Hi guru,

The TreeGrid is not initialized correctly. You should have groupingDataFields or keyDataField and parentDataField, but never both. Also if you experience some issue, please post a full sample, because posting part of your code does not help much and we cannot test it.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[guruParticipant]

please explain get the jqwidget employees data and how to grouping the following grid

var employees =
[
{
“EmployeeID”: 1,
“FirstName”: “Nancy”,
“LastName”: “Davolio”,
“ReportsTo”: 2,
“Country”: “USA”,
“Title”: “Sales Representative”,
“HireDate”: “1992-05-01 00:00:00”,
“BirthDate”: “1948-12-08 00:00:00”,
“City”: “Seattle”,
“Address”: “507 – 20th Ave. E.Apt. 2A”
},
{
“EmployeeID”: 2,
“FirstName”: “Andrew”,
“LastName”: “Fuller”,
“ReportsTo”: null,
“Country”: “USA”,
“Title”: “Vice President, Sales”,
“HireDate”: “1992-08-14 00:00:00”,
“BirthDate”: “1952-02-19 00:00:00”,
“City”: “Tacoma”,
“Address”: “908 W. Capital Way”
},
{
“EmployeeID”: 3,
“FirstName”: “Janet”,
“LastName”: “Leverling”,
“ReportsTo”: 2,
“Country”: “USA”,
“Title”: “Sales Representative”,
“HireDate”: “1992-04-01 00:00:00”,
“BirthDate”: “1963-08-30 00:00:00”,
“City”: “Kirkland”,
“Address”: “722 Moss Bay Blvd.”
},
{
“EmployeeID”: 4,
“FirstName”: “Margaret”,
“LastName”: “Peacock”,
“ReportsTo”: 2,
“Country”: “USA”,
“Title”: “Sales Representative”,
“HireDate”: “1993-05-03 00:00:00”,
“BirthDate”: “1937-09-19 00:00:00”,
“City”: “Redmond”,
“Address”: “4110 Old Redmond Rd.”
},
{
“EmployeeID”: 5,
“FirstName”: “Steven”,
“LastName”: “Buchanan”,
“ReportsTo”: 2,
“Country”: “UK”,
“Title”: “Sales Manager”,
“HireDate”: “1993-10-17 00:00:00”,
“BirthDate”: “1955-03-04 00:00:00”,
“City”: “London”,
“Address”: “14 Garrett Hill”
},
{
“EmployeeID”: 6,
“FirstName”: “Michael”,
“LastName”: “Suyama”,
“ReportsTo”: 5,
“Country”: “UK”,
“Title”: “Sales Representative”,
“HireDate”: “1993-10-17 00:00:00”,
“BirthDate”: “1963-07-02 00:00:00”,
“City”: “London”,
“Address”: “Coventry House Miner Rd.”
},
{
“EmployeeID”: 7,
“FirstName”: “Robert”,
“LastName”: “King”,
“ReportsTo”: 5,
“Country”: “UK”,
“Title”: “Sales Representative”,
“HireDate”: “1994-01-02 00:00:00”,
“BirthDate”: “1960-05-29 00:00:00”,
“City”: “London”,
“Address”: “Edgeham Hollow Winchester Way”
},
{
“EmployeeID”: 8,
“FirstName”: “Laura”,
“LastName”: “Callahan”,
“ReportsTo”: 2,
“Country”: “USA”,
“Title”: “Inside Sales Coordinator”,
“HireDate”: “1994-03-05 00:00:00”,
“BirthDate”: “1958-01-09 00:00:00”,
“City”: “Seattle”,
“Address”: “4726 – 11th Ave. N.E.”
},
{
“EmployeeID”: 9,
“FirstName”: “Anne”,
“LastName”: “Dodsworth”,
“ReportsTo”: 5,
“Country”: “UK”,
“Title”: “Sales Representative”,
“HireDate”: “1994-11-15 00:00:00”,
“BirthDate”: “1966-01-27 00:00:00”,
“City”: “London”,
“Address”: “7 Houndstooth Rd.”
}
];

var source =
{
dataType: “json”,
dataFields: [
{ name: ‘EmployeeID’, type: ‘number’ },
{ name: ‘ReportsTo’, type: ‘number’ },
{ name: ‘FirstName’, type: ‘string’ },
{ name: ‘LastName’, type: ‘string’ },
{ name: ‘Country’, type: ‘string’ },
{ name: ‘City’, type: ‘string’ },
{ name: ‘Address’, type: ‘string’ },
{ name: ‘Title’, type: ‘string’ },
{ name: ‘HireDate’, type: ‘date’ },
{ name: ‘BirthDate’, type: ‘date’ }
],
hierarchy:
{
keyDataField: { name: ‘EmployeeID’ },
parentDataField: { name: ‘ReportsTo’ }
},
id: ‘EmployeeID’,
localData: employees
};
var dataAdapter = new $.jqx.dataAdapter(source);
// create Tree Grid
$(“#treeGrid”).jqxTreeGrid(
{
width: 600,
source: dataAdapter,
sortable: true,
ready: function()
{
$(“#treeGrid”).jqxTreeGrid(‘expandRow’, ‘2’);
},
columns: [
{ text: ‘FirstName’, columnGroup: ‘Name’, dataField: ‘FirstName’, width: 150 },
{ text: ‘LastName’, columnGroup: ‘Name’, dataField: ‘LastName’, width: 120 },
{ text: ‘Title’, dataField: ‘Title’, width: 160 },
{ text: ‘Birth Date’, dataField: ‘BirthDate’, cellsFormat: ‘d’, width: 120 },
{ text: ‘Hire Date’, dataField: ‘HireDate’, cellsFormat: ‘d’, width: 120 },
{ text: ‘Address’, dataField: ‘Address’, width: 250 },
{ text: ‘City’, dataField: ‘City’, width: 120 },
{ text: ‘Country’, dataField: ‘Country’ }
],
columnGroups: [
{ text: ‘Name’, name: ‘Name’ }
]
});

[Peter StoevKeymaster]

Hi guru,

You pasted code from our demo. What do you want to do? The TreeGrid already displays a Hierarchy using that data.

Best Regards,
Peter Stoev

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

[Author]

Posts