Ajax多文件上传Laravel 5.6

时间:2018-07-16 09:44:55

标签: php ajax laravel

我正在尝试使用jQuery / AJAX / Laravel上传多个文件。

 <script type="text/javascript">
        $(document).ready(function() {
            $(".btn-submit").click(function(e){
                e.preventDefault();
                var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
                var first_name = $("input[name='first_name']").val();
                var last_name = $("input[name='last_name']").val();
                var email = $("input[name='email']").val();
                var phone = $("input[name='phone']").val();
                var aboutu = $("textarea[name='aboutu']").val();
                var files = $("input[name='files']").val();

                $.ajax({
                    url: "{{route('form')}}",
                    type:'POST',
                    data: {_token: CSRF_TOKEN, first_name:first_name,last_name:last_name, email:email, phone:phone, aboutu:aboutu, files:files},
                    success: function(data) {
                        if($.isEmptyObject(data.error)){
                            printSuccessMsg(data.success);
                        }else{
                            printErrorMsg(data.error);
                        }
                    }
                });

            });
            function printSuccessMsg(msg) {
                $(".print-success-msg").find("p").html('');
                $(".print-success-msg").css('display','block');
                $(".print-success-msg").find("p").append('Спасибо! Мы скоро свяжемся с вами :)');

            }
            function printErrorMsg (msg) {
                $(".print-error-msg").find("ul").html('');
                $(".print-error-msg").css('display','block');
                $.each( msg, function( key, value ) {
                    $(".print-error-msg").find("ul").append('<li>'+value+'</li>');
                });
            }
        });

    </script>


my controller is

public function getForm(Request $request)
    {
        $rules =
            [
                'first_name' => 'required',
                'email' => 'required|email',
                'aboutu' => 'required'
            ];

        $messages =
            [
                'first_name.required' => 'Необходимо ввести имя',
                'email.required' => 'Необходимо ввести email',
                'aboutu.required' => 'Расскажите о себе'
            ];

        $validation = Validator::make($request->all(), $rules, $messages);
        if ($validation->fails()) {
            return response()->json(['error' => $validation->errors()->all()]);
        }

        $form = Form::create($request->all());

        if ($request->hasFile('files')) {
            $files = $request->file('files');
            foreach ($files as $file) {
                $fl = $file->store('public/storage/formfiles');
                Formfile::create([
                    'freelancer_id' => $form->id,
                    'files' => $fl
                ]);
            }
        }

        if ($validation->passes()) {
            return response()->json(['success' => 'Мы скоро свяжемся с вами :)']);
        }

    }
  my view is
{!! Form::open( ['files' => true])!!}
                    <div class="form-group">
                        {{ Form::text('first_name', old('first_name'),['class' => 'form-control', 'placeholder'=>'*']) }}
                    </div>
                    <div class="form-group">
                        {{ Form::text('last_name', old('last_name'),['class' => 'form-control', 'placeholder'=>'*']) }}
                    </div>
                    <div class="form-group">
                        {{ Form::date('birthday', old('birthday'),['class' => 'form-control']) }}
                    </div>
                    <div class="form-group">
                        {{ Form::email('email',old('email'),['class' => 'form-control', 'placeholder'=>'*']) }}
                    </div>
                    <div class="form-group">
                        {{ Form::text('phone', old('phone'),['class' => 'form-control',  'placeholder'=>'']) }}
                    </div>
                    <div class="form-group">
                        {{ Form::textarea('aboutu', old('aboutu'),['class' => 'form-control', 'rows' => 3, 'placeholder'=>'*']) }}
                    </div>
                    <div class="form-group">
                        {{ Form::file('files[]', ['multiple', 'class' => 'form-control']) }}
                    </div>
                    <div class="form-group">
                        {{ Form::submit('Отправить',['class'=>'btn btn-link btn-submit'])}}
                    </div>
                    {!! Form::close() !!}

不上传ajax文件。仅使用ajax输入文本

1 个答案:

答案 0 :(得分:0)

要通过Ajax上传文件,您需要使用FormData对象

        $(".btn-submit").click(function(e){
            e.preventDefault();
            var fd = new FormData(this.form);
            $.ajax({
                url: "{{route('form')}}",
                type:'POST',
                data: fd,
                contentType: false,
                processData: false,
                success: function(data) {
                    if($.isEmptyObject(data.error)){
                        printSuccessMsg(data.success);
                    }else{
                        printErrorMsg(data.error);
                    }
                }
            });

        });