검사 및 부트 스트랩 모달

Question

에서 아약스를 통해 제출 양식은 내가 부트 스트랩의 모달 창 내가 (이메일과 비밀번호가 올바른지 경우)를 제출하기 전에이 양식을 확인하고 싶은

<form method="post" id="loginForm" action="index.php"> 
    <label for="email">Email:</label> 
    <input class="form-control" type="text" name="email" value="" id="emailLogin"/><br/> 

    <label for="password">Password:</label> 
    <input class="form-control" type="password" name="password" value="" id="passwordLogin"/><br/> 
    <div id="loginAlert" class="alert alert-danger" role="alert">Email or password incorrect</div> <!-- Hidden by default --> 

    <button type="submit" name="login" class="btn btn-primary" id="loginButton">Login</button> 
    <script src="checkLoginForm.js"></script></form> 

에서 로그인 양식을 가지고있다. 전자 메일과 암호를 확인하는 함수가 1을 반환하면 올바르지 않은 것이 있습니다. 양식은이 경우 제출해서는 안되며 경고 만 표시하면됩니다. 모든 것이 정확하면 제출해야합니다.

사실 : 이메일과 비밀번호가 올바르지 않은 경우 양식 제출을 막을 수 있지만 올바른 경우 제출할 수 없습니다. 여기에 내가 무엇을 할 생각이 없다 checkLoginForm.js

$(document).ready(function() { 
    $("#loginForm").submit(function(event) { 
     event.preventDefault(); 
     $.ajax({ 
      type: 'POST', 
      url: 'include/ajax.php?action=checkLogin', 
      data: { 
       email: $("#emailLogin").val(), 
       password: $("#passwordLogin").val(), 
      }, 
      success: function(result) { 
       console.log(result); 
       if(result == 0) { 

       } else { 
        $("#loginAlert").css({"display": "block"}); 
       } 
      } 
     }); 
    }); 
}); 

의 코드는 양식을 제출하지 않는 내가 $("loginForm").submit();을 할 경우 결과 == 0, (다른 부분은 작업 수행) 할 때입니다.

답장을 보내 주셔서 감사합니다.

Answer 1

간단한 $.post을 사용하도록 조언 하겠지만, 이는 POST 요청에 $.ajax을 사용하는 간단한 방법입니다. 제공된 값이 PHP 파일에서 올바른지 확인하십시오. 데이터가 올 바르고 true를 반환하거나 사용자를 다른 페이지로 리디렉션하는 경우 false를 반환합니다. 당신의 PHP 파일에서 다음

$(document).ready(function() { 
    $("#loginButton").on('click', function (e){ 
     e.preventDefault(); 
     var email = $("#emailLogin").val(); 
     var passwd = $("#passwordLogin").val(); 
     $.post('include/ajax.php?action=checkLogin', {email: email, password: passwd}, function (data) { 
      var res = $.parseJSON(data); 
      if (res.result == true) { 
       //you can redirect the or display a message to the user. 
       //redirect the user to another page 
       //$("#loginAlert").css({"display": "block"}).html("login successful"); 
      }else { 
       $("#loginAlert").css({"display": "block"}); 
      } 
     }); 
    }); 
    }); 

는

if (isset($_GET['action']) && $_GET['action'] == 'checkLogin') { 
    $passwd = trim(filter_input(INPUT_POST, 'password', FILTER_SANITIZE_STRING)); 
    $email = trim(filter_input(INPUT_POST, 'email', FILTER_VALIDATE_EMAIL)); 
    //validate inputs here 
    //get data from db 
    //then compare values 
    //if values match return true 
    //$db_mail and $db_passwd are from the db. 
    if ($email == $db_mail && $passwd == $db_passwd) { 
     //if the provided information is correct 
     //process it here, login the user. 
     //redirect if necessary. 
     // or return results to JS 
     echo json_encode(['result' => true]); 
    } else { 
     //if the information is wrong return false to JS 
     //and alert the user 
     echo json_encode(['result' => false]); 
    } 
}