`

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
分享到:
评论

相关推荐

    Ajax on Rails

    例如,当一个链接或表单标记为`remote: true`时,Rails会默认使用Ajax处理请求。此外,`data-*`属性用于传递额外的信息,如HTTP方法(GET或POST)和回调函数。 **jQuery与Rails的结合** 在Rails早期版本中,经常...

    在Ruby on Rails中使用AJAX的教程

    在Ruby on Rails框架中,AJAX(异步JavaScript和XML)的使用极大地提升了用户体验,因为它允许在不刷新整个页面的情况下更新内容。Rails通过内置的Prototype.js库简化了AJAX的集成,使得开发者可以快速创建富互联网...

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

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

    Rails-4-AJAX-Form:Rails 4 AJAX表单示例

    在这个表单中,`remote: true`参数告诉Rails使用AJAX来提交表单。接下来,我们需要在控制器中处理这个AJAX请求。以`PostsController`为例,我们可能有以下代码: ```ruby def create @post = Post.new(post_params...

    rails中使用javascript日期控件

    3. **AJAX更新**:如果应用使用了AJAX来异步提交表单,我们需要确保WebCalendar.js在提交时能正确更新表单数据,例如,当用户在日期选择器中选择新的日期后,控件应自动将选中的日期填入输入框。 4. **响应式设计**...

    RESTful Rails Development

    RESTful Rails 支持通过 AJAX 请求来获取或更新资源。 #### 1.15 测试 为了确保 RESTful 应用的质量,测试是必不可少的。可以使用 RSpec 或 Minitest 等工具来进行单元测试和集成测试。 #### 1.16 RESTful 客户端...

    rails-bootstrap-modals:这个应用程序展示了如何在 rails 4 中使用模态

    首先,要在 Rails 4 应用中使用 Bootstrap,我们需要添加 Bootstrap 的 CSS 和 JS 文件。这可以通过将 Bootstrap 的 CDN 链接添加到应用的 `app/assets/stylesheets/application.css` 和 `app/assets/javascripts/...

    rails_cms:一个简单的 CMS 内置 Rails,源自 Lynda.com 上的 Ruby on Rails

    这通常涉及 turbolinks、AJAX 请求、表单提交和动态更新内容等。 在 `rails_cms-master` 压缩包中,你可以找到项目的源代码,包括 `app`、`db`、`lib`、`config` 等目录,它们分别包含了应用程序的各个组件和配置。...

    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 部分,本资源是第三部分;第一部分下载...

    使用Ruby on Rails快速开发web应用的教程实例

    随着Rails的更新和迭代,它引入了许多现代Web开发的新特性,比如RESTful路由、AJAX集成和安全机制等,这些都为开发者提供了更加丰富的工具来构建现代Web应用。 总之,Ruby on Rails是一个功能强大的Web应用开发框架...

    learn-rails:第一个 Ruby on Rails 项目,来自 Capstone Rails Tutorials Book 1

    6. **JavaScript**:虽然主要标签是Rails,但项目中提到了JavaScript,这意味着可能涉及到客户端脚本,如AJAX(异步JavaScript和XML)请求,用于无刷新的数据更新。你可能还会接触到Rails的Unobtrusive JavaScript ...

    rails-stories:Codecademy项目实施案例

    4. `public/` - 存放静态资源,如CSS样式表、JavaScript文件和图片。 5. `spec/` - 测试文件,使用RSpec或类似工具编写,确保代码质量。 为了实现"Stories"应用,你需要了解以下概念和技术: - ERB(Embedded Ruby...

    angular_rails_raffler:AngularJS + Rails-随机选择下一任总裁

    3. 服务:提供如$http服务来与Rails后端进行通信,获取或提交数据。 二、Rails:后端的坚实后盾 Ruby on Rails,简称Rails,是一款基于Ruby语言的Web开发框架,遵循MVC架构模式。在本项目中,Rails承担了以下任务...

    js-rails-mod4

    - 使用`ujs (unobtrusive JavaScript)`让JavaScript与Rails视图和控制器通信,例如表单提交、AJAX请求等。 - `data-*`属性结合Rails UJS,使得HTML元素能够触发特定的JavaScript行为。 8. **Turbolinks** - ...

    ABC123:Rails文章

    JavaScript还可以配合Rails的AJAX(异步JavaScript和XML)功能,实现页面部分更新,提升应用响应速度。 **ABC123-master压缩包** “ABC123-master”这个名字暗示这是一个Git仓库的主分支,通常包含项目的源代码...

Global site tag (gtag.js) - Google Analytics