2017-08-23 17 views
0

私はそれを取得しようとしています。ユーザーが登録するときにエラーが発生した場合、このようなモーダルがポップアップ表示されます。 (私はすぐにそれをテストするためのボタンを持っています) enter image description herePHPエラーをモーダルに表示する

私の質問はどのようにそれをボタンでポップアップ表示するのですか?誰かが自分のユーザー名を忘れてしまったように、モーダルはエラーでポップアップしますが、どうすればそれを得ることができますか?エラーがある場合、モーダルがポップアップ表示されます。

  <div class="buttonWrapper"> 
          <button type="button" class="btn btn-success btn-df float-button-dark waves-effect waves-effect waves-button waves-float waves-dark" data-toggle="modal" data-target="#myModal2">Primary</button> 


          <div class="modal modal-default fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> 
          <div class="modal-dialog" role="document"> 
           <div class="modal-content"> 
            <div class="modal-header"> 
             <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
             <h4 class="modal-title" id="myModalLabel1">Whoops! Something Happened.</h4> 
            </div> 
            <div class="modal-body"> 


           <?php 
      //check for any errors 
      if(isset($error)){ 
       foreach($error as $error){ 
        echo '<p> - '.$error.'</p>'; 
       } 
      } 

      //if action is joined show sucess 
      if(isset($_GET['action']) && $_GET['action'] == 'joined'){ 


       echo "<h2 class='alert alert-success'>Registration successful, please check your email to activate your account.</h2>"; 

      } 
      ?> 


            </div> 
            <div class="modal-footer"> 
             <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
            </div> 
           </div> 
          </div> 
         </div> 

         </div> 
+0

は、ユーザーがフォームを送信するとき、モーダルを表示したい、またはフィールドを入力しながらのですか? – jjoselon

+0

ちょうどモーダルなので、上記のようなエラーがあった場合は、パスワードやユーザー名や電子メールが入力されていないので、モーダルをポップアップしてユーザーにエラーを表示します。 – BigFella

答えて

1

多分これは役に立つかもしれません:

<html> 
 
    <body> 
 
    
 
    <script src="https://code.jquery.com/jquery-1.10.2.js"></script> 
 
    <script> 
 
    $(document).ready(function() { 
 
    $('#idForm').on('submit', function (e) { 
 
    e.preventDefault(); 
 
    var inputs = { 
 
     user : { 
 
      field : $('#fieldUser'), 
 
      error : 'field user required !' 
 
     }, 
 
     password : { 
 
      field : $('#fieldPassword'), 
 
      error : 'field password required !' 
 
     }, 
 
     email : { 
 
      field : $('#fieldEmail'), 
 
      error : 'field email required !' 
 
     }  
 
    }; 
 
    var errors = new Array(); 
 

 
    for(input in inputs) { 
 
    //console.log(inputs[input].field.empty()) 
 
     if(inputs[input].field.val() === "") { 
 
     //alert(inputs[input].error) 
 
     errors.push(inputs[input].error); 
 
     } 
 
    } 
 
    // errors var contain all errors 
 
    if(errors.length > 0) { 
 
     // here show your modal with errors. 
 
     //$('#idModal').show(); 
 
     //alert(errors); 
 
     var errorsJoin = errors.join('\n'); 
 
     alert('please review this errors : \n' + errorsJoin); 
 
    } else { 
 
     alert('sign up successfully'); 
 

 
    } 
 

 
    }) 
 
    }) 
 

 
    </script> 
 

 
    <form method="POST" id="idForm"> 
 
    user : <input type="text" id="fieldUser"> <br> 
 
    pass :<input type="text" id="fieldPassword"> <br> 
 
    email :<input type="text" id="fieldEmail"> <br> 
 
    <input type="submit" value="Sign Up"> 
 
    </form> 
 
    
 
    </body> 
 
</html>

+0

それは動作します。ありがとうございました! – BigFella

関連する問題