Как заполнить данные одной формы в другой форме на той же странице, прежде чем нажать кнопку «Отправить» с помощью ajax или js?

Question

Я новичок в ajax и javascript. Я хочу заполнить данные формы ввода в другой форме на той же странице, прежде чем она будет отправлена.

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

Пожалуйста, кто-нибудь опубликует несколько примеров.

Answer 1

(в ответ на ваш комментарий на вопрос выше ...)

Ах, этот пример значительно сложнее, чем предполагалось ранее. Цель в этом примере - это не форма, а изображение. У вас уже есть функциональность в коде на стороне сервера для генерации изображения?

В этом случае отправка AJAX на сервер очень проста. Например, используя jQuery , вы можете сделать что-то вроде this :

$.ajax({
  type: 'POST',
  url: 'somepage.php',
  data: data,
  success: function() {
    alert('success!');
  },
  dataType: 'json'
});

Переменная 'data' будет построена из ваших элементов формы. Возможно что-то вроде этого:

var data = '';
data = data + 'somevalue=' + $('#formElement').val();
data = data + 'anothervalue=' + $('#aDifferentElement').val();
// etc.

Что в сущности делает код, это отправляет HTTP-запрос POST по указанному URL-адресу с предоставленными данными, а затем запускает предоставленную функцию «success» после успешного результата. Вы также можете добавить функцию «error» для результата ошибки.

В вашем случае результат выглядит как изображение. Таким образом, в конечном итоге вы установите атрибут src для тега img для получающегося изображения. Примерно так:

$('#imageElement').attr('src', someString);

Я не уверен, как именно они это делают в этом примере, но вы, конечно, можете просмотреть код и просмотреть его в Firebug, чтобы увидеть, что вы можете найти. Ответом является действительное изображение, а не ссылка на изображение. Но вы можете создать свой в любом случае.