使用<input type =“text”/>更改localStorage

Question

我正在建立一个管理面板论坛，管理员可以在其中更改用户提供的信息。

我正在将用户从localStorage检索到<input type="text">，但我无法更改信息并将其保存在localStorage中。

每次单击编辑按钮时，我都会收到erorr Uncaught TypeError: Cannot set property 'firstName' of undefined。

P.S：学校项目。

function seeUser(){
    $(document).on('click', ".user .glyphicon-edit", function() {
        var dataPage = "PersonalProfile";
        var personalProfileDiv = $("#personalProfile");
        $(".MyPage").css({"display":"none"});
        $("#personalProfile").html("");

        personalProfileDiv.append("<input type='text' id='userName' value='"+arrayUsers[$(this).parent().parent().attr("data-userId")].firstName+"'>");
        personalProfileDiv.append("<input type='text' id='userLastname' value='"+arrayUsers[$(this).parent().parent().attr("data-userId")].lastName+"'>");
        personalProfileDiv.append("<input type='text' id='userE-mail' value='"+arrayUsers[$(this).parent().parent().attr("data-userId")].email+"'>");
        personalProfileDiv.append("<input type='text' id='userPassword' value='"+arrayUsers[$(this).parent().parent().attr("data-userId")].password+"'>");
        personalProfileDiv.append("<button class='btn btn-primary btn-lg' data-userId='"+loggedInUserId+"' id='editUserBtn'>Edit user</button>");
    });
}

$(document).on('click', "#editUserBtn", function() {
    var userId = $(this).attr("data-userId");
    var userFirstNameChange = $(this).prev().prev().prev().prev().val();
    var userLastNameChange = $(this).prev().prev().prev().val();
    var userEmailChange = $(this).prev().prev().val();
    var userPasswordChange = $(this).prev().val();
    arrayUsers[userId].firstName = userFirstNameChange;
    arrayUsers[userId].lastName = userLastNameChange;
    arrayUsers[userId].email = userEmailChange;
    arrayUsers[userId].password = userPasswordChange;
    localStorage.users = JSON.stringify(arrayUsers);
});