Saving the current state of a table and displaying it upon reloading the page or logging in again

I have a table with pagination implemented. I would like to save its status after a reload, so it does not start from the first page every time. I have heard about local storage in the browser but do not know how to implement it in my case. As I understand, I need to locally save the number of the actual page and load it for the first page like this: showPage(1); but instead of "1", I need some variable that contains information of the last active page. Can someone help me with this?

// Code snippet for returning an array of maxLength (or less) page numbers...

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

<div id="Tabledta"></div>
<div class="pagination"></div>

javascriptjsonpagination

Answer №1

There are two methods you can utilize:

  1. sessionStorage Check out the documentation here for more information.

In this scenario, I suggest using sessionStorage as it will be active only for the current session. Save your current page number to sessionStorage and check for its existence after a page refresh.

var currentPage = sessionStorage.getItem('currentPage');
if(!currentPage) {
 currentPage = 1;
}
showPage(currentPage);

---Save data to sessionStorage

sessionStorage.setItem('currentPage', page);

---Retrieve data from sessionStorage

var page = sessionStorage.getItem('currentPage');
  1. localStorage Refer to the documentation here. This method will retain data even if the browser is closed.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Utilize jQuery to trigger PHP validation script

HTML Code: I have implemented validation using jQuery. My next task is to call a PHP file from jQuery, perform validation in page2.php, and then submit the data to the database. After successful submission, I need to redirect to index.php. However, I am f ...

javascriptphpjqueryhtml

Deleting a row in a MySQL database using AJAX and PHP: A step-by

Is it possible to remove a record from a PHP MySQL database using AJAX? Consider the following code: delete_record.php <?php require_once "../include/connection.php"; if ($_REQUEST['rowid']) { $sql = "DELETE FROM lesson1 WH ...

javascriptphpmysqlajax

Get a numerical value from a JSON object

Attempting to retrieve information from an API, but encountering an issue due to a numeric property name. The method for accessing the data is as follows: Success: data[i].price_usd Unsuccessful Attempt: data[i].24h_volume_usd Have experimented with ...

javascriptjsonapi

Iterating through lengthy values retrieved from JSON and displaying them on the console using C#

In a file called 'Config.json', I have a JSON file structured like this: { "name": "Michael", "ids": [111111, 222222, 333333, 444444, 555555] } To deserialize it, I am using the following code: Config config = JsonConvert.D ...

c#.netjson

"Integrating Associated Models with Sequelize: A Step-by-Step Guide

I am attempting to retrieve all transactions along with their associated stripePayments, but I keep encountering the error include.model.getTableName is not a function. In my database schema, there is a table for transactions that has a one-to-many relati ...

javascriptmysqlnode.jsormsequelize.js

acquire the document via ng-change

I need help converting this code to be compatible with angular.js so that I can retrieve the data URL and send it using $http.post <input type="file" id="imgfiles" name="imgfiles" accept="image/jpeg" onchange="readURL(this);"> function readURL(i ...

javascriptangularjsfile-uploadfileapi

The express app is configured to send a 301 status code when Supertest is used, and it is

Hello, I am currently utilizing supertest to test the functionality of my Node.js express server application. My goal is to accomplish the following: let request = require('supertest'); let app = require('./server.js'); request(app). ...

javascriptexpresstestingsupertest

The socket.rooms value is updated before the disconnection listener finishes its process

When dealing with the "disconnect" listener, it's known that access to socket.rooms is restricted. However, I encountered an issue with my "disconnecting" listener. After making some modifications to my database within this callback, I attempted to em ...

javascriptnode.jsexpresssocket.io

Leverage the AJAX response data for another JavaScript function

I am interested in utilizing the data received from an AJAX response in another JavaScript function. Here is the AJAX call located in the view file (sell_report.php): <script src="<?php echo base_url(); ?>public/js/jquery-1.12.4.min.js"> ...

javascriptphpjqueryajaxcodeigniter

How do I incorporate global typings when adding type definitions to an npm module?

Suppose I create a node module called m. Later on, I decide to enhance it with Typescript typings. Luckily, the module only exports a single function, so the m.d.ts file is as follows: /// <reference path="./typings/globals/node/index.d.ts" /> decl ...

javascriptnode.jstypescriptnpm

Can PHP send back data to AJAX using variables, possibly in an array format?

My goal is to transmit a datastring via AJAX to a PHP page, receive variables back, and have jQuery populate different elements with those variables. I envision being able to achieve this by simply writing: $('.elemA').html($variableA); $('. ...

javascriptphpjqueryjsonajax

Exploring the versatility of ModelMapper: Implementing various typemaps for a single entity

I am currently using ModelMapper for transforming entities into DTOs. However, we have a requirement where the same endpoints will be accessed by multiple consumers. As a result, we need to restrict certain fields based on the consumer. For example: Consu ...

javajsonjacksonmodelmapper

Ways to retrieve Json Data

I am facing an issue while trying to extract data from a JSON array with nested arrays that contain spaces in their key names. Each time I attempt to execute the code, it results in an error. var sampleError = [ { "LessonName": "Understanding ...

javascriptarraysjson

The client continues to request the file through the REST API

I have noticed a behavior with an audio file stored on the server that clients can request via a REST API. It seems that every time the audio is played again, a new request is sent to the server for the file. Is there a way to prevent this or cache the dat ...

javascripthtmlnode.jsexpress

AngularJS or Angular 2: Reorganize the JSON data once the 'http' response is received

Updated: [{ "name": "b1", "category": "X1", "amount": 15 }, { "name": "b3", "category": "X1", "amount": 35 }, { "name": "b2", "category": "X1", "amount": 25 }, { "name": "b1", "category": "X2", "amount": 150 }, { "name": "b6" ...

angularjsjsonangular

How to center items within a Toolbar using React's material-ui

I need help with implementing a toolbar on a page that contains three ToolbarGroup components: <Toolbar> <ToolbarGroup firstChild={true} float="left"> {prevButton} </ToolbarGro ...

javascriptreactjsmaterial-ui

Is there a way to link table A's ID to table B's userID in a postgreSQL database?

Is it possible in PostgreSQL to establish a relational index between table A ID and table B userId for the purpose of joining two tables based on their ids? To provide further clarification, here is an example using MongoDB and Mongoose: const Billing = ...

javascriptnode.jspostgresqlsequelize.js

Utilize the names of tags to retrieve text content when parsing XML with jQuery's $.parseXML function

Incorporating jquery's $.parseXML() function to extract xml data can be done as follows: For instance, suppose I want to target the book tag which includes nested tags like author and price: //utilizing Sample XML from http://msdn.microsoft.com/e ...

javascriptjqueryxmlparsing

SQL Procedure for Inserting Dynamic Data into MSSQL

Can a stored procedure be created to accept two parameters (Table_Name, Rows) where the rows are in a standard format such as JSON? For example: INSERT("TABLENAME","{{id:1,Code:'AA'},{id:2,Code'BB'}}") Or can it be in any other format ...

sql-serverjsonstored-procedures

Comparing AJAX to a source script request

As I was exploring the Google API today, I came across their sample code where they simply request a URL using: <script src="src="https://www.googleapis.com/customsearch/v1?key=AIzaSyCVAXiUzRYsML1Pv6RwSG1.."></script> Before seeing this, I ha ...

javascriptjqueryajax