zl0314/jq-batch-upload

Laravel5.5 more pictures upload

Installs: 27

Dependents: 0

Suggesters: 0

Security: 0

Stars: 0

Watchers: 2

Forks: 0

Open Issues: 0

Language:JavaScript

v1.2 2018-07-17 06:21 UTC

This package is auto-updated.

Last update: 2024-04-25 20:52:33 UTC


README

详细内容见: http://zlong.xin/posts/146.html
#########################################
1、在config/app.php的providers数组中加入:Jq\BatchUpload\JqBatchUploadServiceProvider::class,

2、在用到上传轮播图的地方加入如下代码:
<div class="form-group">
    <label for="">轮播图</label>
    <div class="box" id="box"> </div>
</div>

        @include('BatchUpload::header')
		<!--如果要用到排序,请去掉注释-->
        <!--<script src="/path/to/jquery/jquery-ui.js"></script>-->
        <script type="text/javascript">
            var imgFile = new ImgUploadeFiles('#box', function (e) {
                this.init({
                    MAX: 30, //限制个数
                    inputName: 'pics[]',
                    imgList: '{!! !empty($model->pics) ? json_encode($model->pics) : (old('pics')?json_encode([old('pics')]):'') !!}',
                    MH: 588, //像素限制高度
                    MW: 1170, //像素限制宽度
                    TitleName: '轮播图',
                    allowSize: '{{intval(ini_get('upload_max_filesize'))*1024*1024}}',
                    callback: function (dom) {
                        $.post('/jq-batch-upload/upload', {src: this.imgSrc}, function (res) {
                            if (res.success == 1) {
                                $(dom).attr('realsrc', res.src);
                                $(dom).find('input').val(res.src);
                            } else {
                                alert(res.message);
                            }
                        }, 'json');
                    },
                    remove: function (id) {
                        var realsrc = $('#batch_upload_' + id).attr('realsrc');
                        $.post('/jq-batch-upload/delete', {src: realsrc}, function (res) {

                        }, 'json');
                    }
                });
            });
        </script>
        <script>
			//如果要用到排序,请开启
            //$(function () {
            //    $("#sortable").sortable();
            //});
        </script>