Ajaxовая форма логина и запоминание пароля
2. по клику аджаксом подгружается форма логина
3. обработка ее опятьже происходит по адажксу.
4.при успехе, либо document.location.reload(true) либо даже сабмитил форму(обьясню ниже)
Браузер вызывать диалог сохранения пароля отказывается.
Что сделал. в качестве акшена, урл на скрипт который, просто делает редирект, соответсвеннно после того как аджаксовый выхлоп сказал, что все ок, юзер залогинен, я делал сабмит формы.
Результат - ФФ предложил сохранить пароль, но при следуйщем вызове формы логина - поля не заполнены. Хром, даже не сохранял пароль..
Мож кто сталкивался. как решить задачу?
Это такой извращенный вариант галочки "запомнить меня" в случае если, человек не должен сразу "Входить" в систему, а только после нажатии кнопки Х, но и не хочется его заставлять вводить каждый раз пароль.
Беда подгружаемой по AJAX формы в том, что на ее input'е не висит слушателей (они же вешаются при формировании DOM страницы), поэтому я предлагаю силами разметки или программно (силами JS) вставлять в документ форму с таким же action и именами полей логина и пароля, а при подгрузке по AJAX формы изымать эти поля из DOM (заранее вставленные, с висящими на одном из них слушателями) и подменять ими соответствующие поля в подгруженной форме. Таким образом получаем работающую подстановку паролей, но есть всякие нюансы в зависимости от браузера.
FF. С FF все обстоит наилучшим образом. FF позволяет добавить форму, на которую будут вешаться слушатели, как методами DOM, так и с помощью "document.write". Так же замечательно дела у FF обстоят и с отправкой - залогиниванием FF считает и непосредственную отправку подгруженной формы (кликом по submit и т. п.), и ее программную отправку и AJAX отправку (по крайней мере ту, что предоставляет JQuery без доп. плагинов). Причем работает это все аж с 3 версии FF (более ранней у меня под рукой не было).
Chrome. Этот друг ведет себя несколько хуже. Он как минимум не пытается запомнить пароль, если не было отправки формы (непосредственной или программной). Возможно, ему еще что-то не нравится, но я вокруг него с бубном особо не плясал. В итоговом варианте он работает и это хорошо. :)
Opera. То же замечание, что и для Хрома - нужна отправка формы. Работае как минимум начиная с 9.01 версии.
IE. Ну, IE не может не выделиться. Ожидаемо, что у него особые претензии, выражающиеся в необходимости отправлять форму непосредственно (т. е. не препятствовать дефолтнуму поведению кнопки отправки формы возвращением false из onclick). Я поначалу подумал, что он еще и не цепляет слушателей (или как у него это там реализовано) к элементам формы, добавленным через DOM, а не через "document.write()", но ошибся. По крайней мере 8ая версия на это не жалуется. Все правильно подумал, действительно, не цепляет IE менеджер паролей к полям формы, добавляемым через DOM. Поэтому для работы подстановки/запоминания паролей еще и в нем цепляю скрипт извне с "document.write()"ами. :o
файл bz.html:
<head>
<script type="text/javascript" src="./js/jquery-1.6.4.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('button').click(function(){
$.ajax({
type: "POST",
url: "/bz2.html"
}).success(function( data ) {
var $bz = $('#z input[name="log"]').detach().css('background-color','red');
var $bz2 = $('#z input[name="pwd"]').detach().css('background-color','red');
$('#z').empty();
$('#z').html(data);
$('#z input[name="log"]').replaceWith($bz);
$('#z input[name="pwd"]').replaceWith($bz2);
});
});
});
</script>
</head>
<body>
<button>Load!</button>
<div id="z">
<form action="" id="k">
<!-- лучший вариант, иметь форму прямо в разметке
<input type="text" name="log" value="" />
<input type="password" name="pwd" id="pwd" value="" />-->
<script type="text/javascript">
$('#k').append('<script type="text/javascript" src="./bz.js"></'+'script>');
/*$(document).ready(function(){return; по окончание разбора документа
брыкаться уже поздно - ни один браузер не подтянул менеджер паролей
к вставленной таким образом форме */
/* Такое работает, но не в IE. IE, почему-то цепляетяет менеджер паролей
только к результатам document.write(); ВРУ, как минимум 8ой цепляет;
Нет, Не вру ^_^
$('#z form')
.append('<input type="text" name="log" value="" />')
.append('<input type="password" name="pwd" id="pwd" value="" />');
//});*/
</script>
<input type="submit" value="submit!" />
</form>
</div>
</body>
</html>
файл bz2.html
<input type="text" name="log" value="" />
<input type="password" name="pwd" id="pwd" value="" />
<!-- не возвращаем false из onclick, т. к. IE в этом случае
не запомнит пароль, даже если потом форму отправить программно -->
<input type="submit" value="submit!" onclick="doBz(this.form);" />
</form>
<script type="text/javascript">
function doBz(form)
{
var data = {};
data.log = $('[name="log"]', form).val();
data.pwd = $('[name="pwd"]', form).val();
$.ajax({
type: "POST",
url: "/",
data: data
}); /* хром требует отправки формы как непосредственно или программно, а ajax
не цепляет .done(function(){ form.submit(); }); */
}
</script>
файл bz.js
document.write('<input type="password" name="pwd" id="pwd" value="" />');
Я, правда, не совсем понял, в чем проблема. Может результат изысканий все равно
не подходит. Короче, требую более внятное пояснение сути проблемы и имеющихся
ограничений. :)
Форма подгружается через AJAX именно для того, чтобы подгрузить ее динамически. К примеру в Диалоговое окно. Другими словами: хрен знает, кто, когда, зачем и при каких обстоятельствах эту форму подгрузит, а самое главное: с какой именно статической страницы. Вставлять "спрятанные" боксы с логином и паролем в каждую статическую страницу сайта, назвать кроме как "ненужным излишеством", ничего на ум не приходит. Но главный вопрос: Насколько цель оправдывает средства? Говоря по русски: стоит ли это такого геморра?
Edit: Уточну, в моем случае подгрузки формы по аяксу. К примеру на том же feedbackme.org. Как обстоят дела у Вульфа я конечно не знаю.
Можно еще параллельно с подгрузкой проблемной формы по AJAX подгружать (добавлять в DOM) iframe, который, в свою очередь, будет подгружать почти пустую html страницу с одной только dummy-формой и двумя (тремя для смены пароля) полями. К ним подцепится менеджер паролей, и можно будет извлечь их из дерева iframe'а и вставить к себе в AJAX форму. Фишка iframe в том, что для него формируется DOM дерево, а на этой операции и вешаются слушатели, в отличие от случая сборки формы из сырья, выбранного по AJAX в виде json и т. п.
---
Вообще, самая главная затыка тут - это то, что кроме FF, видимо, никто не умеет без отправки формы пароли подхватывать. Но Вульф упоминал, что он сабмитил форму, использовал редиректы, т. е. для него это, как я понял, не критично. А откуда берется форма логина у тебя, я не понял (статичная или собирается скриптом?).
А вот это кстати мысль очень и очень здравая... Раскладываю по полочкам:
1. Подгружается скрытый ифрайм с паролями
2. Подгружается "реальная" Аях форма
3. Вводя пароли в Аях форму, они так же вводятся в ифрайм форму. Просто мы это не видим
3. Субмит "Аях" формы на самом деле жестко субмитит ифрайм... по всем стандартам, без излишеств.. Другими словами субмит идет на реальный обработчик без аях заморочек. (тем самым мы симулируем Аях)
4. Как факт браузер это воспринимает как вполне нормальный субмит формы и предлагает запомнить пароль
5. В след раз пароль введется в Аях форму. .В теории, а на практике браузера вроде как не вводят пароли в то, что "скрыто от глаз".. Но проверить можно
А зачем? +) Единственное, что в голову приходит: воровать пароли =)
Edit... А сори.. тупанул.. Не правильно понял твое предыдущей пост. Теперь все ясно.