jQuery.msgBox（）插件。如何發送數據到/用戶/登錄登錄用戶

Question

我想使用下面的jQuery插件（jQuery.msgBox()）來執行登錄到CakePHP網站，但我很困惑我需要如何提交數據到我的PHP函數如果登錄成功則用於登錄和重定向;如果不成功則顯示消息。我將不勝感激任何幫助。

這是我用來顯示隱藏的登錄框，當用戶按下鍵盤上的INSERT鍵的jQuery功能。

jQuery(document).bind('keydown', 'insert', function(e) { 
    //alert(e.keyCode); 
     $.msgBox({ 
      type: "prompt", 
      title: "Administrator Log In", 
      opacity: 0.7, 
      inputs: [ 
       { header: "User Name", type: "text", name: "username" }, 
       { header: "Password", type: "password", name: "password" }, 
       //{ header: "Remember me", type: "checkbox", name: "rememberMe", value: "theValue" } 
    ], 
      buttons: [ 
       { value: "Login" }, {value:"Cancel"}], 
      success: function (result, values) { 
       var v = result + " has been clicked\n"; 
       $(values).each(function (index, input) { 
        v += input.name + " : " + input.value + 
        (input.checked != null ? (" - checked: " + input.checked) : "") + "\n";   
       }); 
       alert(v); // for testing purposes. Insert login code below 
       // ======================================================= 

       // ======================================================= 
      } 
     });  
}); 

我最終改變vortextangent的回答一點點，但是它是基於他的答案。請看下面.....

======================================= ==================================================

 jQuery(document).bind('keydown', 'insert', function(e) { 
    //alert(e.keyCode); 
     $.msgBox({ 
      type: "prompt", 
      title: "Administrator Log In", 
      opacity: 0.7, 
      inputs: [ 
       { header: "User Name", type: "text", name: "data[User][username]" }, 
       { header: "Password", type: "password", name: "data[User][password]" }, 
       //{ header: "Remember me", type: "checkbox", name: "rememberMe", value: "theValue" } 
    ], 
      buttons: [ 
       { value: "Login" }, {value:"Cancel"}], 
      success: function (result, values) { 
       var v = result + " has been clicked\n"; 
       $(values).each(function (index, input) { 
        v += input.name + " : " + input.value + 
        (input.checked != null ? (" - checked: " + input.checked) : "") + "\n";   
       }); 
       //alert(v); 
     $.ajax({ 
     url: "https://stackoverflow.com/users/login", 
     type: "post", 
     data: values, 
     success: function(responseText, statusText, xhr, $form){ // Trigger when request was successful 
      //responseLogin 
      if(responseText == "Success") { 
      window.location.href = '/users/account'; 
      }else{ 
      //alert("Wrong credentials. Please try again..."); 
      $.msgBox({ 
       title: "Login Error", 
       content: "Wrong credentials. Please try again...", 
       type: "error", 
       buttons: [{ value: "Ok" }] 
      }); 
      } 
     } 
     }); 
      } 
     });  
}); 

=========================================== ==============================================

Answer 1

使用jQuery ajax method.

jQuery(document).bind('keydown', 'insert', function(e) { 
//alert(e.keyCode); 
    $.msgBox({ 
     type: "prompt", 
     title: "Administrator Log In", 
     opacity: 0.7, 
     inputs: [ 
      { header: "User Name", type: "text", name: "username" }, 
      { header: "Password", type: "password", name: "password" }, 
      //{ header: "Remember me", type: "checkbox", name: "rememberMe", value: "theValue" } 
], 
     buttons: [ 
      { value: "Login" }, {value:"Cancel"}], 
     success: function (result, values) { 
      var v = result + " has been clicked\n"; 
      $(values).each(function (index, input) { 
       v += input.name + " : " + input.value + 
       (input.checked != null ? (" - checked: " + input.checked) : "") + "\n";   
      }); 
      alert(v); // for testing purposes. Insert login code below 
      // ======================================================= 
      $.ajax({ 
       url: "yourloginscript.php", 
       type: "post", 
       data: values, 
       success: function(){ // Trigger when request was successful 
        window.location.href = 'somewhere' 
       }, 
       error: function(request, error, errormessage) { // Show error 
        $("#error").html(error + '\n' + errormessage); 
       }, 
       complete: otherFunction // When request is completed -no matter if the error or not 
      }); 
      // ======================================================= 
     } 
    });  
});