用javascript显示php结果的弹出窗口

我正在尝试实现javascript来显示来自php的结果。

基本上,我有一个登录页面。 对于失败登录,我不希望用php回显它们,而是希望结果显示在弹出窗口中。

我尝试实现警报框,但看起来我想念一些东西。

成功登录将重定向到logged.php ,并将显示UserNameLoginStatus的详细信息。

如果登录失败,由于我正在使用存储过程, LoginStatus将自动显示失败操作的错误消息。

这是我的完整代码小提琴

这是我的登录页面。

的login.php

 $stmt=odbc_exec($conn,"CALL UserLogin (".$_POST['UserId'].",'".$_POST['UserPwd']."','".$_POST['ModuleCd']."','".$_POST['SubModuleCd']."')"); if (!$stmt) { "Error : " . odbc_errormsg(); } if (odbc_fetch_row($stmt)) { $Username=odbc_result($stmt,"Username"); $LoginStatus=odbc_result($stmt,"LoginStatus"); } /*Succesful Login*/ if ($LoginStatus==1) { $_SESSION["Username"]=$Username; $_SESSION["LoginStatus"]=$LoginStatus; header("Location: logged.php"); } else /*Fail Login*/ echo $Username=odbc_result($stmt,"Username"); echo $LoginStatus=odbc_result($stmt,"LoginStatus"); 

HTML:

 

javascript:

  /*message of fail login*/ function show_alert() { if (LoginStatus != 1) { alert(LoginStatus); }  

有什么建议吗?

您必须使用Ajax将数据发送到PHP并获得答案并显示弹出消息

HTML:

 

JS :(你需要jQuery库)

 jQuery(document).ready(function() { jQuery("#login").submit(function(event) { jQuery.ajax( { url: "login.php", type: "POST", dataType: "html", data: jQuery("#login").serialize(), success: function(data) { if(data == "failed") { alert("LoginStatus"); // If you want send the variable LoginStatus from PHP to JS, you have to get data back using Json ! } else if(data == "success") { window.location.href = "logged.php"; } } }); return false; }); }); 

PHP:

使用您的PHP代码并检查条件是真还是假,并将其回显为“失败”或“成功”。

 

您应该从php返回$ LoginStatus的值,而不是使用重定向。 另外, select不需要像这样的值属性是不正确的。 现在检查这个答案

 function xhr(){ var un=document.getElementById('UserId').value; var pw=document.getElementById('UserPwd').value; var md=document.getElementById('ModuleCd').value; var smd=document.getElementById('SubModuleCd').value; //assume that x is the XHR object x = new XMLHttpRequest(); x.open("POST","login.php",true); x.setRequestHeader("Content-type","application/x-www-form-urlencoded"); var params="UserId="+un+"&UserPwd="+pw+"&ModuleCd="+md+"&SubModuleCd="+smd; x.send(params); x.onreadystatechange=function(){ if(x.readyState==4 && x.status==200){ console.log(x.responseText); checkLogin(x.responseText); } } } function checkLogin(x){ if(x != 1) alert("Login failed"); else window.location.href="logged.php"; }