Как сохранить информацию автозаполнения (локально) для формы без перенаправления/обновления страницы

У меня есть форма, которую я отправляю через ajax с jQuery, это часть системы, которая заменит существующую, но есть проблема с функциональностью, с которой я сталкиваюсь. В текущей системе пользователи заполняют всю информацию формы и отправляют, обычно это кнопка отправки формы, я заметил, что в этих случаях информация автозаполнения для элементов формы с тем же именем будет сохранена локально в браузере (в этом случае большинство пользователей будут использовать Google Chrome), однако при попытке отправить данные формы через ajax ничего не будет сохранено. Пользователи иногда будут вводить повторяющуюся информацию (но не в том смысле, что было бы неплохо иметь список на сервере для использования автозаполнения jQuery). Мой код при нажатии кнопки отправки (вместо обычной отправки) в настоящее время выглядит примерно так:

jQuery("<submit button>").click(function() {
    <form validation and other stuff>
    jQuery.ajax({
        type: 'POST',
        url: '<some perl script>',
        data: '<form data>',
        success: function(data) {
            if(<expected response from server>){
                if(<certain input on the form has a specific value>){
                    <do something>
                }
            } else {
                <do something else>
            }
    });
})

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

В основном я хочу иметь возможность сохранять информацию для каждого поля формы для будущего использования с помощью автозаполнения браузера, но я не смог это сделать с помощью ajax. Я думаю, что есть что-то, что работает только для Internet Explorer, называется window.external.AutoCompleteSaveForm, но я не уверен (в любом случае, вся эта система не будет использоваться с проводником).

ПРИМЕЧАНИЕ. Я хочу сохранить предыдущие введенные значения в автозаполнении/предложениях или как вы хотите это назвать, поэтому, скажем, пользователь отправляет значение «Что-то» для ввода «имя», я хочу, чтобы пользователи могли писать буква «S» и автозаполнение браузера для отображения списка ранее введенных значений (по умолчанию ничего конкретного не отображается), включая «Что-то», которое было введено при предыдущей отправке (и другие совпадающие, такие как «Что-то еще», «Что-то неправильно" и др.). Для того, что я тестировал до сих пор, «отправка» формы с помощью ajax (и возврат false, чтобы избежать перезагрузки страницы) не сохранит предыдущую отправленную информацию для будущего использования автозаполнения (по крайней мере, в Chrome, который является браузером что меня волнует).


person DarkAjax    schedule 02.02.2012    source источник
comment
Я немного запутался в вопросе: вы хотите отправить форму через AJAX, и на самом деле она отправляет всю форму, таким образом направляя страницу на <form action="{url}"> ?   -  person Highway of Life    schedule 02.02.2012
comment
Извините за путаницу, я делаю что-то вроде ‹form action=javascript:void(0)› и фактически отправляю форму исключительно с помощью ajax.   -  person DarkAjax    schedule 02.02.2012
comment
Вопрос очень неясен, вы на самом деле не упоминаете, что это такое. :-/   -  person Highway of Life    schedule 02.02.2012
comment
Ваш вопрос мне не ясен, я не понял, что вы хотите сделать, наконец.   -  person Omid    schedule 02.02.2012
comment
Пожалуйста, укажите, что вы хотите сохранить введенные значения или возвращенные предложения?   -  person Omid    schedule 02.02.2012
comment
@darkajax, поскольку вы новичок в stackoverflow, вот несколько советов, которые вам помогут: Задавая вопросы, старайтесь быть максимально ясным и кратким. Чтобы получить хороший ответ, нужно правильно задать хороший вопрос. Дело не в том, чтобы предоставить как можно больше деталей, а в том, чтобы сделать вопрос максимально простым и ясным. Так, например, я бы спросил: Браузер не сохраняет данные формы при отправке формы AJAX, как я могу использовать форму AJAX и заставить браузер сохранять данные формы при отправке? Это вопрос в одну строку. Добро пожаловать в Stackoverflow!   -  person Highway of Life    schedule 02.02.2012


Ответы (3)


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

Я думаю, что большинство современных браузеров поддерживают автозаполнение при создании XHR, возможно, я ошибаюсь. В любом случае вы можете отправить данные через iframe и заставить браузер поверить, что страница изменилась.

person SoWhat    schedule 02.02.2012

Если вы хотите перехватить отправку формы, лучше сделать это с помощью jQuery.submit, а не "щелкнуть ". Чтобы предотвратить фактическую отправку формы (поскольку вместо этого это будет делать ваш AJAX), вы должны использовать return false

Пример:

jQuery('#form').submit(function() {
    // <form validation and other stuff>
    var $form_data = jQuery(this).serialize();
    jQuery.ajax({
        type: 'POST',
        url: '<some perl script>',
        data: $form_data,
        success: function(data) {
            if(<expected response from server>){
                if(<certain input on the form has a specific value>){
                    <do something>
                }
            } else {
                <do something else>
            }
    });

    return false;
})
person Highway of Life    schedule 02.02.2012
comment
Это хорошая идея, однако проблема остается: при отправке формы таким образом информация не сохраняется в автозаполнении браузера для использования в будущем... - person DarkAjax; 02.02.2012
comment
Ты пробовал это? -- Каждый браузер будет отличаться в том, как это обрабатывается. Некоторые сохранят данные формы, а другие нет. Единственный известный мне способ - обмануть браузер, заставив его поверить, что он отправил настоящую форму, используя iframe (даже скрытый) с данными формы в нем. Но это плохой поступок, это противоречит правилам Человечества. Но вы действительно должны проверить это и посмотреть, сохранит ли браузер данные формы. (Убедитесь, что он включен в вашем браузере) - person Highway of Life; 02.02.2012
comment
Да, я пробовал, это не сработало в Chrome (это тот, на котором мне нужно, чтобы он работал), если я остановлю перезагрузку с возвратом false; - person DarkAjax; 02.02.2012

[править] Да, Карумба, это совсем не ясно!

Хорошо, если вы действительно отправляете через ajax, форма на самом деле не должна исчезать, поэтому не нужно ничего сохранять. Без кода формы невозможно увидеть, что именно происходит. Однако, если у вас есть кнопка или элемент отправки формы внутри тегов <form>, форма делает то, что по умолчанию используется в HTML....отправляет форму в действие формы. Это приведет к очистке формы и, вероятно, к полному обходу вашего действия ajax.

Добавьте event.preventDefault в функцию щелчка. Смотрите что происходит.....

jQuery("<submit button>").click(function(event) {
event.preventDefault()
<form validation and other stuff>
jQuery.ajax({
    type: 'POST',
    url: '<some perl script>',
    data: '<form data>',
    success: function(data) {
        if(<expected response from server>){
            if(<certain input on the form has a specific value>){
                <do something>
            }
        } else {
            <do something else>
        }
});

})

Это переопределит функциональные возможности формы по умолчанию, которые заключаются в отправке и очистке формы. Теперь все должно оставаться на месте, без расчистки. Вы можете выборочно очистить элементы или оставить их все, как хотите.

Пожалуйста, уточните вопрос!

person bpeterson76    schedule 02.02.2012
comment
Я считаю, что вопрос на самом деле обратный: как заставить браузер сохранять данные формы, отправленные через AJAX. - person Highway of Life; 02.02.2012
comment
правильно, я хочу, чтобы браузер сохранял данные формы для автозаполнения/предложений, когда пользователь хочет снова написать то же самое в будущем. - person DarkAjax; 02.02.2012