I am trying to create a delete button to remove item rows from a table, but I am constantly encountering an "Uncaught TypeError: deletedArr.push is not a function". I am not sure what to do. Here is the code:
//Remove buttom
$(document).ready(function() {
// As soon as jquery loads, load from storage
// it will return null if nothing is stored yet
const deletedExpenses = JSON.parse(localStorage.getItem('deletedExpenses')) || [];
$('body').on('click', '.deleteButton', function(e) {
e.preventDefault(); // prevent the href default
// if you need to access the id...
let deleteID = $(this).data('id');
$(this).closest('tr').remove();
// You first have to load from storage the array of deleted items,
var deletedArr = localStorage.getItem("deletedExpenses");
// If you have nothing stored, this will return null,
// And if that's the case, create new array
if (!deletedArr){
deletedArr = [];
}
// then push to this array another ID that got deleted
deletedArr.push(deleteID);
localStorage.setItem('deletedExpenses', JSON.stringify(deletedArr));
})
This sets the variable to a string:
var deletedArr = localStorage.getItem("deletedExpenses");
When you set the local storage value you encode it to JSON, so you need to parse it back from JSON when reading it:
var deletedArr = JSON.parse(localStorage.getItem("deletedExpenses"));