.modal-body
          .container-fluid
            .row
              .col-md-12
                1.下载模板文件
                = link_to '模板文件'
            .row
              .col-md-12
                = form_tag '', :id => "my-form" do
                  .input-group
                    %span.input-group-btn
                      %button#fake-file-button-browse.btn.btn-default{:type => "button"}
                        %span.glyphicon.glyphicon-file
                    = file_field_tag :category_file, :id => "files-input-upload", :style => "display:none"
                    %input#fake-file-input-name.form-control{:disabled => "disabled", :type => "text"}/
                    %span.input-group-btn
                      %button#fake-file-button-upload.btn.btn-default{:disabled => "disabled", :type => "button"}
                        %span.glyphicon.glyphicon-upload

使用formdata得到完整表单,将formdata作为data值传递给后台,就如同点击submit提交数据一样。注意此处的url和type对应的值不能直接写到表单里面,而应写在ajax的配置参数中

  $('#fake-file-button-upload').click(function() {
    var form = new FormData(document.getElementById('my-form'));

    $.ajax({
      url: "/tax_categories/get_category",
      type: "POST",
      data: form,
      dataType: "json",
      processData: false,  // 不处理数据
      contentType: false,  //要加
      success: function(data) {
        console.log(data);
        if (data.result == "error") {
          alert(data.result);
        } else {
          console.log("save success");
          window.location = "/tax_categories"
        }
      }
    });
  });

使用creek解析xml

require 'creek'

def get_category
    flag = true
    begin
      file = params[:category_file]
      creek = Creek::Book.new file.path
      sheet = creek.sheets[0]
      sheet.rows.each do |row|
        puts row
      end
    rescue
      flag = false
    end

    if flag
      respond_to do |f|
        f.json {
          render :json => {:result => "success"}.to_json
        }
      end
    else
      respond_to do |f|
        f.json {
          render :json => {:result => "error"}.to_json
        }
      end
    end
  end

此处还有个比较二的问题,是发生了302重定向,刚开始controller中的代码是如下,在解析成功后想直接跳转,可是在ajax的请求下,产生的是302重定向,在浏览器中并不会显示跳转。所以采用在js中location定位到新的页面

  if flag
       redirect_to tax_categories_url
    else
      respond_to do |f|
        f.json {
          render :json => {:result => "error"}.to_json
        }
      end
    end

ajax使用formdata 提交excel文件表单到rails解析的更多相关文章

  1. Ajax 使用formdata 实现 无刷新表单上传

    FormData对象的作用就类似于这里的serialize()方法,不过FormData是浏览器原生的,且支持二进制文件 1.这里实现一个无刷新上传图片,成功后页面显示 点击button 触发隐藏的 ...

  2. Ajax发送FormData对象封装的表单数据

    前端页面: <!doctype html> <html lang="en"> <head> <meta charset="UTF ...

  3. Java使用HTTP编程模拟多参数多文件表单信息的请求与处理

    本文目的是提供Java环境下模拟浏览器页面提交多参数多文件表单请求以及解析请求的Demo代码.这里用Java提供的HttpURLConnection类做HTTP请求,再原始点可以直接使用socket. ...

  4. SpringMVC 完美解决PUT请求参数绑定问题(普通表单和文件表单)

    一 解决方案 修改web.xml配置文件 将下面配置拷贝进去(在原有的web-app节点里面配置 其它配置不变) <!-- 处理PUT提交参数(只对基础表单生效) --> <filt ...

  5. Jquery serialize()提交多个表单数据

    ajax提交多个表单数据: 先把不同的表单分别用serialize()函数,然后把序列化后的数据用+拼接提交给后台,具体例子如下 var data1 = $('#form1).serialize(); ...

  6. javaWeb中一个按钮提交两个表单

    一个按钮提交两个表单,有时候会用到,一般会很容易想到使用 onclick="document.form1.submit();document.form2.submit();" 的方 ...

  7. 直接提交一个form表单后台返回一个新页面通过target属性可以放到iframe当中

    问题描述: 我想提交一个form表单后台直接返回一个新页面,但是当前页面还不想被替换掉: 解决方案: 在页面中添加一个iframe将form表单的target属性设置为iframe的id这样的话返回的 ...

  8. Form表单 JSON Content-type解析

    Form表单 JSON Content-type解析 1 表单Form概述 在Form表单中,参数一般有: action 表单提交的url method 提交方式:post get name 表单的属 ...

  9. HTML5新表单新功能解析

    HTML5新增了很多属性功能.但是有兼容性问题,因为这些表单功能新增的.我这里做了一个简单的练习,方便参考.如果完全兼容的话,那我们写表单的时候就省了很多代码以及各种判断. <!DOCTYPE ...

随机推荐

  1. Hash索引和BTREE索引2

    索引是数据库中用来提高性能的最常用工具.所有MySql列类型都可以被索引.索引用于快速找出在某个列中有一特定值的行.如果不使用索引,MYSQL必须从第一条记录开始然后读完整个表直到找出相关的行.常用的 ...

  2. Mac显示和隐藏隐藏文件

    显示:defaults write com.apple.finder AppleShowAllFiles -bool true 隐藏:defaults write com.apple.finder A ...

  3. Yarn源码分析之事件异步分发器AsyncDispatcher

    AsyncDispatcher是Yarn中事件异步分发器,它是ResourceManager中的一个基于阻塞队列的分发或者调度事件的组件,其在一个特定的单线程中分派事件,交给AsyncDispatch ...

  4. Yii简单使用阿里云短信教程!

    首先我们下载官方完整包的SDK官方标明了啊,PHP版本一定要不低于5.5下载后目录如下: 我们只需要将目录里的api_sdk复制出来到Yii项目的根目录的common模块下面的extensions文件 ...

  5. HTML CSS表格如何控制上下间距

    css:td{margin-top:10px; 上间距margin-right:10px; 右间距margin-bottom:10px; 下间距margin-left:10px; 左间距}

  6. 什么是 HTTPS

    HTTPS (基于安全套接字层的超文本传输协议 或者是 HTTP over SSL) 是一个 Netscape 开发的 Web 协议. 你也可以说:HTTPS = HTTP + SSL HTTPS 在 ...

  7. week 5: ;Lasso regression & coordinate descent

    笔记. 岭回归, 计算回归系数时使( RSS(w)+λ||w||2) 最小 岭回归的结果会是所有的特征的weight都较小,但大多数又不完全为零. 而实际情况中,有的特征的确与输出值相关程度很高,we ...

  8. 关于swift 单元测试的补充

    最近小弟在自己学习研究swift , 习惯于写一边写单元测试一边写逻辑的我来说,在xcode环境没有单元测试,写起来就是有个不是实在的感觉. 至于怎么创建单元测试.怎么写,不是这个文章的主题,因为看了 ...

  9. package-cleanup用法

    今天升级时候遇到"you could try using package-cleanup --problems to work around the problem ...", 本 ...

  10. 小知识,大智慧(restframework 拾忆)

    一.直接对query_set序列化,在页面展示的效果是Unicode 编码格式 ,可在json 序列化时候加入一个参数 course_query = DegreeCourse.objects.all( ...