Как отправить данные на сервер с изображением?

0

Я создаю форму, которая захватывает данные пользователя и изображение профиля, я программирую это в jquery ui (модальная форма) и отправляя jquery ajax post, на стороне сервера (PHP5.2) нужно получить значение переменной $ _File и другие значения имени пользователя, электронной почты, пароля, хорошо, моя проблема заключается в доставке данных и изображений. Надеюсь, вы поняли меня, и я могу помочь

Код HTML

<div id="dialog-form" title="Create new user">
                <p class="validateTips">
                    All form fields are required.</p>
                <form id="formulario">
                    <fieldset>
                        <label for="name">
                            Name</label>
                        <input type="text" name="name" id="name" class="text ui-widget-content ui-corner-all" />
                        <label for="email">
                            Email</label>
                        <input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" />
                        <label for="password">
                            Password</label>
                        <input type="password" name="password" id="password" value="" class="text ui-widget-content ui-corner-all" />

                    </fieldset>
                    <div id="content-image-user">
                        <div id="imageuser"></div>
                    </div>
                    <div class="ui-widget"><label for="photo">Photo: </label><input type="file" name="photo" class="ui-autocomplete-input ui-widget-content ui-corner-all"></div>
                </form>
            </div>

CODE JS

$("#dialog-form").dialog({
    autoOpen: false,
    height: 620,
    width: 480,
    modal: true,
    buttons: {
        "Create an account": function() {
            //allFields.removeClass("ui-state-error");
            var info = $("#formulario").serialize();//
            //Here!!
            // How data gathering more data in the image?
            console.log(info);
            $.post("AddUser.php", info, function(data) {
                console.log(data);
                $('#grid-data').load("GridData.php", function() {
                    //console.log('load data OK');
                });
            });
            $(this).dialog("close");
        },
        Cancel: function() {
            $(this).dialog("close");
        }
    },
    close: function() {
        //allFields.val("").removeClass("ui-state-error");
    }
});

приветствует благодарность MauricioHz Сантьяго, Чили

  • 0
    Ajax не может загружать файлы. Стандартный обходной путь - клонировать вашу форму в скрытый iframe и выполнить там обычную POSt-загрузку: php.net/manual/en/features.file-upload.post-method.php
  • 0
    Вы не можете загружать файлы через AJAX. Вам нужно использовать iFrame, Flash или xmlhttprequest2
Показать ещё 2 комментария
Теги:

3 ответа

-1
Лучший ответ

Я мог бы получить хороший результат с помощью jQuery form pluggins, http://hayageek.com/ajax-file-upload-jquery/

1

Пытаться

var info = new FormData($("#formulario")[0]); 
$.ajax({
  url: "AddUser.php",
  data: info,
  processData: false,
  contentType: false,
  type: "POST",
  success: function(data) {
      console.log(data);
      $('#grid-data').load("GridData.php", function() {
      //console.log('load data OK');
      });
  }
});
-2

Грустно сказать вам, что Ajax не может загрузить файл, поскольку javascript не может обрабатывать локальный файл.

обычно есть 3 способа.

1.base64encode содержимое изображения, то вы получите base64encoded строку. отправьте строку на сервер. сервер получает содержимое изображения, декодируя строку

  1. используйте флеш-загрузку файла. js и flash взаимодействуют для реализации загрузки файлов.

  2. использовать iframe. javascript обрабатывает динамический html dom, запускает событие отправки, затем вы можете получить отключенный поток.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню