形式disappers用ajax

提交表格後，我有一個HTML格式如下：形式disappers用ajax

<form role="form" name="login" id="login" > 


    <div id="alert-success" class="alert alert-success" style="display: none" ></div> 
    <div id="alert-danger" class="alert alert-danger" style="display: none" ></div> 

    <div class="form-group"> 
     <label for="exampleInputEmail1">Name</label> 
     <input type="name" class="form-control" id="username" placeholder="Enter name" style="width: 30%;"> 
    </div> 
    <div class="form-group"> 
     <label for="exampleInputEmail1">Email address</label> 
     <input type="email" class="form-control" id="usermail" placeholder="Enter email" style="width: 30%;"> 
    </div> 

    <div class="form-group"> 
     <label for="exampleInputPassword1">Username</label> 
     <input type="password" class="form-control" id="loginname" placeholder="username" style="width: 30%;"> 
    </div> 
    <div class="form-group"> 
     <label for="exampleInputPassword1">Password</label> 
     <input type="password" class="form-control" id="loginpassword" placeholder="Password" style="width: 30%;"> 
    </div> 


    <div class="checkbox"> 
     <label> 
      <input type="checkbox"> Check me out 
     </label> 
    </div> 
    <button type="submit" id="submit" data-dismiss="alert" name="submit" class="btn btn-default">Join Us</button> 
</form>

在同一個文件一個jQuery進行驗證，並提交形式：

$(document).ready(function() { 
     $("#submit").click(function() { 
      var username = $("#username").val(); 
      var usermail = $("#usermail").val(); 
      var loginname = $("#loginname").val(); 
      var loginpassword = $("#loginpassword").val(); 
      var emailregex = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/; 
      if (username == "" || username.length > 20 || !isNaN(username)) { 
       $('#alert-danger').show(); 
       $("#alert-danger").html("Please Enter Proper Name"); 
       $("#username").focus(); 
       return false; 

      } else if (usermail == "" || !emailregex.test(usermail)) { 
       $('#alert-danger').show(); 
       $("#alert-danger").html("Please Enter Your Email Id"); 
       $("#usermail").focus(); 
       return false; 

      } else if (loginname == "" || loginname.length > 10) { 
       $('#alert-danger').show(); 
       $("#alert-danger").html("Please Enter Username"); 
       $("#loginname").focus(); 
       return false; 

      } else if (loginpassword == "" || loginpassword.length > 10) { 

       $('#alert-danger').show(); 
       $("#alert-danger").html("Please Enter Proper Password"); 
       $("#loginpassword").focus(); 
       return false; 

      } else { 
       var datastring = 'name=' + username + '&email=' + usermail + '&loginusername=' + loginname + '&loginuserpassword=' + loginpassword; 

       $.ajax({ 
        type: "POST", 
        url: "userdata.php", 
        data: datastring, 
        cache: false, 
        sucess: function (dataitem) { 
         if (dataitem == 1) { 
          $("#alert-danger").html("Something Went Wrong"); 
         } else { 
          $("#alert-danger").html("Something Went Wrong"); 
         } 
        } 
       }) 
      } 
     }) 
    })

現在我遇到的問題在提交表單時，它確實起作用，因爲數據已保存到數據庫表中，但在提交後我無法看到我的表單，但我仍然使用location.reload();函數，但它仍然不工作，請幫助

來源

2014-01-27 saji

寫「返回false 「在功能的最後。 – SeeTheC

來吧人們，當已經使用jQuery時，爲什麼不這樣做的「正確」的方式...使用'event.preventDefault' – CBroe

這樣做：

$("#submit").click(function() { 

// your code 


return false; 
});

或

中的其他部分

else 

    { 
     var datastring = 'name=' + username + '&email=' + usermail + '&loginusername=' + loginname + '&loginuserpassword=' + loginpassword; 

     $.ajax({ 
      // code .... 
     }); 
     return false; 

    }

當你正確地填寫表格，它已經submited阿賈克斯，然後通過點擊提交的。返回假停止下一次提交，只有你的ajax文章將去。

來源

2014-01-27 07:16:39 SeeTheC

添加E在（）的函數，然後e.preventDefault（），如點擊功能的第一行：

$("#submit").click(function(e) { 
    e.preventDefault(); 

    //code here 
});

來源

2014-01-27 07:24:14 johnnyarguelles

<button type="submit" id="submit" data-dismiss="alert" name="submit" class="btn btn-default">Join Us</button>

應該是：

<input type="submit" id="submit" data-dismiss="alert" name="submit" class="btn btn-default" value="Join Us">

來源

2014-01-27 07:51:28

形式disappers用ajax

回答

相關問題