欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

ajaxForm excel导入

程序员文章站 2024-01-03 19:42:46
...

form表单提交有ajaxForm和ajaxSubmit两种方式,这里采用的是ajaxForm。

这两种方法的区别

      这两种方法主要的却别是ajaxForm不能主动提交form,函数只是为提交表单做准备需要以submit来触发提交。而ajaxSubmit会主动提交表单,同时可以在点击其他按钮时也可以触发提交,不一定是submit按钮。

ajaxForm excel导入

html

<div class="dropdown" style="display: inline-block">
     <button class="btn btn-default btn-sm btn-flat dropdown-toggle" type="button"
                                            id="dropdownMenu" data-toggle="dropdown" aria-haspopup="true"
                                            aria-expanded="true">更多操作<span class="caret"></span></button>
          <ul class="dropdown-menu" aria-labelledby="dropdownMenu">
               <li>
                   <a href="#" data-toggle="modal" data-target="#ExportInExcel">Excel导入</a>
               </li>
               <li>
                   <a href="#" onclick="exportOutExcel(1)">Excel导出</a>
               </li>
               <li>
                   <a href="#" onclick="exportOutExcel(0)">模板导出</a>
               </li>
           </ul>
</div>
<div id="ExportInExcel" class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <div text-right style="margin-top: 10px">
                    <div class="col-sm-3 text-left">
                        <h4 class="modal-title">Excel导入</h4>
                    </div>
                </div>
            </div>
            <div class="modal-body text-right">
                <form id="upload" name="upload" enctype="multipart/form-data">
                    <div id="product_show" class="form-group" style="margin-top: 10px">
                        <input type="hidden" name="path" value="product">
                        <input type="hidden" name="FileName" value="product.xls">
                        <div class="col-sm-3 text-right">
                            <label for="product_show" class="control-label"><span
                                    class="required">*</span> 请选择文件</label>
                        </div>
                        <div class="col-sm-9 text-left">
                            <input type="file" accept="application/vnd.ms-excel" id="file" name="file"
                                   class="form-control inputBox file"
                                   style="padding-left: 0px;padding-top: 0px;">
                        </div>
                    </div>
                    <button class="btn btn-primary btn-flat"  onclick="return pulimportExcel(ExportInExcel,'file','#ExportInExcel')">导入</button>
                    <button type="button" class="btn btn-default btn-flat" data-dismiss="modal">关闭</button>
                </form>
            </div>
            <div class="modal-footer">
            </div>
        </div>
    </div>
</div>
<script type="text/javascript" src="/static/zutai/mach_detail/js/jquery.form.js"></script>

 

js

//导入数据至项目
function ExportInExcel() {
    $("input[name='path']").val('product');
    $("input[name='FileName']").val('product.xls');
    $('#upload').ajaxForm({
        url: '/Upload',
        type: 'post',
        beforeSerialize: function () {
        },
        beforeSubmit: function () {
        },
        success: function () {
             ExportExcelIn();
          //  location.reload();
        },
        error: function () {
        },
        dataType: null,
        clearForm: true,
        restForm: true,
        timeout: 6000
    }).submit(function (event) {

    })
}


//导入数据至后台(ajax 传给后端, 可自己写)
var ExportExcelIn = function () {
    var Params = [["rname", "i_plc.Page.apss.product.exportInExcel"]];
    LoadJson(function (ret) {
        //按钮元素权限控制
        if(!PermissionIsExit(ret)){
            $('#ExportInExcel').modal('hide');
            $.MessageBox.diyconfirm('提示:', '你无此操作权限, 请升级你的角色的等级,谢谢!', null);
            return;
        }

        if (ret[0].id == "success") {
            debugger
             if(ret[0].error.haserror){
                dealexcelerror(ret,'#ExportInExcel')
            }else{
                $('#ExportInExcel').modal('hide');
                $.MessageBox.notify('info', '数据导入成功!');
                onchange1()
            }
        } else {
            $('#ExportInExcel').modal('hide');
            $.MessageBox.notify('info', '数据连接失败')
        }
    }, Params, 'post', null, false);
}

注意: js里的两行   

$("input[name='path']").val('product');
$("input[name='FileName']").val('product.xls');

主要是用来保存excel的路径和文件名

ajaxForm excel导入

 

上一篇:

下一篇: