简体   繁体   English

将html添加到活动管理页面

[英]Add html to active admin page

I would like to add either some html or a div to an active admin form, so that I can add a jquery file uploader progress bar to the active admin form page. 我想在活动的管理表单中添加一些html或div,以便我可以将jquery文件上传器进度条添加到活动的管理表单页面。 Currently, my form looks like this: 目前,我的表单如下所示:

  form(:html => { :multipart => true}) do |f|
    f.inputs "Studio" do
      f.input :name
      f.input :position
      f.input :description
      f.input :image, :label => "Image - (must be 335x221px)"
      f.input :gallery_image, :label => "Image - (must be 600x400px)"
    end
    f.actions 
  end

Let's say I wanted to add a div above each of the uploaders to show my upload progress, how would I add some sort of a div above each? 假设我想在每个上传器上方添加一个div以显示我的上传进度,我将如何在每个上面添加某种div?

You should move your form to a view and make modifications there. 您应该将表单移动到视图并在那里进行修改。

app/admin/studio.rb 应用程序/管理/ studio.rb

form do |f|              
    render partial: 'form'                        
end  

app/views/admin/studio/_form.html.erb 应用程序/视图/管理/工作室/ _form.html.erb

<%= form(:html => { :multipart => true}) do |f| %>
    <div class="progress">...</div>
    <%= f.inputs "Studio" do %>
         <%= f.input :name %>
         <%= f.input :position %>
         <%= f.input :description %>
         <%= f.input :image, :label => "Image - (must be 335x221px)" %>
         <%= f.input :gallery_image, :label => "Image - (must be 600x400px)" %>
    <% end %>
    <%= f.actions  %>
<% end %>

Active admin created a DSL on top of Formtastic according to their docs 主动管理员根据他们的文档在Formtastic上创建了一个DSL

https://github.com/activeadmin/activeadmin/blob/master/docs/5-forms.md https://github.com/activeadmin/activeadmin/blob/master/docs/5-forms.md

So you can now do: 所以你现在可以这样做:

form do |f|
  f.semantic_errors(*f.object.errors.keys)

  import_errors = self.controller.instance_variable_get("@errors")
  if import_errors.present?
    ul class: 'errors' do
      import_errors.each do |e|
        li e
      end
    end
  end

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM