Question

我遇到了以前视图中的表单数据持续存在的问题，然后再次调用该视图时，持久数据会混淆用户尝试发送的信息。例如，在app load上我有一个登录视图。当用户提交用户名和密码时，我从父级删除视图，然后加载主应用程序。当用户注销时，我清除我的模型并重建登录视图。当用户点击提交按钮（无表格）时，dom显示2组用户登录数据。有没有人有关于如何使用jquery从dom中清除表单数据的建议？

我使用带有bootstrap的jquery，并使用brite.js作为我的mvc框架。

这是我的登录表单

<div id="loginForm" data-b-view="Login" data-brite-cid="bview_37">
    <div class="border shadow rounded text-center" style="margin: 0 auto !important;width:750px;">
      <div class="holder lText">
        <h2>Welcome to dmEDGE5!</h2>
        <div class="span7">"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam. </div>
        <div class="span7">
          <div class="row">
            <span>Username: </span>
            <input id="loginUser" type="text">
          </div>
          <div class="row">
            <span>Password: </span>
            <input id="loginPass" type="password">
          </div>
          <div class="row">
            <span>Remember me on this computer </span>
            <input id="loginRemember" type="checkbox" checked="checked">
          </div>
          <div class="row">
            <button id="loginSubmitBtn" class="btn btn-primary pull-right">Login!</button>
          </div>
          <p class="cText"><span id="forgotPass" class="link">Forgot Password</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span id="createAcct" class="link">Create Account</span></p>
        </div>
        <div class="clearfix">&nbsp;</div>
      </div>
    </div>
    <div class="clearfix">&nbsp;</div>      
  </div>

现在这里是我的jquery监听器和结果函数

$('#loginSubmitBtn').click(function() {
var user = $('#loginUser').val();
var pass = $('#loginPass').val();
if ($('#loginRemember').is(":checked")){
    localStorage.Username = user;
}else{
    localStorage.Username = '';
}
loginUser(user, pass)
});

function loginUser(user, pass){
  if (user.length > 1 || pass.length > 1 ){
    location.hash = '#/authenticateUser';
    authUser(user, pass);
  } else {
      alert('Your username or password is incorrect please try again.');
      location.hash = '#/login';
  }
}

function authUser(user, pass){
  var url = modelLocator.httpServiceRoot + 'j_spring_security_check';
  $.ajax({
      type: 'POST',
      url: url,
      data: {
        j_username : user,
        j_password : pass
      },
      success: function(data, textStatus, jqXHR){
        loginSuccess(data, textStatus, jqXHR)},
      error: function(jqXHR, textStatus, errorThrown){
        loginError(jqXHR, textStatus, errorThrown)},
      timeout: function(){ loginTimeout() },
      scriptCharset: 'UTF-8',
      dataType: 'xml'
    });
}

此外，如果用户错误地登录然后正确登录，则会登录两次。首先使用错误的凭据，然后使用正确的凭据。

所以底线是我如何在用户点击按钮后清除信息。

还使用$（'＃loginForm input'）。val（''）;如果我这样做，jquery提交''即使用户输入数据也不起作用。

有人建议使用一组表单标签来利用.reset（），但是我们看到这会导致IE中的错误，点击该按钮会导致页面重新加载并影响hashchange。在firefox和chrome我看到数据双提交。有一个点击监听器，所以不知道为什么它会加倍。另外正如我所提到的，我们正在使用mvc框架与把手和bootstraps一起根据来自服务器的数据动态构建页面。所以页面渲染的流程是

App Loads up
根据网址中的哈希值，我们使用mvc来调用视图控制器（在本例中为登录视图）
控制器进行所有数据调用并将数据推送到模型中。然后向mvc和把手发送渲染请求。
处理条形循环遍历模板并返回完成的html
视图对用户可见

我看到的是你第一次登录罚款。然后当您注销并重新登录时，会进行两次所有通话。然后，如果你再次注销，第三次登录会拨打所有电话三次。

我尝试了$（'divID input'）。val（''）和$（'divID input'）。val（null）但是当用户输入一个值时，它显示为''或null。< / p>

如果您有任何建议，请告诉我

杰夫

Answer 1

尝试：$('#loginForm').reset()，但您需要使用实际表单，而不是DIV。

删除将在以后重用的视图时如何清除dom表单数据

1 个答案: