As I work on developing an app using PhoneGap for iOS, I encounter an issue with LocalStorage. After entering and storing a username and password on my iPad, I close the app, open it again, and enter a new set of login credentials. However, when inspecting the app using Safari Web inspector on my Macbook, I notice that only the most recent username and password are displayed under "Storage -> localStorage". The initial set of login data seems to have disappeared. Can anyone provide insight into why this behavior occurs?
Here is my JavaScript code:
<script type="text/javascript">
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
document.getElementById("btnSave").addEventListener("click", saveData, false);
document.getElementById("btnGet").addEventListener("click", getData, false);
}
function saveData(){
var username = document.getElementById("username").value;
var password = document.getElementById("password").value;
window.localStorage.setItem("uname", username);
window.localStorage.setItem("pass", password);
alert("Your data has been saved");
}
function getData(){
var output = "Your username is " + window.localStorage.getItem("uname") + " and your password is " + window.localStorage.getItem("pass");
document.getElementById("result").innerHTML = output;
}
</script>
Here is the HTML code:
User Name: <input type ="text" id="username" /><br />
Password: <input type="text" id="password" /><br />
<button id="btnSave"> Save Data </button>
<button id="btnGet"> Get Data </button>
<div id="result"></div>
Despite my efforts to locate the missing stored data in the web inspector, I have been unable to identify the issue. Could there be a flaw in the code causing this unexpected behavior?