zoukankan      html  css  js  c++  java
  • art-template 弹出编辑

    <!-- 模板 -->
    <script id="render-tpl" type="text/html">
        <div class="panel-body">
            <div class="table-responsive col-lg-10">
                <form class="form-horizontal addForm" method="post" action="editsave" name="form1" id="edit_form"
                      enctype="multipart/form-data">
                    <input type="hidden" id="id" name="id" value="{{ in_data.id }}">
                    <div class="form-group col-lg-12">
                        <label class="control-label col-lg-3 text-right"><span class="control-label required-mark">*</span>营业执照:</label>
                        <span class="input-group file-caption-main col-lg-5" style="float: left;">
                            <div class="form-control file-caption  kv-fileinput-caption"
                                 style="overflow: hidden;line-height: 23px;">
                                请上传营业执照,尺寸不限
                            </div>
                            <input style="display: none;" class="file-real" id="business_license"
                                   name="business_license" type="file" multiple=""/>
    
                            <div class="input-group-btn file-btn">
                                <div class="btn btn-primary btn-file" id="for_business_license">
                                    <i class="glyphicon glyphicon-folder-open"></i>&nbsp;
                                    <span class="hidden-xs">上传图片</span>
                                </div>
                            </div>
                        </span>
                        <span class="col-lg-4 text-left erbi-form-right">
                                <span class="layer_open_onepic" data-url="{{ in_data.business_license }}"><img src="{{ in_data.business_license }}" width="30" /></span>
                        </span>
                    </div>
    
    
                    <div class="form-group">
                        <div class="col-lg-2 col-lg-offset-3">
                            <button type="button" class="btn btn-primary col-lg-8" id="edit_btn">提交</button>
                        </div>
    
                        <div class="col-lg-2">
                            <button type="button" class="btn btn-danger col-lg-8" id="cancel_btn">取消</button>
                        </div>
                        <div class="clear"></div>
                    </div>
                </form>
            </div>
            <!-- /.table-responsive -->
        </div>
    
    </script>
    

    js

    /**
     * 上传图片
     */
    $(".upload-img").on('click', function () {
        let id = $(this).parent().data('id');
        $.ajax({
            type: 'POST',
            url: 'ajaxGetApplyInfo',
            data: {id:id},
            dataType: 'json',
            success: function (data) {
                if (data.errno == 0) {
                    let html = template('render-tpl', {in_data: data.data});
                    layer.open({
                        title: '上传营业执照',
                        type: 1,
                        skin: 'layui-layer-rim', //加上边框
                        area: ['1200px', '400px'], //宽高
                        content: html
                    });
                } else {
                    alert(data.errdesc);
                    return false;
                }
            }
        });
    });
    
    
    $(document).on('click','#cancel_btn',function(){
        layer.closeAll();
    });
    
    
    
    $(document).on('click','#edit_btn',function(){
        $("#edit_form").ajaxForm({
            dataType: "json",
            success : function(obj){
                if(obj.errno == 0){
                    layer.msg('已保存');
                    setTimeout(function() {
                        layer.closeAll();
                        window.location.reload();
                    },1000);
                }else{
                    layer.msg(obj.errdesc);
                }
                return false;
            }
        });
    
        let id = $("#id").val();
        if (!id) { // 添加
            if(!dealImg('#business_license','请选择图片')) {
                return;
            }
        }
        $("#edit_form").submit();
        return false;
    });
    
  • 相关阅读:
    BOM
    CSS 定位与浮动
    轮播
    跨域
    Flex-弹性布局
    vue.js开发环境搭建以及创建一个vue实例
    js闭包
    git的一些基本命令
    不定宽块状元素居中方法
    git中常用命令小结
  • 原文地址:https://www.cnblogs.com/jiqing9006/p/11137727.html
Copyright © 2011-2022 走看看