dongyou5098 2018-07-16 09:44
浏览 66

Ajax多文件上传Laravel 5.6

I'm trying to upload multiple files using 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() !!}

Without ajax files upload. With ajax only input text

</div>
  • 写回答

1条回答 默认 最新

  • douweihui0178 2018-07-16 12:34
    关注

    To upload files via ajax you need to use a FormData object

            $(".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);
                        }
                    }
                });
    
            });
    
    评论

报告相同问题?

悬赏问题

  • ¥15 【提问】基于Invest的水源涵养
  • ¥20 微信网友居然可以通过vx号找到我绑的手机号
  • ¥15 寻一个支付宝扫码远程授权登录的软件助手app
  • ¥15 解riccati方程组
  • ¥15 display:none;样式在嵌套结构中的已设置了display样式的元素上不起作用?
  • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
  • ¥50 树莓派安卓APK系统签名
  • ¥65 汇编语言除法溢出问题
  • ¥15 Visual Studio问题