fastadmin自定义Fieldlist(json字段)上传图片
先看效果图:
首先form表单添加如下代码
<div class="form-group">
<label class="control-label col-xs-12 col-sm-2">{:__('Cover_json')}:</label>
<div class="col-xs-12 col-sm-8">
<dl class="fieldlist" data-template="basictpl" data-name="row[cover_json]">
<dd>
<ins>图片名称</ins>
<ins>图片地址</ins>
</dd>
<dd><a href="javascript:;" class="btn btn-sm btn-success btn-append option"><i class="fa fa-plus"></i> {:__('Append')}</a></dd>
<textarea name="row[cover_json]" class="form-control hide" cols="30" rows="5">
[{"key":"","value":""}]
</textarea>
</dl>
</div>
</div>
在form表单底部添加如下代码
<script type="text/html" id="basictpl">
<dd class="form-inline">
<input type="text" name="<%=name%>[<%=index%>][key]" class="form-control" value="<%=row['key']%>">
<input type="text" name="<%=name%>[<%=index%>][value]" id="o-<%=index%>" class="form-control" value="<%=row['value']%>">
<span><button type="button" id="faupload-<%=index%>" class="btn btn-danger plupload " data-input-id="o-<%=index%>" data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp" data-multiple="false"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
<span><button type="button" id="fachoose-<%=index%>" class="btn btn-primary fachoose" data-input-id="o-<%=index%>" data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp" data-multiple="false"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
<span class="btn btn-sm btn-danger btn-remove"><i class="fa fa-times"></i></span>
<span class="btn btn-sm btn-primary btn-dragsort"><i class="fa fa-arrows"></i></span>
</dd>
</script>
在js添加如下代码add: function () {
Controller.api.bindevent();
$(document).on("fa.event.appendfieldlist", "#add-form .btn-append", function (e,obj) {
Form.events.faupload(obj);
Form.events.faselect(obj);
//Form.events.selectpage(obj);
})
},
原创文章,转载请注明:fastadmin自定义Fieldlist(json字段)上传图片 | 知识改变命运
转载请注明出处: 知识改变命运 » fastadmin自定义Fieldlist(json字段)上传图片