1

hello I have a small project I'm working on. the project is calling an API with ajax and getting info about currencies, one of the things I'm stuck on is that I have to write them in cards that include a checkbox that has to stay activated after I refresh the page. any suggestions?.. please I'm desperate

  • 1
    Can you post any code? – Fabio Assuncao Dec 10 '19 at 00:28
  • ` I am checked by default` – Iskandar Reza Dec 10 '19 at 00:28
  • JS: `document.getElementsByName("something")[0].checked = true` – Iskandar Reza Dec 10 '19 at 00:31
  • To "preserve" you'll need to rely on the browser if not maintaining state server-side; some popular options are: 1) cookies 2) localStorage 3) queryString params (embed in URL) – Mike Dec 10 '19 at 01:05
  • @Shadi Were any of the below answers helpful to you? If so, please select a "correct" answer *(by clicking the checkmark beside an answer)* to close the question, or provide an answer yourself and choose that as the correct answer. Otherwise, please add comments below one of the answers or edit your original question to add more detail so that additional answers can be provided. *Thanks!* – cssyphus Jul 14 '20 at 01:56

3 Answers3

0

When you make your call on your API just set the checked value on the correct checkbox, please have in mind that setting checked=false will still give you a checked checkbox.

 <input type="checkbox" checked>
0

One way to preserve information against a page refresh is to use localStorage.

LocalStorage allows you to store key:value variable pairs in the local browser. You can view the localStorage values for any given website in DevTools F12, on the Application tab. The variables are stored by website, and remain as they are until (a) they are deleted, or (b) browser cache is cleared. (For more info on when localStorage is cleared, see this answer).

LocalStorage is dead-simple to use:

let myPet = 'Cat';
localStorage.setItem('animal', myPet);

And to read it:

let myPet = localStorage.getItem('animal');

What you might want to do in your project, perhaps on a timer - or after the ajax call - is loop through your fields and create an object with all the fieldnames/values. Then use JSON.stringify to turn the object into text that you can store in a localStorage variable.

Note that you will need to write something that on page load ( $(document).ready() ) will see if the fields are empty and if there is a RECENT localStorage variable (so, you might want to create second localStorage variable (you can have MANY) that has the last-updated datetime) then you read the JSON string into a javascript object and populate your field values.

cssyphus
  • 37,875
  • 18
  • 96
  • 111
0

I would recommend using a dictionary, putting something unique like an ID of those currencies that are checked at that time. If the new answer you get has the same currencies as before plus more, you can use that dictionary in memory to check those items again. If you don't get the previous response, you can just add those new items to avoid unchecking the checked currencies.

Exmaple:

var dictionary = {};

// here you should do a forEach in currently checked currencies
...
   dictionary[id] = value; // (true, because it is the value of checked)

Hope it helps you.

Richard Fazzi
  • 433
  • 3
  • 9