CODEWITHSUNDEEP
phphtml
BigFella
BigFella

Reputation: 45

Getting PHP Errors to show up in a Modal

I am trying to get it where if there is an error when the user registers it will pop up with a modal like this. (I have it right now with a button to test it out) enter image description here

So my question is how do I get it to pop up with out a button? Like if someone happened to forget their username, the modal would pop up with the error, But How do I get it where If there is an error the modal will pop up with it.? 

            <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>

Upvotes: 0

Views: 1218

Answers (1)

jjoselon
jjoselon

Reputation: 2811

Maybe this could be useful:

<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>

Upvotes: 1

Related Questions