Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

148
Views
initialization/default of checkbox checked value antd table using local storage react js

In this code, I have created local storage 'selection' for storing what is checked.

when I reload the page, what was selected before should already show a checked

I am not aware if there is a properly like that for antd table please help app.js file

     const { filteredData, loading } = useTableSearch({
    searchVal,
    retrieve: fetchUsers
  });
  function onChange2(pageNumber) {
    console.log("Page: ", pageNumber);
  }
      const rowSelection = {
        onChange: (selectedRowKeys, selectedRows) => {
          localStorage.setItem("selection", JSON.stringify(selectedRows));
          var storage = localStorage.getItem("selection");
          console.log(storage);
          // console.log(
          //   `selectedRowKeys: ${selectedRowKeys}`,
          //   "selectedRows: ",
          //   selectedRows
          // );
        },
        getCheckboxProps: (record) => ({
          disabled: record.ifsc === "Disabled User",
          ifsc: record.ifsc,
          className: "checkbox-red"
        })
      };
    
      // var dataSource2 = this.storage;
      return (
        <>
          <div className="container">
            <div className="container2">
              <Search
                onChange={(e) => setSearchVal(e.target.value)}
                placeholder="Search"
              />
            </div>
            <br /> <br />
            <Table
              rowSelection={rowSelection}
              rowKey="ifsc"
              dataSource={filteredData}
              columns={userColumns}
              loading={loading}
              pagination={
                <Pagination
                  size="small"
                  showSizeChanger
                  showQuickJumper
                  defaultCurrent={2}
                  total={500}
                  onChange={onChange2}
                />
              }
            />

link below https://codesandbox.io/s/search-in-react-table-forked-p9x544

about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!