2016-06-19 10 views
-1

AJAXエラーイベントに問題があります。私は成功した(下図)div要素の成功AJAXエラーイベントに関する問題

<div class="alert alert-success"> <strong>Logging in..</strong></div> 
をログインに成功に 成功メッセージを実装し、表示した後(私はジャバスクリプト初心者くさいよ)

このサイトから質問/回答を使用して一緒にいくつかのコードを入れて管理してきました

ログインモーダルフォームのログインに失敗した場合にエラーメッセージを表示しようとしています。 はここ

<form id="myform" method="POST" role="form"> 
<div class="modal fade" id="test" role="dialog"> 
<div class="modal-dialog"> 
    <!-- Modal content--> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal">&times;</button> 
     <h4 class="modal-title">Prijava</h4> 
     </div> 
     <div class="modal-body"> 
      <div id="error"> 
       <div class="alert alert-danger"> <strong>Error, try again!</strong> </div> 
      </div> 
      <div id="thanks"> 
       <div class="alert alert-success"> <strong>Logging in..</strong></div> 
      </div> 

      <div class="form-group"> 
       <label for="user">User:</label> 
       <input name="user" type="text" class="form-control" placeholder="Unesi korisnika"> 
      </div> 
      <div class="form-group"> 
       <label for="pass">Password:</label> 
       <input name="pass" type="password" class="form-control" placeholder="Unesi lozinku"> 
      </div> 
     </div> 
     <div class="modal-footer"> 
     <button type="button" class="btn btn-default" id="reset" data-dismiss="modal">Close</button> 
     <button type="submit" class="btn btn-success" id="submitForm">Login in!</button> 
     </form> 
     </div> 
    </div> 

そして、ここでは、AJAXコードのための私のコード

$("#error").hide(); 
$("#thanks").hide(); 
$("#myform").submit(function (e) { 
    var url = "login.php"; 
    $.ajax({ 
     type: "POST", 
     url: url, 
     data: $('#myform').serialize(), 
     success: function (data) { 
      $("#thanks").show(); 
      setTimeout(function() { 
      top.location.href ='admin.php'; 
     }, 2000); 
     }, 
     error: function (jqXHR, textStatus, errorThrown) { 
      $("#error").show(); 
     } 
    }); 
    e.preventDefault(); 
}); 

成功イベントでモーダルフォームのコードが正常に動作しているが、問題は、エラーイベントです。私が何を書いても、それは#thanks divを表示し、#error divを完全に無視します。私はちょうどログインに成功した場合は#thanksを、モーダルフォームでは失敗した場合は#error divを表示したいだけです。あなたがプロセスにAJAX成功の機能のためのメッセージを持つサーバー上のPHPからブラウザにデータを送信する必要が

+0

'.error'ハンドラが呼び出されましたか? – Rayon

+4

サーバ側で何らかのエラーが発生すると 'error'イベントが発生します - あなたのスクリプトは利用できないか、40x/50xステータスコードがあります。あなたのスクリプトからのメッセージが見つからないかパスワードが間違っているというメッセージは__errors__ではありません。 –

+0

ああ、それは意味がある...あなたはそのことについて何をお勧めしますか? – Svinjica

答えて

2

login.php

//do your stuff then 
if (everything_is_OK) {echo "good to go!";} else {echo "problem";} 

AJAX

success: function (data) { 
      if (data==="good to go!"){$("#thanks").show();} 
      if (data==="problem"){$("#error").show();} 
      } 
+0

偉大な、それは魅力のように動作します! GG&WP! :) – Svinjica

関連する問題