Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 21.03.2016, 13:14
Аспирант
Отправить личное сообщение для yintar Посмотреть профиль Найти все сообщения от yintar
 
Регистрация: 04.08.2014
Сообщений: 42

отправка формы ajax
Всем доброго дня!
1. Есть обычная форма.
<form id="formx"  enctype="multipart/form-data"  method="post">                   
                        <input type="text" name="name" class="frm-el-control" placeholder="Введите Ваше Имя" title="Имя" maxlength="50" >
                        <input type="email" name="email" class="frm-el-control" placeholder="Введите e-mail" title="Email" pattern="[^@]+@[^@]+\.[a-zA-Z]{2,6}" maxlength="50" >
                        <input type="tel" name="phone" class="frm-el-control" placeholder="Введите телефон" title="Номер телефона" pattern="(\+?\d[- .()]*){7,18}" maxlength="18" >                     
                        <textarea class="frm-el-control" value="" name="message" placeholder="Введите Ваше сообщение"></textarea>
                        <input type="file" name="avatar" id="file" >   
                        <input class="btn" value="Отправить"   type="submit"/>                       
                    </form>


Эту форму отправляю на сервер ajax-ом
2.
<script type="text/javascript">
            $(function() {
                $('#formx').submit(function(e) {
               e.preventDefault();
                    var msg = $('#formx').serialize();   
                    alert(msg);
                        $.ajax({
                            type: 'POST',
                            url: 'addClients.php',
                            data: msg,
                            success: function(data) {
                                var obj = $.parseJSON(data);
                                $('#table').append(
                                        '<div class="row">'
                                        + '<span class="cell">' + obj.FIO + '</span>'
                                        + '<span class="cell">' + obj.phone + '</span>'
                                        + '<span class="cell">' + obj.email + '</span>'
                                        + '<span class="cell">' + obj.avatar + '</span>'
                                        + '<span class="cell">' + obj.message + '</span>'
                                        + '</div>');
                            },
                            error: function(xhr, str) {
                                alert('Возникла ошибка: ' + xhr.responseCode);
                            }
                        });
                });
            });
        </script>


3 Далее на сервере сохраняю значения отправленных полей в БД (скрипт addClient.php) и вывожу в таблицу
$host = 'localhost';
$database = 'tz_clients_list';
$user = 'root';
$pswd = '';

$FIO = $_POST['name'];
$phone = $_POST['phone'];
$email = $_POST['email'];
$message = $_POST['message'];

$uploaddir = 'uploads/';
$uploadfile = $uploaddir .($_FILES['avatar']['name']);
if (copy($_FILES['avatar']['tmp_name'], $uploadfile)) {
    echo "<h3>Файл успешно загружен на сервер</h3>";
} else {
    echo "<h3>Ошибка! Не удалось загрузить файл на сервер!</h3>";
    exit;
}

$dbh = mysql_connect($host, $user, $pswd) or die("Не могу соединиться с MySQL.");
mysql_select_db($database) or die("Не могу подключиться к базе.");
$query = "INSERT INTO `clients` SET 
    `FIO` = '" . mysql_real_escape_string($FIO) . "',
    `phone` = '" . mysql_real_escape_string($phone) . "',    
    `email` = '" . mysql_real_escape_string($email) . "',
    `message` = '" . mysql_real_escape_string($message) . "',
    `avatar` = '" . mysql_real_escape_string($avatar) . "'";

mysql_query($query);


$query1 = "SELECT * FROM `clients` ORDER BY id DESC LIMIT 1";//вывод последне добавленной записи
$res = mysql_query($query1);
$json = [];

while ($row = mysql_fetch_array($res)) {
    $json = [
        'FIO' => $row['FIO'],
        'phone' => $row['phone'],
        'email' => $row['email'],
        'аватар' => $row['avatar'],
        'message' => $row['message']
    ];
}
echo json_encode($json);эти данные вставляются в таблицу над формой


Проблема в том что не получается загрузить файл на сервер и сохранить в бд путь и название файла.Я думал ,что при отправке формы в этой строчке кода
[/code] var msg = $('#formx').serialize(); [code] в переменную msg считываются параметры из поля выбора файла(также как они считываются из остальных полей) ,но этого не происходит и соответственно на сервер файл не загружается.Помогите ,пожалуйста,разобраться где я делаю не так ?
Ответить с цитированием
  #2 (permalink)  
Старый 21.03.2016, 14:48
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 27.11.2015
Сообщений: 2,899

yintar,
Посмотрите это:
Ajax и отправка файлов с формы
Ответить с цитированием
  #3 (permalink)  
Старый 21.03.2016, 14:51
Аватар для DynkanMaclaud
Профессор
Отправить личное сообщение для DynkanMaclaud Посмотреть профиль Найти все сообщения от DynkanMaclaud
 
Регистрация: 08.08.2014
Сообщений: 261

yintar,
через serialize(), файлы не передашь, используй
var formData = new FormData($('form')[0]);
Ответить с цитированием
  #4 (permalink)  
Старый 21.03.2016, 20:38
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

var obj = $.parseJSON(data);
$('#table').append
('<div class="row"> ...

А далее

echo "<h3>Файл успешно загружен на сервер</h3>";
echo "<h3>Ошибка! Не удалось загрузить файл на сервер!</h3>";
or die("Не могу соединиться с MySQL.");
or die("Не могу подключиться к базе.");

И чего ожидать?
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Ajax и отправка файлов с формы miker059 jQuery 5 10.01.2018 03:12
Отправка данных формы. Как выглядит структура метода с AJAX (по JQuery)? Coriolan161 AJAX и COMET 5 24.11.2015 20:17
Отправка Ajax комментов блокирует все формы arimanecro AJAX и COMET 9 07.11.2014 17:32
Ajax отправка формы без перезагрузки страници Slava-web AJAX и COMET 10 27.02.2014 18:14
Отправка формы по ENTER (ajax) и перенос строки VEGA jQuery 18 01.03.2013 14:09