2014-10-02 3 views
1

Привет, я пытаюсь отредактировать пользователя с помощью localStorage, но не могу разобрать значение моей информации о пользователе в поле ввода моей формы «EditUser».Редактировать пользователя localStorage?

Я читал, что set/getItem() должен использоваться, но попытался с моим User: index без успеха.

Как я могу ИЗМЕНИТЬ текущего пользователя, который зарегистрировался через localStorage?

Fiddle пример http://jsfiddle.net/f3dsfpob/6/

HTML

<form id="userReg"> 
    <div class="item text"> 
     <label>Username:</label> 
     <div class="field"> 
      <input type="text" name="user_name" id="nameUSER" /> 
     </div> 
    </div> 
    <div class="item text"> 
     <label>Password:</label> 
     <div class="field"> 
      <input type="password" name="password" /> 
     </div> 
    </div> 
    <div class="button-wrapper"> 
     <div class="item button button-default"> 
      <div class="field"> 
       <input type="submit" id="registerUser" value="Register" /> 
      </div> 
     </div> 
    </div> 
    <input type="hidden" name="id_entry" value="0" /> 
</form> 
<fieldset name="Login" id="logUser"> 
    <legend>Login</legend> 
    <input type="text" name="first_name" id="firstName" /> 
    <br /> 
    <input type="password" id="passWord" /> 
    <br /> 
    <div class="item button"> 
     <div class="field"> 
      <input type="button" id="logIN" value="login" /> 
     </div> 
    </div> 
    <p id="result"></p> 
    <p id="negative"></p> 
</fieldset> 
<div id="form"> 
    <form id="EditUser"> 
     <table class="form"> 
      <tr> 
       <td> 
        <input type="text" name="changeUser" placeholder="username" /> 
       </td> 
      </tr> 
      <tr> 
       <td> 
        <input type="text" name="changePass" placeholder="password" /> 
       </td> 
      </tr> 
      <tr> 
       <td colspan="2" class="button"> 
        <input id="formSubmit" type="button" value="Undo" onClick="dbClear()" /> 
        <input id="formSubmit" type="button" value="Change" onClick="dbEdit()" /> 
       </td> 
      </tr> 
     </table> 
     <input id="inputAction" type="hidden" name="action" value="add" /> 
     <input id="inputKey" type="hidden" name="key" value="0" /> 
    </form> 
</div> 
<p id="loginResult"></p> 
<p id="negative"></p> 
<p id="registerResult"></p> 

JAVASCRIPT

var User = { 
    index: window.localStorage.getItem("User:index"), 
    $form: document.getElementById("userReg"), 
    $button_register: document.getElementById("registerUser"), 
    $button_login: document.getElementById("logIN"), 
    init: function() { 
     if (!User.index) { 
      window.localStorage.setItem("User:index", User.index = 1); 
     } 
     User.$form.addEventListener("submit", function (e) { 
      var entry = { 
       id: parseInt(this.id_entry.value), 
       user_name: this.user_name.value, 
       password: this.password.value, 
       e_mail: this.e_mail.value 
      }; 
      if (entry.id == 0) { 
       User.storeAdd(entry); 

      } 
      e.preventDefault(); 
     }, true); 
     User.$button_login.addEventListener("click", function (e) { 
      for(var i = 1; i < User.index; i++) { 
       var key = "User:" + i; 
       var entry = JSON.parse(localStorage[key]); 
       console.log("entry : ", key, entry); 

       if (document.getElementById("firstName").value == entry.user_name && document.getElementById("passWord").value == entry.password) { 
        alert("Logged in as"+" "+entry.user_name); 
        document.getElementById("loginResult").innerHTML = "Logged in as"+" "+entry.user_name; 
        console.log("entry : ", key, entry); 
        LoginUser(); 
        e.preventDefault(e);    
       } 
       else 
       { 

      document.getElementById("negative").innerHTML = "Username or Password does not match"; 
     } 
     } 
     }); 
    }, 
    storeAdd: function (entry) { 
     entry.id = User.index; 
     window.localStorage.setItem("User:index", ++User.index); 
     window.localStorage.setItem("User:" + entry.id, JSON.stringify(entry)); 
     document.getElementById("registerResult").innerHTML = "Registration succesful"; 
       return; 
    } 

}; 
User.init(); 

ответ

1

У вас есть несколько вещей неправильно.

e_mail: this.e_mail.value 

Нет почтового ящика. Это выдает ошибку и делает ваш обработчик отправки формы не препятствием по умолчанию.

Btw - возможно, не рекомендуется хранить информацию о пользователе в LocalStorage.

Смежные вопросы