easyui表单提交文件

<form id="form1" method="post" enctype="multipart/form-data">
    <fieldset>
        <legend>用Ajax把Form表单提交到远程服务器Api</legend>
        <div class="form-group">
            <label class="col-sm-6 control-label" for="ds_host">选择文件</label>
            <div class="col-sm-4">
                <input type="file" name="file" id="inpFile" dirname="inpFile" />
            </div>
            <div class="col-sm-2">
                <input type="button" value="提交" id="inpUpload" />
            </div>
        </div>
    </fieldset>
    <script src="/plugins/jquery-3.3.1.min.js"></script>
    <script src="/plugins/easyui/jquery.easyui.min.js"></script>
    <script>
        $(document).ready(function () {
            $("#inpUpload").click(function () {
                var fileObj = $("#inpFile").get(0).files[0];
                if (fileObj == null) {
                    alert("请选择要上传的文件");
                    return false;
                }
                $("#form1").form("submit", {
                    url: "http://localhost:19501/Files/ReceiveFileTest",
                    onSubmit: function (params) {
                        //提交前检查
                        return true;
                    },
                    success: function (data) {
                        console.log(data);
                        var data = eval(‘(‘ + data + ‘)‘);
                        alert(JSON.stringify(data));
                    }
                });
            });
        });
    </script>
</form>

原文地址:https://www.cnblogs.com/hofmann/p/12627892.html

时间: 2024-11-06 16:57:22

easyui表单提交文件的相关文章

js实现无刷新表单提交文件,将ajax请求转换为form请求方法

最近在做项目的时候遇到一个需要上传文件的需求,因为ajax请求是无法上传二进制文件流的,所以只能用form表单提交,而form提交有一个问题就是会使页面刷新,本文解决了form表单提交文件时页面刷新的问题. 一.无刷新实现form提交文件 将form的target指向为一个iframe就可以实现无刷新提交文件了,但关键是还需要看到后台返回的数据,所以还需要为该iframe注册一个回调函数,因为iframe和该页面在同域内,所以可以在iframe里可以调用该回调函数,就可以看到后台返回的数据了.实

easyui 表单提交前的 confirm 处理

最近学习用 easyui,异步提交表单是遇到一个小问题 $('#fModiDetail').form('submit',{ url:'...', onSubmit:function(){ if($(this).form('validate')){ return $.messager.confirm('?','确定要保存吗?', function(r){ return r; }); success:function(data){ //... }; 以上代码在表单验证成功后,确认对话框尽管也会弹出来

easyui表单提交注意项

Easyui中提供的form表单提交为ajax方式提交 $('#ff').form('submit'); //页面不会进行刷新 使用JQuery提供的form提交着为form方式提交 $('#ff').submit(); //刷新页面 原文地址:https://www.cnblogs.com/Richard-Tang/p/easyui.html

form表单提交文件(input file)

包含文件上传的form表单提交,要添加属性 enctype="multipart/form-data" <form method="post" id="create_form" action="" enctype="multipart/form-data"> <table style="display: table;"> <tr> <td>

form表单提交文件

<form action="http://localhost....." method="post" enctype="multipart/form-data"> <input type="file" id="fileId" name="image" value="请上传图片" /> <input type="hidden&qu

Linux curl 模拟form表单提交信息和文件

curl是一个命令行方式下传输数据的开源传输工具,支持多种协议:FTP.HTTP.HTTPS.IMAP.POP3.TELNET等,功能超级强大. 我今天想说的是程序开发中常用的模拟Form提交 1.GET提交 特别简单直接写url里面 2.POST提交    通过 --data/-d 方式指定使用POST方式传递数据 3.模拟form表单提交文件  --form/-F 模拟form表单提交文件 这个命令超级好用,再也不用为了写上传接口,而被迫写一个Form表单了 "[email protecte

带文件的表单提交

今天用表单提交一个文件到服务器,但服务器始终接收不到上传的文件.最后排除出原因有二: 1 表单需要封装. <form>标签要加上 enctype="multipart/form-data"属性 2 文件选择控件一定要有name和id属性 <form method="post" action="http://www.baidu.com" enctype="multipart/form-data"> <

使用jquery form插件进行异步带文件的表单提交

引入form插件与jquery 的js文件后 获取表单的jq对象 然后.ajaxSubmit提交表单即可 实现添加品牌的异步表单提交 function addBarandImg(formId) { $('#'+formId).ajaxSubmit({ url: '/ProductManage/AddBrand', //data: $("#" + formId).serialize(), type: 'post', dataType: "json", success:

ajax form表单提交 input file中的文件

ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了解决这个问题我走了不少弯路: 1.用原生的 input file , 不支持ajax上传文件,你肯定会说可以用 ajax form表单上传了呀?不过我后面还要调用上传成功后用js处理一些对话框,所以这种方法排除 2.用了 uploadify 上传插件,弄出来能上传东西,结果不理想:因为不能判断上传的