使用模式登录时出现错误消息 - error message using modals for login

如果登录失败，我需要显示一个对话框。现在我可以在表单中显示错误行，但我需要使用modals显示错误消息。这是我的代码：

$sfAuth = new SfAuthenticate();
$sfHelper = new SfHelper();
$user = $_POST['txtUsername'];
$pass = $_POST['txtPassword'];  
$checkUser = $sfAuth->checkUserJobSeeker($user);
if($checkUser)
{
    $login = $sfAuth->loginJobSeeker($user, $pass);
    if($login)
    {           
        echo $sfHelper->redirect('forms/jobSeeker/HomeJobSeeker.php');
    }else{
        echo $sfHelper->redirect('forms/jobSeeker/formLoginJobSeeker.php?err=Invalid Username or Password');
    }
}else{
    echo $sfHelper->redirect('forms/jobSeeker/formLoginJobSeeker.php?err=Sorry, We Cannot found your Username');
    }

我想在重定向到登录表单后显示对话框。有人能帮我吗？

看看这个小提琴，它应该能工作：http://jsfiddle.net/7PwWp/5/

至于在用户错误时启动模式窗口，您可以添加一个条件：

<?php if(isset($_GET['err']): ?>
  launchWindow('#message');
<?php endif; ?>

在消息框中，您可以输入：

<p><?php echo (isset($_GET['err'])? $_GET['err']:''; ?></p>

要显示模式对话框，您需要javascript。请检查之前的SO问题：如何在HTML中创建弹出窗口（模式对话框）。同样，我建议您查看jQueryUI，它是javascript库jQuery的扩展。

在3个步骤中，这是如何工作的：

在页面中包含jQuery和jQueryUI库脚本

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/base/jquery-ui.css" type="text/css" media="all" />
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/jquery-ui.min.js"/></script>

为要显示的模式对话框创建标记

不需要太花哨，但要注意id标记，因为jQuery使用它来知道在对话框中显示哪个元素。

<div id="dialog" title="Basic dialog">
    <p>This is the message inside the modal dialog.</p>
</div>

使用jQueryUI显示对话框

<script>
    $(document).ready(function() {
        $( "#dialog" ).dialog();
    });
</script>

请在此处查看完整的工作示例：http://jsfiddle.net/wjp94/3/

将此代码放在formLoginJobSeeker.php文件上

<?php
if($_GET['err'] == "Sorry, We Cannot found your Username")'
{
echo '<script> alert("Sorry Wrong Username Or Password");</script>'
}
?>

如果要显示对话框，则必须使用jquery对话框

将以下代码添加到您的页面；

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/base/jquery-ui.css" type="text/css" media="all" />
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/jquery-ui.min.js"/></script>
<div id="dialog" title="Basic dialog" style="display:none">
  <p>
         <?php if(isset($_GET['err'])) echo $_GET['err'];?>
  </p>
</div>

<?php if(isset($_GET['err']){ ?>
   <script type="text/javascript">
   $(document).ready(function() {
         $( "#dialog" ).dialog();
    });
    </script>
<?php } ?>

如果你想看看你的模态看起来怎么样，请点击这个链接http://codebins.com/bin/4ldqp8p

是否已解决？如果没有，这里是我的解决方案。

重定向到类似的事情（注意#run_modal）：

`forms/jobSeeker/formLoginJobSeeker.php?err=YOUR_MESSAGE#run_modal`

和JS:

function detectModalParam()
{
    var hash = $(location).attr('hash');
    if (hash == '#run_modal')
    {
        YOUT_MODAL_FUNCTION();
    };
}
$(document).ready(function()
{
    detectModalParam();
}