Ajax的登录表单 - 浏览器不会保存密码 [英] Ajax login form - browsers won't save password

问题描述

我有阿贾克斯登录表单，它检查给定的凭据是否正确，并重定向到另一个页面。登录表单本身是由一个HXR呼叫建立 - 它不是建在登录页面code

现在的问题是，我不能让浏览器提示记忆密码。一旦我得到了Firefox的提示，但因为形式是由XHR呼叫建立，火狐并没有将值粘贴到表单中。

PS。我使用的mootools（Form.send）和往常一样window.location的时候登录成功。 PSS。登录页面的地址总是相同。

下面code装入一个元素（我用MochaUI）内XHR： JavaScript的：

  $（'loginwindow_form）。组（发送，{
    URL：认证/ ajax_login
    方法：后，
    onRequest：函数（）{
        $（loginWindow_spinner）显示（）。
    }，
    的onComplete：函数（响应）{
        $（loginWindow_spinner）隐藏（）。
    }，
    的onSuccess：功能（responseText的，responseXML的）{
        了window.location =appinit;
    }，
    onFailure：功能（XHR）{
        MUI.notification（'onFailure'）;
    }
}）;

$（loginwindow_form）。的addEvent（提交，功能（五）{
    E！|| e.stop（）;
    $（'loginwindow_form'）发送（）。
}）;  

XHTML（可注意到该窗体没有提交按钮 - 该按钮在其他地方并拥有的onclick行动派给定ID的形式）：

 ＆LT; IFRAME SRC =认证/空白ID =blankiframeNAME =blankiframe的风格=显示：无＆GT;＆LT; / IFRAME＆GT;
＆LT;形式的行动=appinit方法=邮报名称=loginwindow_formID =loginwindow_form级=standardform目标=blankiframe＆GT;
    ＆LT;输入类型=文本名称=电子邮件级=输入文本ID =loginwindow_form_email/＆GT;
    ＆LT;输入类型=密码NAME =密码级=输入文本密码ID =loginwindow_form_loginwindow_form_password/＆GT;
＆LT; /形式GT;
 

发送按钮（在另一个XHR加载，元素）：

 ＆LT;按钮类=按钮行动={sendForm：loginwindow_form'}＆GT;
    ＆LT; D​​IV CLASS =接受＆GT;登录＆LT; / DIV＆GT;
＆LT; /按钮＆GT;
 

解决方案

我电子书籍，你使用传统的透过形式，但提交到一个隐藏的iframe。 （或者登录表单本身可能是一个iframe）。这样，你仍然可以发送回JS响应将被执行的iframe和浏览器就会知道，这是一个登录表单。

I have Ajax login form, which is checking whether given credentials are correct and redirects to another page. The login form itself is built by a HXR call - it isn't built in the login page code.

The problem is that I can't get browsers to prompt for remembering passwords. Once I've got the Firefox to prompt but since the form is being built by XHR call, the Firefox didn't paste the values into the form.

PS. I am using mootools (Form.send) and usual window.location when login was successful. PSS. The address of the login page is always the same.

The following code is loaded by a XHR within a element (I am using MochaUI): JavaScript:

$('loginwindow_form').set('send', {
    "url": "auth/ajax_login",
    "method": "post",
    "onRequest": function () {
        $("loginWindow_spinner").show();
    },
    "onComplete": function (response) {
        $("loginWindow_spinner").hide();
    },
    "onSuccess": function (responseText, responseXML) {
        window.location = "appinit";
    },
    "onFailure": function (xhr) {
        MUI.notification('onFailure');
    }
});

$("loginwindow_form").addEvent("submit", function (e) {
    !e || e.stop();
    $('loginwindow_form').send();
});

xHTML (notice that the form does not have submit button - the button is elsewhere and has onclick action to send the form with given ID):

<iframe src="auth/blank" id="blankiframe" name="blankiframe" style="display:none"></iframe>
<form action="appinit" method="post" name="loginwindow_form" id="loginwindow_form" class="standardform" target="blankiframe">
    <input type="text" name="email" class="input text" id="loginwindow_form_email" />
    <input type="password" name="password" class="input text password" id="loginwindow_form_loginwindow_form_password" />
</form>

The sending button (in another, xhr loaded, element):

<button class="button" action="{sendForm: 'loginwindow_form'}">
    <div class="accept">Login</div>
</button>

解决方案

I recomment that you use a traditional sumbit form, but submit into a hidden iframe. (Or the login form itself could be in an iframe). This way you can still send back JS responses to the iframe which will be executed, and the browsers will know that it was a login form.

这篇关于Ajax的登录表单 - 浏览器不会保存密码的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！