Cloning last row in ag grid - javascript

I am missing something, yet.. I have ad grid, and can't figure out, how to clone last row.
Here is snippet of what I try to do:
lastrow = gridOptions.api.getDisplayedRowAtIndex(
gridOptions.api.getDisplayedRowCount() - 1
);
gridOptions.api.updateRowData({ add: [lastrow] });
optionally I tried:
gridOptions.api.updateRowData({ add: lastrow });
but that doesn't work neither.
I am also unable to access cell value by column name, like
window.alert(lastrow["1"])
"1" is valid field name.
What am I doing wrong?
I must also mention, that
firstrow = gridOptions.api.getDisplayedRowAtIndex(0);
gridOptions.api.setRowData(firstrow);
kinda works,but resets all rows, and I need to clone last row, not delete all rows, besides last.
Thanks in advance.

So based on docs, you are able to get RowNode by the index:
getDisplayedRowAtIndex(index) Returns the displayed rowNode at the given index.
keep in mind, it will return RowNode - not RowNode.data
And to get the last index you just need to use another method:
getLastDisplayedRow() Get the index of the last displayed row due to scrolling (includes not visible rendered rows in the buffer)
now once you know how to get RowNode you just need to execute updateRowData with node.data
P.S. you need to use RowNode.data - instead of RowNode itself.
Here is a code:
let lastrow = this.gridApi.getDisplayedRowAtIndex(this.gridApi.getLastDisplayedRow());
this.gridApi.updateRowData({ add: [lastrow.data] });
And here is a demo

There is a api method for getting the index of the last displayed row,
can use that index to get the row.
lastRowIndex = gridOptions.api.getLastDisplayedRow();
lastRow = gridOptions.api.getDisplayedRowAtIndex(lastRowIndex);
Not sure if that accomplishes everything you are trying to do, but based off the question this will get the last displayed row.

Related

SetModel for AgGrid works for a single value, but does not work for multi value

I have a problem, where I'm trying to apply a multi value filter to a column.
I have set the Column in colDefs to have filter: 'agSetColumnFilter',
With that in place, in my process I build an array of values, that I'm trying to filter on. I use this array in setModel, however it is not working. By not working, my grid basically get's cleared and there is nothing showing.
However, if I try to use the same approach, but instead only try to filter on a single value, something like arr[0], then the grid properly works and does the filtering as expected. So the filter functionality works, it just won't let me do it on multi value.
In my code, I create an array of values that I want to apply to a specific column, so let's say I have a Col1 that I'm trying to filter:
var valsToFilter=[];
valsToFilter.push('hey');
valsToFilter.push('bye');
var filterColumn = 'Col1';
var fil = grid.api.getFilterInstance(filterColumn);
fil.setModel({values:[]}];
fil.setModel({
values: valsToFilter
}); //This does not work. Grid gets cleared of everything, no rows showing.
fil.setModel({
values : valsToFilter[0]
});//but this works, shows the appropriate rows
fil.applyModel();
grid.api.onFilterChanged();

How do I capture indices when a value is assigned in 2D array?

I have a 2D array. As you might expect, it is composed of an array of rows with columns in the form of a second array in each row. When I assign a value to a particular [Row][Column] pair, I would like to have a function that can capture the indices for the element that has been modified and then be able to do something with them.
I have tried to use a proxy, but I can only make it intercept changes that are made to the Row, not the combination of Row and Column.
i.e.
row[3] = {1,2,3,4}; //works!
row[3][2] = 42; //Does not work :/
I have searched extensively in SO, W3Schools, Google, etc. but I cannot find anything that addresses this specific requirement.
var row=new Array();
for(var loop=0; loop<10;loop++) //Create 10 rows
{
row.push(new Array(10)); //10 columns per row for the sake of example
}
row[0][0]="Added a Value at (0,0)";
row[3][7]="Added a value at (3,7)";
console.log(row[3][7]); //outputs "Added a value at (3,7)" as expected.
This works fine and I'm happy with being able to manage data in this grid construct. I would like to be able to capture when a value is assigned and have access to the two indices so I can perform validation and subsequent activities. Any guidance would be greatly appreciated.
Proxy getter/setters only respond to top level property changes. See https://github.com/geuis/bodega/blob/master/src/store.js
Alternatively, you could assign a new Proxy object that has a getter/setter for a property like row and/or column in each parent array index. That would let you detect when one of those properties is updated.

how to get the searched data in datatable but not show it

I want to check if the data is already exist in datatable in certain column but I don't know how to do it.
Heres what I tried
var issueData = $('#table').DataTable().column(2).search($('input[name=search]').val()).rows({search: 'applied'}).data().toArray();
if(issueData == '')
{
var data = [];
data.push(rowData[0]);
data.push(rowData[3]);
data.push(rowData[2]);
data.push(rowData[4]);
data.push(rowData[6]);
$('#table').DataTable().row.add(data).draw(false);
}
the problem on this is I if the issueData is empty it will just overwrite the existing data and have filter on the bottom of the datatable
here's what the filter
Showing 1 to 1 of 1 entries (filtered from 3 total entries)
I don't want to filter it I just want to check if the data is existing already on a certain column then add the data if its not existing if it exist then do nothing.
search() as you say will search the actual table. To filter it without changing the user's view of the table, use filter(). See docs here: https://datatables.net/reference/api/filter()

jQuery on page load sorting will not sort with leading currency symbol

In my previous question I was trying to sort a table on page load without any client side table sorting toggle switches just so the table would be sorted for a user as they arrive on the page.
The question was answered and I got a pretty good response and thought i'd solved the issue so I went to sleep, so as I tried to use the code on my website today I realized the sorting technique is not working but works perfectly in jsfiddle https://jsfiddle.net/ghzch66e/12/.
So I then realized the table wont sort on my website because on the webpage the data contains a leading (£) symbol https://jsfiddle.net/ghzch66e/13/.
How can I make the table sort even with a leading (£) symbol.
jQuery(document).ready(function(e) {
var dataRows = [];
//Create an array of all rows with its value (this assumes that the amount is always a number. You should add error checking!! Also assumes that all rows are data rows, and that there are no header rows. Adjust selector appropriately.
$('#internalActivities > tbody > tr').each(function(i,j) {
dataRows.push({'amount': parseFloat($(this).find('.amount').text()), 'row': $(this)});
})
//Sort the data smallest to largest
dataRows.sort(function(a, b) {
return a.amount - b.amount;
});
//Remove existing table rows. This assumes that everything should be deleted, adjust selector if needed :).
$('#internalActivities').empty();
//Add rows back to table in the correct order.
dataRows.forEach(function(ele) {
$('#internalActivities').append(ele.row);
})
});
replace the "£" with "" when pushing it to the array
$('#internalActivities > tbody > tr').each(function(i,j) {
dataRows.push({'amount': parseFloat($(this).find('.amount').text().replace(/£/,"")), 'row': $(this)});
})

while loop not iterating properly to remove table rows

Just trying to remove a table but loop is not removing all rows.
I have used alert to be sure it's the right element by id.
It does remove some rows but not all, just chunks.
console reports: DOM Exception 1,DOM Exception 8
function removeThis(unsetElement)
{ unsetElement.parentNode.removeChild(unsetElement); }
While you remove rows, their indices change; you need to do the loop from the top, i.e.
i=rowCounter-1;
while(i>=0){unsetTable.deleteRow(i);i--;}
Yet the better idea is just to purge the whole table; rows will be garbage-collected.
Another solution could be to use the special -1 index, which deletes the last row.
var i = thisTrAry.length;
while(i--) {
unsetTable.deleteRow(-1);
}
But if you remove the whole table anyway (in your last line) then there is no need to remove the rows first.

Categories

Resources