`

rails ajax提交文件或图片

阅读更多
所要用到的插件:
1.安装responds_to_parent,下载responds_to_parent放到vendor/plugins目录下

1.view层,以下写法是为了能在controller层取到正确的file路径:
<%form_for(:attach,:url=>{:controller=>'product',:action=>'submit_attach',:format=>:js},:html=>{:multipart => true,:id=>'p_'+index.to_s,:target => 'upload_frame'}) do |f| %>
    <%=hidden_field_tag 'att_'+index.to_s,nil%>
    <%=hidden_field_tag 'index',index%>
    名称:<%=f.text_field :name,:size=>30 %><br />
    信息:<%=f.file_field :photo,:size=>16 %> <!--只是一个虚拟字段-->
    <%=f.submit '上传'%>
    <iframe id='upload_frame' name="upload_frame" style="width:1px;height:1px;border:0px" src="about:blank">
    </iframe>
<%end%>

2.model层,product_secret.rb
  #文件上传处理
  def self.filesave(upload,path)
      File.open(path, "wb") { |f| f.write(upload.read) }
  end


3. ##controller层,ajax上传附件代码
  def submit_attach
    flag=true
    index=params[:index]
    attr=params['att_'+index]
    if attr.blank?
      if params[:attach] && params[:attach][:photo] && params[:attach][:name]
          name = Time.now.strftime("%y%m%d%I%M%S") + 'size'+ params[:attach][:photo].size.to_s               ##防止文件名重复
          suffix=File.extname("#{params[:attach][:photo].original_filename}")
          name<<suffix
          directory = "public/data"      ##上传后文件的路径
          path = File.join(directory, name)
          attach=Attach.create(:name=>params[:attach][:name],:path=>path)
          ProductSecret.filesave(params[:attach][:photo],path)  ##上传文件
          error="上传成功"
      else
          error="请填写完整信息,请重新上传"
          flag=false
      end
    else
      error="附件已上传"
      flag=false
    end
    respond_to do |format|  
      if flag
        format.js do 
           responds_to_parent do    ##ajax调用
             render :update do |page|
                page.call('given_value',"pr_#{index}",attach.id)
                page.alert(error)
             end  
           end            
        end  
      else 
         format.js do 
           responds_to_parent do 
              render :update do |page|
                page.alert(error)
              end  
           end            
         end  
      end  
    end  

  end
分享到:
评论

相关推荐

    itemizer:具有AJAX文件上传功能的Rails + AngularJS脚手架应用程序

    )测验规格必须使用一个Item模型来实现一个项目,该模型具有2个字段:名称和图片(图片文件)。 所有操作应在一页上进行,而无需重新加载该页。 该页面最初显示所有项目(项目)的列表,并具有更改或删除(带有确认...

    Ruby on Rails Web开发之旅.pdf【第二部分】

    《Ruby.on.Rails.Web开发之旅》,作者:【德】Patrick Lenz,翻译:王德民、刘昕、裴立秋,出版社:人民邮电出版社,ISBN:9787115188526,PDF 格式,大小 144 Mb,被压缩为 3 部分,本资源是第二部分;第一部分下载...

    Ruby on Rails Web开发之旅.pdf【第一部分】

    《Ruby.on.Rails.Web开发之旅》,作者:【德】Patrick Lenz,翻译:王德民、刘昕、裴立秋,出版社:人民邮电出版社,ISBN:9787115188526,PDF 格式,大小 144 Mb,被压缩为 3 部分,本资源是第一部分;第二部分下载...

    Ruby on Rails Web开发之旅.pdf【第三部分】

    《Ruby.on.Rails.Web开发之旅》,作者:【德】Patrick Lenz,翻译:王德民、刘昕、裴立秋,出版社:人民邮电出版社,ISBN:9787115188526,PDF 格式,大小 144 Mb,被压缩为 3 部分,本资源是第三部分;第一部分下载...

    FormikMultiSteps:使用Formik进行多步骤提交

    添加图像,字体和文件 使用public文件夹 更改HTML 在模块系统之外添加资产 何时使用public文件夹 使用全局变量 添加引导程序使用自定义主题 增加流量 添加路由器 添加自定义环境变量 在HTML中引用环境变量 在Shell...

    Destructables

    可破坏的是基于Rails,React.js,Redux和Postgresql构建的单页Web应用程序。 它受Instructables的启发,允许用户使用包含上载照片的逐步设计来创建项目。 用户还可以浏览,搜索和评论各种项目。特征导航栏 导航栏是...

    react-h5-editor:h5编辑器

    添加图像,字体和文件 使用public文件夹 更改HTML 在模块系统之外添加资产 何时使用public文件夹 使用全局变量 添加引导程序使用自定义主题 增加流量 添加路由器 添加自定义环境变量 在HTML中引用环境变量 在Shell...

    cra-test:React应用实验

    该项目是通过引导的。... 使用AJAX请求获取数据与API后端集成节点Ruby on Rails 在开发中代理API请求配置代理后出现“无效的主机头”错误手动配置代理配置WebSocket代理在开发中使用HTTPS 在服务器上生成动态&lt;met

    经典JAVA.EE企业应用实战.基于WEBLOGIC_JBOSS的JSF_EJB3_JPA整合开发.pdf

     国内知名的高端IT技术作家,已出版《Spring 2.0宝典》、《基于J2EE的Ajax宝典》、《轻量级J2EE企业应用实战》、《Struts 2权威指南》、《Ruby On Rails敏捷开发最佳实践》等著作。 目录: 第0章 学习Java...

Global site tag (gtag.js) - Google Analytics