Отправить больше данных, чем только форму (сообщение node.js) - PullRequest
0 голосов
/ 07 марта 2019

Возможно ли, когда кто-то отправляет форму, он отправляет дополнительные вещи, а не только поля ввода? В моем случае это будет имя пользователя.

Ответы [ 2 ]

1 голос
/ 07 марта 2019

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

Логика довольно проста. Вы присоединяете к форме прослушиватель onsubmit. Запретите автоматическую отправку, позвонив на событие preventDefault(). Затем соберите значения из всех полей, выполните проверку (, если электронная почта имеет правильный формат, если совпадают пароли и т. Д. ), добавьте произвольные сопутствующие свойства к объекту и отправьте все это на сервер. через ajax отправьте запрос.

Поскольку вы задаете такой вопрос, я порекомендую вам использовать библиотеку JS, чтобы облегчить задачу, jQuery идеально подходит для такого случая:

$('#myForm').on('submit', function(e) {
  e.preventDefault();

  const $form = $(this); 
  const method = $form.attr('method');
  const action = $form.attr('action')
  const fields = $form.serializeArray();
  
  fields.push({
    name: 'username',
    value: 'myUsername'
  })
  
  const queryStr = $.param(fields);
 
  $[method](action, queryStr)
  .done(function() {
    // submission was successful - do something, refresh page for exmaple
  })
  .fail(function() {
    // submission failed
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<form id="myForm" method="post" action="/handle.php">
  My name is: <input type="text" name="fname" /><br />
  <label for="agree">I agree</label> <input type="checkbox" name="agree" value="1" /><br />
  <button type="submit">Submit</button>
</form>

Конечно, /handle.php - это фальшивая конечная точка, поэтому отправка здесь явно не сработает.

0 голосов
/ 07 марта 2019

Как сказано @jayarjo, вы можете перехватить отправку формы и обработать ее вручную, например, вы можете использовать Ajax следующим образом.

Примечание :;Чтобы использовать Ajax, убедитесь, что вы добавили его скрипт, например

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<script>


  $('#newform').on('submit', function (event) {
    event.preventDefault();
    var data = {
      username: $('#username').val(),
    };

    $.ajax({
      url: '/upload',
      data: data,
      method: 'POST'
    }).then(function (response) {

      $('body').append(response);
    }).catch(function (err) {
      console.error(err);
    });
  });
</script>

Надеюсь, это поможет.

...