Laravel по-русски

Русское сообщество разработки на PHP-фреймворке Laravel.

Ты не вошёл. Вход тут.

#1 20.10.2017 14:19:54

Ajax-загрузка файлов на сервер

как аяксом сохранять загруженные через форму изображения?
мои пробы пера, которые без аякса работают, с ним - нет:

контроллер:

public function validateForm(Request $request)
    {        
        $this->validate($request, [
            'fio' => 'bail|required|string|max:36',
            'email' => 'email|required',
            'telephone' => 'regex:/^(\+){0,1}[0-9]{10,12}$/|required',
            'attachmentFile' => 'file'  
        ]);
        
        if($request->hasFile('attachmentFile')){
            
                $path_to_attach = '/attachmentFiles/';
                $file = $request->file('attachmentFile');
                $filename = str_random(20) . '.' . $file->getClientOriginalExtension() ?: 'png';
                
                $file->move(public_path().$path_to_attach, $filename);

            
                DB::table('cf_Orders')->insert([
                    'id' => 0,
                    'fio' => $request->fio,
                    'email' => $request->email,    
                    'attachment' => $path_to_attach.$filename
                ]);
              Mail::send('emails.orders', ['user' => $request->fio, 'email' => $request->email, 'telephone' => $request->telephone], function ($m) use ($request, $path_to_attach, $filename) {
                    $m->from('contact@pravoedelo.ua', 'Заявкa');
                    $m->to('away4people@gmail.com')->subject('Заявка о страницы: '.$_SERVER['HTTP_REFERER']);
                    
                    $m->attach(asset($path_to_attach.$filename));
              });
              return 'true';
        }
}

форма:

<div class="col-sm-12 courses_form wow fadeIn" data-wow-duration="2.0s">
    <div class="title">Напишите нам</div>
         <div class="col-sm-8 centered">
             <form id='form' enctype="multipart/form-data" action="/contact/sendMessage" method="post">

               <div class="col-sm-12">
                 <span class="input input--ruri">
	        	     <input name='fio' class="input__field input__field--ruri" type="text" required>
			         <label class="input__label input__label--ruri" >
        			     <span class="input__label-content input__label-content--ruri">ФИО *</span>
		        	 </label>
                  </span>
               </div>

               <div class="col-sm-6">
                 <span class="input input--ruri">
	        	     <input name='email' class="input__field input__field--ruri" type="text" required>
			         <label class="input__label input__label--ruri" >
        			     <span class="input__label-content input__label-content--ruri">Почта *</span>
		        	 </label>
                  </span>
                </div>

               <div class="col-sm-6">
                 <span class="input input--ruri">
	        	     <input name='telephone' class="input__field input__field--ruri" type="text" required>
			         <label class="input__label input__label--ruri" >
        			     <span class="input__label-content input__label-content--ruri">Номер телефона *</span>
		        	 </label>
                  </span>
                </div>

                <div class="col-sm-12">
                 <span class="input input--ruri filled input--filled">
	        	     <input name='attachmentFile' class="input__field input__field--ruri" type="file">
			         <label class="input__label input__label--ruri" >
        			     <span class="input__label-content input__label-content--ruri">Прикрепить файл</span>
		        	 </label>
                  </span>
                </div>

                        {{ csrf_field() }}
                <div class="col-sm-12"><input name='submit' type="submit" value="Отправить"></div>

<div id="openModal" class="modalDialog">
	<div>
		<h2>Сообщение</h2>
		<p>текст</p>
	</div>
</div>
             </form>
         </div>

</div>







      @if ($errors->any())
    <div class="alert alert-danger">
        <ul>
            @foreach ($errors->all() as $error)
                <li>{{ $error }}</li>
            @endforeach
        </ul>
    </div>
@endif
      

скрипт, обрабатывающие клик по сабмиту:

    document.addEventListener('DOMContentLoaded', function(){
    $('#form').on('submit', function(){
       var form = $('#form');
       $.ajax({
          url : form.attr('action'),
          type : "POST",
           contentType: false, // важно - убираем форматирование данных по умолчанию
          processData: false, // важно - убираем преобразование строк по умолчанию
          data : form.serialize(),
          success:function(){
              if(window.location.pathname.indexOf('contact') != -1){
                      $('#openModal > div > h2').html('<h2 style =\'margin-bottom:15%;\'>Спасибо, что доверились нам!</h2>');
                      $('#openModal > div > h2 + p').html('<p style=\'text-align: center;\'>Мы хотим узнать о Вас больше, ожидайте звонка в ближайшее время</p>');
                  }else if(window.location.pathname.indexOf('services-open') != -1){
                      $('#openModal > div > h2').html('<h2 style =\'margin-bottom:15%;\'>Вы успешно отправили заявку!</h2>');
                      $('#openModal > div > h2 + p').html('<p style=\'text-align: center;\'>Мы перезвоним Вам в течение 15 минут чтобы ответить на все вопросы</p>');
                  }else if(window.location.pathname.indexOf('courses-') != -1){
                      $('#openModal > div > h2').html('<h2 style =\'margin-bottom:15%;\'>Теперь Вы гость культурно-образовательного пространства LABS!</h2>');
                      $('#openModal > div > h2 + p').html('<p style=\'text-align: center;\'>Мы перезвоним Вам для уточнения брони. - в мероприятии</p>');
                  }
                  $('#openModal').fadeIn();
              },           
          error:function(errors){
              alert += "<div class='alert alert-danger'><ul>";
                    $.each(errors, function(index, error){
                        alert += "<li> + error + </li>";
                    });
            alert += "</ul></div>";
            $('#append').html(alert);
            console.log( errors);
        }
        });
        return false;
    });
 
});

Не в сети

#2 20.10.2017 14:21:11

Re: Ajax-загрузка файлов на сервер

HZAa5su.png

Не в сети

#3 20.10.2017 14:28:54

Re: Ajax-загрузка файлов на сервер

form.serealize не умеет файлы загружать. Нужно вот так

        $('#you-form').on('submit',
            e => {
                e.preventDefault();
                let formData = new FormData(e.currentTarget);
                $.ajax({
                    url: $thisForm.attr('action'),
                    method: 'post',
                    dataType: 'json',
                    contentType: false,
                    processData: false,
                    data: formData,
                }).done(
                    data => {
                  
                    }
                ).fail(
                    e => {
                    
                    }
                )
            }
        )

Не в сети

#4 20.10.2017 14:30:31

Re: Ajax-загрузка файлов на сервер

+ логи посмотри, у тебя ответ 500 - Internal server error.

Изменено covobo (20.10.2017 14:31:13)

Не в сети

#5 20.10.2017 14:33:44

Re: Ajax-загрузка файлов на сервер

вот товарищ как-то решал с form.serialize - в каком смысле "не умеет"?
https://toster.ru/q/189561

в /storage/logs ничего интересного, а в логах апача всё сухо:
localhost: 127.0.0.1 [20/Oct/2017:14:32:15 +0300] "POST /contact/sendMessage HTTP/1.1" 500 41618 "http://localhost/contact" "Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/61.0.3163.100 Safari/537.36"

Не в сети

#6 20.10.2017 14:36:12

Re: Ajax-загрузка файлов на сервер

За_dd_ш реквест и посмотри в контроллере smile

Не в сети

#7 20.10.2017 14:38:47

Re: Ajax-загрузка файлов на сервер

думал так и сделать, но.. а как? файлы get-ом не передаются по определению, только post-ом.
но чтобы что-то вывести на экран, мне нужен get. что ддшить-то? ))

Не в сети

#8 20.10.2017 14:40:15

Re: Ajax-загрузка файлов на сервер

Во вкладочке network отладчика, ты увидишь прекрасно свою ddшку post запроса

Не в сети

#9 20.10.2017 14:50:06

Re: Ajax-загрузка файлов на сервер

хз.
сделал в контроллере : return dd($request);
в аяксе добавил :           success:function(dd){
              console.log('log: ' + dd);
...

получил во вкладке console нечитаемое RrzdAJK.png

Не в сети

#10 20.10.2017 14:54:05

Re: Ajax-загрузка файлов на сервер

Говорю ж, dd делай прям в коде) А результат смотри во вкладке Network

Не в сети

#11 20.10.2017 14:57:18

Re: Ajax-загрузка файлов на сервер

дак я ж в коде и сделал)
PcfBd4X.png

во вкладке нетворкс ничего интересного нету:
f4bGzPf.png

Не в сети

#12 20.10.2017 15:02:12

Re: Ajax-загрузка файлов на сервер

1. без return
2. смотреть там http://joxi.ru/BA0jEwzHBoR8Nm

Не в сети

#13 20.10.2017 15:27:26

Re: Ajax-загрузка файлов на сервер

1. сделал без ретурна
2. и что там увидеть? выше скрин вкладке network

Не в сети

#14 20.10.2017 18:03:14

Re: Ajax-загрузка файлов на сервер

2. и что там увидеть? выше скрин вкладке network

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

Не в сети

#15 20.10.2017 18:04:32

Re: Ajax-загрузка файлов на сервер

думал так и сделать, но.. а как? файлы get-ом не передаются по определению, только post-ом.но чтобы что-то вывести на экран, мне нужен get. что ддшить-то? ))

Это не так.
На POST запрос сервер отвечает и результат можно посмотреть.

Не в сети

Подвал раздела