I tried to check if a string value displays on the screen once a button is clicked.It works after reloading the page and then it stops same as before reloading it
let ids1 = document.getElementById('ids')
let ids2 = document.getElementById('ids2')
function saveit(){
localStorage.setItem('store', ids1.value)
localStorage.setItem('store2', ids2.value)
}
//button to save in local storage once is clicked on each ids1 item
let buttonAddSt = Array.from(div).forEach(e =>{
let inputButton = document.createElement('button')
inputButton.innerHTML = 'add'
inputButton.addEventListener('click', saveit )
e.appendChild(inputButton)
})
//button to display info once storage show has value/keys
let buttonTask = document.getElementsByClassName('create')
let local = localStorage.getItem('store')
let local2 = localStorage.getItem('store2')
let paro = document.createElement('p')
paro.innerHTML = local
let newd = document.getElementsByClassName('newd')
//nested if statement to point out specific info missing
if(local !== null ){
if(local2 !== null){
buttonTask[0].addEventListener('click', fire)
}else{
buttonTask[0].addEventListener('click', () => {
alert('date is required')
})
}
} else {
buttonTask[0].addEventListener('click', () => {
alert('description is required')
})
}
by clicking on buttonAddSt
data is saved so I expected that clicking on buttonTask
that will be display but it is like data in local storage key/values are not detected prior to reload even though I can see it. It works after reloading because data is already in localstorage but prior to that if I what to start on an empty input field I do if(local == null )
and it stops displaying the info after refresh, it is like Im in a loop