加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

多图片Ajax上传

发布时间:2020-12-16 02:44:21 所属栏目:百科 来源:网络整理
导读:控制器代码 public function multiUploadImg( Request $request,$ordersn,$step,$stion){ // 重组数组,子函数 function reArrayFiles( $file_post ) { $file_ary = array(); $file_count = count($file_post[‘name‘]); $file_keys = array_keys($file_pos

控制器代码

public function multiUploadImg( Request $request,$ordersn,$step,$stion){

        // 重组数组,子函数
        function reArrayFiles( $file_post ) {

            $file_ary = array();
            $file_count = count($file_post[‘name‘]);
            $file_keys = array_keys($file_post);

            for ($i=0; $i<$file_count; $i++) {
                foreach ($file_keys as $key) {
                    $file_ary[$i][$key] = $file_post[$key][$i];
                }
            }

            return $file_ary;
        }

        $imgFiles = $_FILES[‘filesToUpload‘]; // 与前端页面中的 input name=“filesToUpload[]” 相对应
        $uploadedFiles = array(); // 返回值

        if(!empty($imgFiles))
        {
            $img_desc = reArrayFiles( $imgFiles );
            $destinationPath = ‘uploads/‘; //public 文件夹下面建 storage/uploads 文件夹
           $imgs=‘‘;//图片Url地址
            foreach( $img_desc as $img )
            {
                $savedFile = $destinationPath.uniqid().$ordersn.‘.‘.pathinfo( $img[‘name‘],PATHINFO_EXTENSION );
                move_uploaded_file($img[‘tmp_name‘],$savedFile);
                $img[‘savedFile‘] = $savedFile ;
                $imgs.=$savedFile.‘;‘;
                array_push( $uploadedFiles,$img );
            }

        $allowed_extensions = ["png","jpg","gif"];
        // TODO 判断文件类型

        return [‘uploadedFiles‘ => $uploadedFiles ];
    }

前端提交代码

<form method="post" enctype="multipart/form-data">
   <input name="filesToUpload[]" accept="image/*" id="settlement_authorize" data-show="showsettlement_authorize" data-for="settlement_authorize"
           class=" weui-uploader__input input_multifileSelect" type="file" multiple>
</form>

JS提交代码

<script>
    $(document).ready(function () {
        $(‘.input_multifileSelect‘).on(‘change‘,function () {
            var stion = $(this).attr(‘data-for‘);
            var showdiv = $(this).attr(‘data-show‘);
            var step = 4;
            var ajax_option = {
                url: "{{url("/staff/file/uploads/{$data->ordersn}")}}/" + step + "/" + stion,// type : ‘post‘,默认是 form action
                success: function (data) {
                    console.log(data);
                    showUploadedImgs(data.uploadedFiles,step,showdiv,"{{url("/staff/file/delete/{$data->ordersn}")}}",stion);
                }
            }
            $(this).parent().ajaxSubmit(ajax_option);
        });

    });
</script>

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读