繁体   English   中英

Zend Fancybox登录无法正常工作

[英]Zend fancybox login doesn't work properly

我正在使用zend和fancybox作为弹出式登录表单,但是它工作正常,问题出在我登录时。 它会重新加载fancybox,而不是当前的父页面。 因此,当我登录时,它实际上位于显示用户页面的登录表单框中。 因此,我想在提交时按它与父页面而不是fancybox一起登录。

这是我的代码:

javascript fancybox:

$('a.iframe').fancybox({
        width   : 520, 
        height  : 300,
        type    : 'iframe',
        scrolling: 'no',
        centerOnScroll: 'true',
        onComplete: function() {
            $('#fancybox-frame').load(function() {
                $('#fancybox-content').height($(this).contents().find('body').height() + 0);
            });
        }
});

zend控制器:

public function loginFormAction()
{
    $this->_helper->layout()->disableLayout();
    //$this->_helper->viewRenderer->setNoRender(true);

    $email = $this->getRequest()->getParam('email');
    $password = $this->getRequest()->getParam('password');

    $loginForm = new Application_Form_UserLogin();
    if ($this->getRequest()->isPost())
    {
        /************ Login Form ************/
        if ($loginForm->isValid($this->getRequest()->getParams()))
        {
            $user = $this->_helper->model('Users')->createRow($loginForm->getValues()); 
            $user = $this->_helper->model('Users')->fetchRowByFields(array('email' => $email, 'hash' => $password));

            if($user) 
            {
                Zend_Session::rememberMe(86400 * 14);
                Zend_Auth::getInstance()->getStorage()->write($user);
                $this->getHelper('redirector')->gotoRoute(array(), 'invite');
                return;
            } 
            else {
                // Error message
                $this->view->errorMsg = "<b>password</b> - invalid, please try again! *";
            }               
        }
        else
        {
            // something
        }
    }
    $this->view->loginForm = $loginForm;
}

html形式:

<body>  
    <div id="login" class="">
        <div id="login_lb_content">
            <h1 class="content_title colorset_orange">Login to your account</h1>
            <form action="" method="post" name="loginForm" id="login-form">
                <table><tr>
                    <td colspan="2" class="content_sub_title colorset_gray">Your email address</td>
                </tr><tr>
                    <td colspan="2"><input id="email" type="text" name="email" value="<?php echo $this->loginForm->email->getValue(); ?>" /></td>
                </tr><tr>
                    <td width="120" class="content_sub_title colorset_gray">Your password</td>
                    <td style="text-align:right;" class="colorset_gray small_font">(It was sent to your email address when you registered)</td>
                </tr><tr>
                    <td colspan="2"><input id="password" type="password" name="password" value="<?php echo $this->loginForm->password->getValue(); ?>" /></td>
                </tr><tr>                       
                    <td><a id="inline-retreive" href="#retreive" class="content_sub_title colorset_orange fblink">Retreive my password</a></td>
                    <td><input type="submit" id="btn_login" name="login" value="" /></td>
                </tr></table>

                <div id="login-error" style="color:red">
                <?php if ($this->loginForm->getErrors()): ?>
                    <?php foreach($this->loginForm->getMessages() as $field => $messages): ?>
                        <strong><?php echo $field; ?></strong>
                        <?php foreach($messages as $messageKey => $message): ?>
                            - <?php echo $message; ?><br />
                        <?php endforeach; ?>
                    <?php endforeach; ?>
                <?php endif; ?>
                <?php echo $this->errorMsg; ?><br />
                </div>

            </form>
        </div>
    </div><!-- END div[login panel] -->

实际上,它确实可以正常工作。 它在fancybox内刷新,因为它是一个iframe ,就像将表单嵌入iframe标签一样(仅会重新加载iframe,而不是父页面)

您将需要使用方法parent.$.fancybox.close(); 在成功提交表单后在表单中调用....或者您可以在表单标签中使用onsubmit

<form onsubmit="parent.$.fancybox.close();" ... 

...然后,在您的自定义脚本中添加以下选项:

"onClosed": function(){
  parent.location.reload(true);
}

刷新父页面。

注意 :我假设您正在使用fancybox v1.3.4,因为上面代码中的API选项。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM