Ajax: как передать данные формы и учетные данные при отправке?

#javascript #php #jquery #ajax #form-data

#javascript #php #jquery #ajax #форма-данные

Вопрос:

Основная проблема: — Ajax: как передать данные формы и учетные данные при отправке?

У меня есть приведенная ниже функция, которая вызывается, когда пользователь нажимает на кнопку отправки:

 <script type="text/javascript">
function submitForm() {
    console.log("submit event");
    var fd = new FormData(document.getElementById("campaign_form"));
    console.log(fd);
    var username = $('#username').val();
    console.log(username);
    var password = $('#password').val();
    console.log(password);
    $.ajax({
        type: "POST",
        url: "http://localhost/testing/post_campaigns.php",
        data: fd,
        data: {
            "username": $('#username').val(), 
            "password": $('#password').val()
        },
    });
    return false;
}
</script>
  

Мой php URL вызывается правильно, но я не вижу, что мои данные переданы.

Например, я обычно ожидаю увидеть в инструментах разработчика:

 http://localhost/testing/post_campaigns.php?username=XXXamp;password=YYY
  

Но я вижу только:

 http://localhost/testing/post_campaigns.php
  

Мои переменные записываются в консоль правильно, поэтому я знаю, что они существуют и имеют значения.

Я уверен, что проблема связана с моим синтаксисом; но я не уверен, как правильно отформатировать мой Ajax для размещения как объектных FormData, так и строковых переменных username / password .

По сути, мой общий код запрашивает у пользователя заполненный им лист с определенными значениями в определенных заголовках столбцов, я считываю эту информацию и ОТПРАВЛЯЮ ее на наш сервер ad. Поэтому мне нужно, чтобы и данные формы, и имя пользователя / пароль, предоставленные пользователем, передавались в мой PHP-файл, когда я выполняю POST-запрос на наш сервер ad с информацией / изменениями, запрошенными пользователем.

Если мой вопрос / дилемма неясны или вам нужно больше кода, пожалуйста, дайте мне знать.

Спасибо,

Редактировать: прикрепление скриншота FormData в консоли для каждого запроса. введите описание изображения здесь

Комментарии:

1. что вы получаете fd ?

2. Кажется, он возвращает объект с парами ключ-значение, представляющими какие-то данные, связанные с файлом, который пользователь выбрал локально.

Ответ №1:

Код jQuery / AJAX: — Для совместной отправки formdata с другой переменной javascript.

 <script>
    $('#btn').on("click", function () {
            var formData = new FormData($("#form1")[0]);
            formData.append('ipid',id); //id is the variable that has the data that I need
            var path = "http://localhost/testing/post_campaigns.php",
            $.ajax({
                url: path,
                type: "POST",
                data: formData,
                contentType: false,
                processData: false,
                success: function (stuff) {
                    $("#resp").html(stuff);
                }
            });
        });
    });
</script>
  

Примечание:-
Чтобы добавить параметр, просто используйте append() метод:

 formData.append("param", "value");
  

И на стороне php я это улавливаю:

  echo   $pid = ($_POST['ipid']);
  

Примечание: — Для получения дополнительной информации об этом проверьте это

https://developer.mozilla.org/en-US/docs/Web/API/FormData/append