返回FALSE不工作的形式

我有一個日誌的形式，我試圖通過AJAX提交。我有一個類似的註冊表單，它工作得很好;然而，返回虛假陳述並未解僱。返回FALSE不工作的形式

我的日誌形式如下：

<form name="loginForm" id="loginForm" action="userSystem/userSystem.php" method="post"> 
    <div class="loginTable"> 
     <div class="loginRow"> 
     <div class="loginCell"><label for="username">Username:</label></div> 
      <div class="loginCell"><input type="text" name=="username" id="loginFormUser"></div> 
     </div> 
     <div class="loginRow"> 
     <div class="loginCell"><label for="password">Password:</label></div> 
      <div class="loginCell"><input type="password" name="password" id="loginFormPass"></div> 
     </div> 
     <div class="loginRow"> 
     <div class="loginCell">&nbsp;</div> 
     <div class="loginCell"><input type="submit" name="submit" value="Log In" id="loginFormSubmit"></div> 
     </div> 
    </div> 
    </form> 
</section> 
<section id="loginBarRegForm"> 
    <h1>Step Two</h1> 
    <form name="regForm" id="regForm" action="usersystem/register.php" method="post"> 
    <div class="loginTable"> 
     <div class="loginRow"> 
     <div class="loginCell"><label for="r_username">Username:</label></div> 
     <div class="loginCell"><input type="text" name="r_username" id="r_username"></div> 
     <div class="loginCell"><span id="r_usernameFeedback"></span></div> 
     </div> 
     <div class="loginRow"> 
     <div class="loginCell"><label for="r_password">Password:</label></div> 
     <div class="loginCell"><input type="password" name="r_password" id="r_password"></div> 
     <div class="loginCell"><span id="r_passwordFeedback"></span></div> 
     </div> 
     <div class="loginRow"> 
     <div class="loginCell"><label for"r_vpassword">Verify Password</label></div> 
     <div class="loginCell"><input type="password" name="r_vpassword" id="r_vpassword"></div> 
     <div class="loginCell"><span id="r_vpasswordFeedback"></span></div> 
     </div> 
     <div class="loginRow"> 
     <div class="loginCell"><label for="email">Email:</label></div> 
     <div class="loginCell"><input type="text" name="r_email" id="r_email"></div> 
     <div class="loginCell"><span id="r_emailFeedback"></span></div> 
     </div> 
     <div class="loginRow"> 
     <div class="loginCell"></div> 
     <div class="loginCell"><input type="submit" name="r_submit" value="Register" id="r_submit"></div> 
     <div class="loginCell"></div> 
     </div> 
     </div> 
    </form>

而且我想要當點擊提交按鈕上

$("#loginFormSubmit").click(function() { 
    form_data = { 
    username: $("#loginFormUser").val(), 
    password: $("#loginFormPass").val(), 
    operation: "login", 
    is_ajax: 1 
    } 

    $.ajax({ 
    type: "POST", 
    url: "userSystem/userSystem.php", 
    data: form_data, 
    dataType: json, 
    success: function(data) { 
     if(data.success) { 
     $("#loginBarLoginForm").fadeOut("slow"); 
     $("#userDetailsUsername").html(data.username); 
     $("#userDetailsEmail").html(data.email); 
     $("#userDetails").fadeIn('slow'); 
     } else { 
     $("#loginbarLoginForm").fadeOut("slow"); 
     $("#loginBoxResponseDiv").html(data.message); 
     $("#loginBoxResponseFrame").fadeIn("slow"); 
     } 
    } 
    }); 
    return false; 
});

來執行JavaScript到目前爲止，這是關於最在我開發的深度應用程序中，但它只是沒有意義，爲什麼返回false將在一個實例中工作，而不是另一個。除數據外，它們幾乎是相同的功能。

謝謝你的任何幫助，你可以提供:)

編輯：更新的代碼。

$("#loginFormSubmit").click(function() { 
    console.log("Click Event Firing"); 
    var form_data = { 
     username: $("#loginFormUser").val(), 
     password: $("#loginFormPass").val(), 
     operation: "login", 
     is_ajax: 1 
    }; 
    console.log("variables Assigned " + form_data['username'] + " " + form_data ['password']); 

    $.ajax({ 
     type: "POST", 
     url: "userSystem/userSystem.php", 
     data: form_data, 
     success: function(data) { 
      console.log("Ajax Working"); 
      if(data.success === true) { 
      $("#loginBarLoginForm").hide(); 
       $("#loginBoxResponseDiv").html("<p>You have been loged in " + data.username + "!"); 
       $("#loginBoxResponseFrame").fadeIn("slow"); 
      } else { 
       $("#loginBarRegForm").hide(); 
       $("#loginBoxResponseDiv").html(data.message); 
       $("#loginBoxResponseFrame").fadeIn("slow"); 
      } 
     } 
    }); 
});

該代碼現在將返回一個JSON響應，但成功函數未被觸發。

來源

2012-05-09 FireCrakcer37

嘗試使用'提交（）'函數，而不是點擊功能。 – run

如果您通過'Ajax'提交表單，那麼您可以簡單地使用'type =「按鈕''而不是'type =」submit「'來防止表單提交 – uttam

通過將提交更改爲按鈕，我可以得到甚至消防;但是，阿賈克斯根本不工作。 – FireCrakcer37

事實證明，一直以來，我只是在我的解決方案中缺少一些引號。我需要更換：

dataType: json,

有：

dataType: "json",

一旦我得到了，該解決方案進入了地方，而現在我的用戶將能夠登錄，而無需刷新頁面。我仍然有很長的路要走這個項目，但是謝謝大家幫助我指出正確的方向。我也覺得自己能夠自己找到答案;然而，如果我從SO社區那裏得到了很好的幫助和提示，我從來不會這樣做。你們是百萬分之一！

最終的解決方案最終看上去像這樣：

$("#loginFormSubmit").click(function() { 
    console.log("Click Event Firing"); 
    var form_data = { 
     username: $("#loginFormUser").val(), 
     password: $("#loginFormPass").val(), 
     operation: "login", 
     is_ajax: 1 
    }; 
    console.log("variables Assigned " + form_data['username'] + " " + form_data ['password']); 

    $.ajax({ 
     type: "POST", 
     url: "userSystem/userSystem.php", 
     dataType: "json", 
     data: form_data, 
     success: function(data) { 
      console.log("Ajax Working"); 
      console.log("data.success: " + data.success); 
      console.log("data.username: " + data.username); 
      if(data.success === true) { 
       console.log("data.success was true"); 
       $("#loginBarLoginForm").hide(); 
       $("#loginBoxResponseDiv").html("<p>You have been loged in " + data.username + "!"); 
       $("#loginBoxResponseFrame").fadeIn("slow"); 
       $("#notLoggedIn").fadeOut("slow"); 
       $("#currentlyLoggedIn").fadeIn("slow"); 
       $.cookie("username", data.username, {expires: 7, path: "/"}); 
       $.cookie("id", data.id, {expires: 7, path: "/"}); 
       $.cookie("email", data.email, {expires: 7, path: "/"}); 
       $.cookie("user_level", data.user_level, {expires: 7, path: "/"}); 
       $.cookie("active", data.active, {expires: 7, path: "/"}); 
       $.cookie("reg_date", data.reg_date, {expires: 7, path: "/"}); 
       $.cookie("last_login", data.last_login, {expires: 7, path: "/"}); 
       $("#cookieUsername").html($.cookie("username")); 
       $("#cookieID").html($.cookie("id")); 
       $("#cookieEmail").html($.cookie("email")); 
       $("#cookieUserLevel").html($.cookie("user_level")); 
       $("#cookieActive").html($.cookie("active")); 
       $("#cookieRegDate").html($.cookie("reg_date")); 
       $("#cookieLastLogin").html($.cookie("last_login")); 
      } else { 
       console.log("data.success was false"); 
       $("#loginBarRegForm").hide(); 
       $("#loginBoxResponseDiv").html(data.message); 
       $("#loginBoxResponseFrame").fadeIn("slow"); 
      } 
     } 
    }); 
});

來源

2012-05-09 16:20:56 FireCrakcer37

return false的處理程序中，但ajax外以防止提交的默認操作。

$("#loginForm").on('submit',function() { //attach handler to form 
    form_data = {...}      //form data 
    $.ajax({...});      //fire ajax 
    return false;       //prevent default action 
});

來源

2012-05-09 04:56:53 Joseph

當我複製代碼時，我正在嘗試移動它以啓動它。我已經更新了代碼以反映它應該出現的位置，但我仍然得到相同的錯誤。我仍然在錯誤的地方嗎？ – FireCrakcer37

@ FireCrakcer37會發生什麼？控制檯說什麼？網絡標籤說什麼？ – Joseph

該頁面轉到userSystem/userSystem.php – FireCrakcer37

返回假工作的需要，但問題是，成功的方法是一個回調，這是由jQuery的暗中調用每當有從Ajax調用服務器端的成功的消息，所以當時時間，你沒有任何手柄，得到它的價值，所以無論你需要另一種方法來定義你的邏輯，使方法調用在這裏，因爲它的回調，你沒有手柄來操縱。

是的，如果你想要回$.ajax()調用返回false，那麼可以刪除return虛假陳述的成功方法的範圍之內。

來源

2012-05-09 04:58:23

只是一個想法，但改變輸入從「提交」，「按鈕」類型。

而且，只是爲了調試的目的，並不動態分配click事件。改變你的JS到這一點：

function NamedFunction() { 
    form_data = { 
    username: $("#loginFormUser").val(), 
    password: $("#loginFormPass").val(), 
    operation: "login", 
    is_ajax: 1 
    } 

    $.ajax({ 
    type: "POST", 
    url: "userSystem/userSystem.php", 
    data: form_data, 
    dataType: json, 
    success: function(data) { 
     if(data.success) { 
     $("#loginBarLoginForm").fadeOut("slow"); 
     $("#userDetailsUsername").html(data.username); 
     $("#userDetailsEmail").html(data.email); 
     $("#userDetails").fadeIn('slow'); 
     } else { 
     $("#loginbarLoginForm").fadeOut("slow"); 
     $("#loginBoxResponseDiv").html(data.message); 
     $("#loginBoxResponseFrame").fadeIn("slow"); 
     } 
    } 
    }); 
    return false; 
}

然後添加到您的提交按鈕

onclick="NamedFunction(); return false;"

我不建議你保持這種狀態，但也許這些2度的變化，你真的可以追查什麼發生。

來源

2012-05-09 06:45:02

返回FALSE不工作的形式

回答

相關問題