在验证失败的情况下防止bootstrap模态消失

Question

I'm trying to stop bootstrap modal from disappearing in case there is any invalid data entered by user.

my php validation code is:

if (isset($_POST['submit'])) {

    $conn = new mysqli("localhost", "ahmesmat", "ZainMalek3110", "SignUpsIroners");

    if ($conn->connect_error) {

            die("Connection failed: " . $conn->connect_error);

    } else
        if (!$_POST['lname'])
            $error="</br>Your first name.";

        if (!$_POST['fname'])
            $error.="</br>Your last name.";

        if (!$_POST['email']) 
            $error.="</br>Your email address.";

        if (!(isset($_POST['day']) && isset($_POST['month']) && isset($_POST['year'])))
            $error.="</br>Your full date of birth.";

        if (!$_POST['phone']) 
            $error.="</br>Your phone number.";

        if (!$_POST['ssn']) 
            $error.="</br>Your social security number.";

        if (!$_POST['staddress']) 
            $error.="</br>Your street address.";

        if (!$_POST['city']) 
            $error.="</br>Your city.";

        if (!$_POST['state']) 
            $error.="</br>Your state.";

        if (!$_POST['zcode']) 
            $error.="</br>Please enter your zip code.";

        if (!$_POST['country']) 
            $error.="</br>Your country.";

        if (!$_POST['radio']) 
            $error.="</br>Tell us if you have an iron or planning to get one.";

}
if (isset($error)) {
    $flag=1;        

}

after the validation the php should return a flag in case of validation failure. The below script should read the flag and retrieve the modal, including the data previously entered by the user:

<script>
//this will launch the modal the first time
$(window).load(function(){
    $('#myModal').modal('show');
});

//this was suppose to retrieve the modal    
$.ajax({
    url:"signupstore.php"
}).done(function() {    
    var flag='<?php echo json.encode($flag); ?>';

    if (flag==1) {
        $('#myModal').modal('show');
    }
});

this obviously did not work. Any suggestions?

Answer 1

Server-side code

<?php
$error = '';
if (isset($_POST['submit'])) {
    $conn = new mysqli("localhost", "ahmesmat", "ZainMalek3110", "SignUpsIroners");
    if ($conn->connect_error) {
        die("Connection failed: " . $conn->connect_error);
    }else{
        if (!$_POST['lname'])
            $error="</br>Your first name.";

        if (!$_POST['fname'])
            $error.="</br>Your last name.";

        if (!$_POST['email']) 
            $error.="</br>Your email address.";

        if (!(isset($_POST['day']) && isset($_POST['month']) && isset($_POST['year'])))
            $error.="</br>Your full date of birth.";

        if (!$_POST['phone']) 
            $error.="</br>Your phone number.";

        if (!$_POST['ssn']) 
            $error.="</br>Your social security number.";

        if (!$_POST['staddress']) 
            $error.="</br>Your street address.";

        if (!$_POST['city']) 
            $error.="</br>Your city.";

        if (!$_POST['state']) 
            $error.="</br>Your state.";

        if (!$_POST['zcode']) 
            $error.="</br>Please enter your zip code.";

        if (!$_POST['country']) 
            $error.="</br>Your country.";

        if (!$_POST['radio']) 
            $error.="</br>Tell us if you have an iron or planning to get one.";
    }
}
if ($error != '') {
    echo $error;   
}else{
    return true;    
}
?>

Client-side code

<script>
//this will launch the modal the first time
$(document).ready(function(){
    $('#myModal').modal('show');
    $.ajax({
      url: 'signupstore.php',
      type: 'POST',
      data: {email: 'your_email', country: 'your country'}, // pass your data here
      success: function(data) {
        //called when successful
        if(data != ''){
            $('.error').html(data); // add a div to display the return errors
        }else{
            $('#myModal').modal('hide');
        }
      }
    });    
});
</script>

I hope this helps.