layui表单与图片一起提交 - 前端

##from表单部分
	
    <form class="layui-form layui-form-pane ok-form" id="feedBackForm">
    {% csrf_token %}
        <div class="layui-form-item">
            <label class="layui-form-label">公司简称</label>
            <div class="layui-input-block">
                <input type="text" name="name" placeholder="请输入公司简称" autocomplete="off" class="layui-input"
                       >
            </div>
        </div>
        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">话术</label>
            <div class="layui-input-block">
                <textarea name="huashu" placeholder="请输入话术" class="layui-textarea" autocomplete="off"></textarea>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">业务</label>
            <div class="layui-input-block">
                <input type="text" name="yewu" placeholder="如留空，即使用话术识别！" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-upload">
          <button type="button" class="layui-btn" id="test2">营业执照上传</button>
          <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
           
         </blockquote>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button id="test9" class="layui-btn" lay-submit lay-filter="add">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>

##js部分

<script src="/static/lib/layui/layui.js"></script>
    <script>
        layui.use(['element', 'form', 'jquery', 'laydate','upload', 'layer'], function () {
        var element = layui.element;
        var table = layui.table;
        var form = layui.form;
        var $ = layui.jquery;
        var laydate = layui.laydate;
        var upload = layui.upload;
        var layer = layui.layer;
        var myFile;

laydate.render({
            elem: '#birthday',
            type: "datetime"
        });

form.verify({
            birthdayVerify: [/^((((1[6-9]|[2-9]\d)\d{2})-(0?[13578]|1[02])-(0?[1-9]|[12]\d|3[01]))|(((1[6-9]|[2-9]\d)\d{2})-(0?[13456789]|1[012])-(0?[1-9]|[12]\d|30))|(((1[6-9]|[2-9]\d)\d{2})-0?2-(0?[1-9]|1\d|2[0-8]))|(((1[6-9]|[2-9]\d)(0[48]|[2468][048]|[13579][26])|((16|[2468][048]|[3579][26])00))-0?2-29-))(\s(([01]\d{1})|(2[0123])):([0-5]\d):([0-5]\d))?$/, '日期格式不正确']
        });

upload.render({
          elem: '#test2'
          ,url: '/info/upload' //改成您自己的上传接口
          ,auto: false
          ,bindAction: '#test9'
          ,before: function(obj){
            //预读本地文件示例，不支持ie8
            obj.preview(function(index, file, result){
              $('#demo2').append('<img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img">');
              myFile = file;
            });
          }
          ,done: function(res){
            //layer.msg("执照上传成功",{icon: 6});
          }
          ,error:function () {
            //layer.msg("执照上传失败",{icon: 5});
          }
        });

form.on('submit(add)', function(myFile){
        var myForm = document.getElementById("feedBackForm");
        var formData = new FormData(myForm);
        formData.append("myfile",JSON.stringify(myFile));
        //console.log(JSON.stringify(myFile));
        //var name = data.field.name;
        //var huashu = data.field.huashu;
        //var yewu = data.field.yewu;
        //发异步，把数据提交给php
        $.ajax({  
            type: "post",
            url: "/info/baobei_create_api",
            data: formData,
            contentType: false,
            processData: false,
            //data:{name: name,huashu:huashu,yewu:yewu},
            beforeSend: function(){
                 layer.msg("正在处理中...",{icon: 0,time: 60000});
                },
            success:function(data){
                layer.alert("添加成功", {icon: 6},function () {
                // 获得frame索引
                var index = parent.layer.getFrameIndex(window.name);
                //关闭当前frame
                parent.layer.close(index);
                });
            },
            error:function () {
                layer.msg("添加失败",{icon: 5});
                }
            })
            return false;
        });
        })
    </script>