fastadmin-表单使用

1.日期时间

在FastAdmin中的日期时间组件采用的是Bootstrap-datetimepicker插件,官方文档:Bootstrap-datetimepicker官方教程

  • 日期时间格式设置:设置 data-date-format 的值,支持Moment.js的格式
{:Form::datetimepicker('startdate', date('Y-m'), ['data-rule'=>'required','data-date-format'=>'YYYY'])}
  • 动态设定当前日期时间:使用js或者jq操作Dom
$("input[name='startdate']").attr('value','2016')

2.文件上传

FastAdmin有现成的图片上传组件,直接copy代码修改关键参数即可,如果是上传文件,是无法预览的,此时需要删除预览标签ul,并清空文件类型data-mimetype

<div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Images')}:</label>
        <div class="col-xs-12 col-sm-8">
            <div class="input-group">
                <!-- 输入框 -->
                <input id="c-images" class="form-control" size="50" name="row[images]" type="text">
                <div class="input-group-addon no-border no-padding">
                    <!-- 上传 -->
                    <span>
                        <button type="button" id="faupload-images" class="btn btn-danger faupload" data-input-id="c-images" 
                        data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp" data-multiple="true" 
                        data-preview-id="p-images"><i class="fa fa-upload"></i> {:__('Upload')}</button>
                    </span>
                    <!-- 选择 -->
                    <span><button type="button" id="fachoose-images" class="btn btn-primary fachoose" data-input-id="c-images" 
                        data-mimetype="image/*" data-multiple="true"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
                </div>
                <!-- 表单验证提示 -->
                <span class="msg-box n-right" for="c-images"></span>
            </div>
            <!-- 预览 -->
            <ul class="row list-inline faupload-preview" id="p-images" style="margin-left:-5px;"></ul>
        </div>
    </div>

字段截图说明

posted @ 2022-01-14 11:18  ---空白---  阅读(700)  评论(0编辑  收藏  举报