автозаполнение / сохраненная форма браузера не работает в запросе ajax

Question

Действительно сложно найти любую комбинацию ключевых слов в поисковой системе по этому поводу, потому что она использовалась самым популярным разработчиком, для которого требовалось пользовательское автозаполнение с помощью ajax.

Большинство разработчиков ищут информацию о пользовательском автозаполнении для получения результата из db по ajax или о том, как отключить автозаполнение браузера из-за соображений безопасности, или они хотят использовать другой расширитель автозаполнения.

Однако я не говорю об автозаполнении. Я обнаружил простое обычное автозаполнение браузера или сохраненную в браузере форму IE или FF, которая будет действовать как выпадающий список при заполнении текста в текстовом поле.

Это простое и нормальное заполнение формы, такой как имя пользователя и пароль, в форме входа в систему. После отправки формы (отправка данных формы) браузер сохранит автозаполнение или событие в FF попросит сохранить вместе с паролем.

Теперь подумайте о входе в систему, представленном через ajax. Данные формы не сохраняются автоматически ни IE, ни FF просто потому, что форма не отправляется почтовым методом. Я почти уверен, что это из-за метода ajax и post.

CMS, такие как DotNetNuke, используя этот способ, и мне очень сложно ввести имя пользователя и пароль для входа в систему для 5 пользователей в целях разработки, событие, которое я хочу позволить пользователю сохранять свои собственные данные формы в браузере без каких-либо пользовательских или расширений. В другом примере пользователь может видеть и использовать один и тот же адрес электронной почты для заполнения любой формы электронной почты на веб-сайте или в домене.

Как обойти это? У вас есть предложение, какие ключевые слова больше подходят для поиска?

CallMeLaNN

Answer 1

У меня такая же проблема. Я смог решить эту проблему для FireFox, добавив скрытый iframe, который я отправляю через JavaScript перед тем, как написать AJAX. Я до сих пор не нашел ничего, что работает в Chrome / IE.

Answer 2

Я столкнулся с той же проблемой и немного искал. Я думаю, что решение ниже является наиболее удобным способом решения этой проблемы, если у вас есть страница входа. Если мы рассмотрим логин, отправленный через ajax, ни один из браузеров не запомнит и не предложит функцию автокомпиляции для поля имени пользователя и пароля, дополнительно попросит запомнить учетные данные. Но если вы используете функцию отправки javascript (возможно, она не совместима со старыми версиями браузеров), все браузеры предлагают сохранить имя пользователя и пароль, кроме IE. Но я нашел другой хитрый JavaScript для IE, который предлагает сохранить имя пользователя и пароль.

На моей странице входа в систему я обработал имя пользователя и пароль и отправил их на сервер с помощью ajax-запроса, и, если вход выполнен успешно, я отправил форму способом, описанным ниже, в противном случае пользователю было показано окно предупреждения что логин не удался.

Пожалуйста, проверьте ссылку ниже:

[РЕДАКТИРОВАТЬ]: ссылка не работает

Существует фиксированная страница об этой проблеме на связанной странице, я не могу дать вам другую ссылку из-за моей репутации. Пожалуйста, ищите цитату ниже на странице:

Посмотрите на фиксированную страницу.

Конечно, этот подход не подходит, если у вас есть раздел для входа на странице по умолчанию из-за отправки формы. Это вызывает мерцание страницы. Интересно, есть ли у кого-нибудь идеи по этому поводу?

Answer 3

Вот некоторый ненавязчивый js-код jQuery, который отправит форму как с помощью ajax (метод $ .post) в реальный серверный скрипт, так и в фиктивный скрипт через iFrame, поэтому браузер сохранит отправленные данные для последующего автозаполнения .

Это прекрасно работает под Chrome. Любые отзывы приветствуются!

var  formframesindex = 0;
function onSubmitAjax(evt){
    var $form = $(this);
    var framesubmitting = $form.hasClass('framesubmitting');
    var action = $form.attr('action');
    var original_action = action;

    if(!framesubmitting){
        $.post(action,$form.serialize()+"&ajax=1", function(responseText,message,request){
            formResponseHandler(responseText);
        }, "json");


        formframesindex++;
        var formframe = $("<iframe name='formframe_id_"+(formframesindex)+"' id='formframe_id_"+(formframesindex)+"' class='formframe' src='/fakeformreceiver.php'></iframe>");
        $('body').append(formframe);
        var target = $form.attr('target');
        $form.data('originaltarget',target);
        $form.data('originalaction',original_action);
        $form.attr('target','formframe_id_'+formframesindex);
        $form.attr('action','/fakeformreceiver.php');
        $form.addClass('framesubmitting');
        $form.submit();

    } else {
        var current_target = $form.attr('target');
        var original_action = $form.data('originalaction');
        var original_target = $form.data('originaltarget');
        var $frame = $('#'+current_target);
        setTimeout(function(){
            if($frame && $frame.length){
                $frame.remove();
            }
            $form.attr('action',original_action);
            $form.attr('target',original_target);
            $form.removeClass('framesubmitting');
        },100);
    }
    return framesubmitting;
}