На данный момент я не получил никаких проблем.После прочтения документации и изучения образцов я так и не получил более тонкий объект .Я хочу поделиться своим небольшим фрагментом, чтобы лучше понять вашу проблему.
Последовательность событий:
- rowClick
- rowDoubleClick
- rowSelect
Из онлайн-документации видно, что каждое событие возвращает объект строки.Такой объект является нулевым, если строка является корнем, в противном случае его значение является объектом родительской строки.В любом случае вы всегда можете использовать метод:
$("#treeGrid").jqxTreeGrid('getRow', event.args.key);
Вместо dataField вместо этого используется имя столбца, поэтому это значение не может быть доступно в событии выбора.
var employees = [
{
"EmployeeID": 2,
"FirstName": "Andrew",
"LastName": "Fuller",
"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",
"expanded": "true",
children: [
{
"EmployeeID": 8,
"FirstName": "Laura",
"LastName": "Callahan",
"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": 1,
"FirstName": "Nancy",
"LastName": "Davolio",
"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": 3,
"FirstName": "Janet",
"LastName": "Leverling",
"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",
"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",
"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",
"expanded": "true",
children: [
{
"EmployeeID": 6,
"FirstName": "Michael",
"LastName": "Suyama",
"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",
"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": 9,
"FirstName": "Anne",
"LastName": "Dodsworth",
"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."
}
]
}
]
}
];
// prepare the data
var source =
{
dataType: "json",
dataFields: [
{name: 'EmployeeID', 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: 'children', type: 'array'},
{name: 'expanded', type: 'bool'},
{name: 'BirthDate', type: 'date'}
],
hierarchy: {
root: 'children'
},
id: 'EmployeeID',
localData: employees
};
var dataAdapter = new $.jqx.dataAdapter(source);
// create Tree Grid
$("#treeGrid").jqxTreeGrid({
width: 550,
height: 200,
theme: "arctic",
source: dataAdapter,
sortable: true,
columns: [
{text: 'FirstName', dataField: 'FirstName', width: 200},
{text: 'LastName', 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'}
]
});
$('#treeGrid').on('rowDoubleClick', function (event) {
var row = event.args.row;
var parent = event.args.row.parent;
var dataField = event.args.dataField;
console.log('rowDoubleClick: (dataField is: ' + dataField + ') row: ' + ((row != null) ? 'not null' : 'null') + ' parent: ' + ((parent != null) ? 'not null' : 'null'));
});
$('#treeGrid').on('rowClick', function (event) {
var row = event.args.row;
var parent = event.args.row.parent;
var dataField = event.args.dataField;
console.log('rowClick: (dataField is: ' + dataField + ') row: ' + ((row != null) ? 'not null' : 'null') + ' parent: ' + ((parent != null) ? 'not null' : 'null'));
});
$('#treeGrid').on('rowSelect', function (event) {
var row = event.args.row;
var parent = event.args.row.parent;
if (parent == null) {
var parent = $("#treeGrid").jqxTreeGrid('getRow', event.args.key);
}
console.log('rowSelect: row: ' + ((row != null) ? 'not null' : 'null') + ' parent: ' + ((parent != null) ? 'not null' : 'null'));
});
$("#jqxbutton").jqxButton({
theme: 'energyblue',
height: 30
});
$('#jqxbutton').click(function () {
$("#treeGrid").jqxTreeGrid('selectRow', 1);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/styles/jqx.base.css">
<script src="https://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<div id="treeGrid"></div>
<input type="button" style="margin: 20px;" id="jqxbutton" value="Select row" />