mirror of
https://github.com/elastic/kibana.git
synced 2025-04-24 01:38:56 -04:00
Added toggle buttons to expand table details instead of clicking on row
This commit is contained in:
parent
e3940a7c66
commit
60d82283ed
2 changed files with 15 additions and 5 deletions
|
@ -261,7 +261,7 @@ define(function (require) {
|
|||
opened.push(id);
|
||||
}
|
||||
|
||||
var $tr = $(event.delegateTarget);
|
||||
var $tr = $(event.delegateTarget.parentElement);
|
||||
var $detailsTr = $tr.next();
|
||||
|
||||
///
|
||||
|
@ -271,6 +271,11 @@ define(function (require) {
|
|||
var open = !!~opened.indexOf(id);
|
||||
$detailsTr.toggle(open);
|
||||
|
||||
// Change the caret icon
|
||||
var $toggleIcon = $($(event.delegateTarget).children('i')[0]);
|
||||
$toggleIcon.toggleClass('fa-caret-down');
|
||||
$toggleIcon.toggleClass('fa-caret-right');
|
||||
|
||||
if (!open) {
|
||||
// close the child scope if it exists
|
||||
clearChildScopeFor(id);
|
||||
|
@ -278,6 +283,7 @@ define(function (require) {
|
|||
return;
|
||||
}
|
||||
|
||||
|
||||
// The fields to loop over
|
||||
row._fields = row._fields || _.keys(row._source).concat(config.get('metaFields')).sort();
|
||||
row._mode = 'table';
|
||||
|
@ -286,7 +292,7 @@ define(function (require) {
|
|||
$detailsTr
|
||||
.empty()
|
||||
.append(
|
||||
$('<td>').attr('colspan', $scope.columns.length + 1).append(detailsHtml)
|
||||
$('<td>').attr('colspan', $scope.columns.length + 2).append(detailsHtml)
|
||||
);
|
||||
|
||||
var $childScope = _.assign(childScopeFor(id), { row: row });
|
||||
|
@ -299,9 +305,12 @@ define(function (require) {
|
|||
|
||||
// create a tr element that lists the value for each *column*
|
||||
function createSummaryRow(row, id) {
|
||||
var tr = document.createElement('tr');
|
||||
tr.setAttribute('ng-click', 'toggleRow(' + JSON.stringify(id) + ', $event)');
|
||||
var $tr = $compile(tr)($scope);
|
||||
var $tr = $('<tr>');
|
||||
|
||||
var expandTd = $('<td>').html('<i class="fa fa-caret-right"></span>')
|
||||
.attr('ng-click', 'toggleRow(' + JSON.stringify(id) + ', $event)');
|
||||
$compile(expandTd)($scope);
|
||||
$tr.append(expandTd);
|
||||
|
||||
var td = $(document.createElement('td'));
|
||||
if ($scope.timefield) {
|
||||
|
|
|
@ -1,3 +1,4 @@
|
|||
<th></th>
|
||||
<th ng-if="timefield">
|
||||
<span ng-click="sort(timefield)">Time <i ng-class="headerClass(timefield)"></i></span>
|
||||
</th>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue