Question

我正在使用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 controller：

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] -->

Answer 1

实际上，它确实可以正常工作。它会在fancybox中刷新，因为它是iframe，就像在iframe标记中嵌入表单一样（只重新加载iframe而不是父页面）

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

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

...然后，在您的自定义脚本中添加选项：

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

刷新父页面。

注意：我假设您使用的是fancybox v1.3.4，因为上面代码中的API选项。

Zend fancybox登录无法正常工作

1 个答案: