Search code examples
ruby-on-railssimple-formslim-langrefile

refile simple_form undefined method attachment_field


I am trying to hook up refile to my view and I am getting the following error: enter image description here

Here are my models:

class Job < ActiveRecord::Base
  acts_as_paranoid

  acts_as_taggable
  acts_as_taggable_on :languages

  belongs_to :company
  belongs_to :category

  validates :title,
            :location,
            :category,
            :language_list,
            :short_description,
            :description,
            :application_process,
            presence: true
end

class Company < ActiveRecord::Base
  acts_as_paranoid
  has_many :jobs

  attachment :company_logo, type: :image

  validates :name, :url, :email, presence: true
end

And the simple_form view (ignore the binding.pry)

= render layout: 'header' do
  = simple_form_for(@job) do |j|
    div[class='panel-heading']
      h3[class='panel-title']
        |Position Details
    div[class='panel-body']
      = j.input :title
      = j.input :location
      = j.association :category, as: :radio_buttons
      = j.input :language_list, as: :check_boxes, collection: @tags
      = j.input :short_description
      = j.input :description, input_html: { class: 'textarea-height wysihtml5' }
      = j.input :application_process
    div[class='panel-heading']
      h3[class='panel-title']
        |Company Details
    div[class='panel-body']
      = j.simple_fields_for :company do |jc|
        = jc.input :name

        = binding.pry

        = jc.input :company_logo, as: :attachment
        = jc.input :url
        = jc.input :email
    div[class='panel-heading panel-heading-info']
      h3[class='panel-title']
        |Would you like your job posting featured?
    div[class='panel-body']
      p
        |Featured posted are promoted with additional design elements to grab the
          job seeker's attention.  This additional marketing capability can be purchased
          for an additonal $#{AppConfig.product['settings']['job_base_featured_price']}.

      = j.input :is_featured

      = j.button :button, type: 'button', class: 'btn-primary' do
        = job_posting_button_step_label
        =>
        i[class='fa fa-arrow-circle-right']

While I have been parsing the documentation I can not seem to figure out why attachment_field is undefined.

Also, I have an initializer refile.rb setup as follows:

require 'refile/rails'
require 'refile/simple_form'

I am wondering if the docs are messed up or the simple_form piece is borked because if I switch this to:

= jc.input :company_logo, as: :file, direct: true, presigned: true

Solution

  • After a lengthy battle here is how I figured out a work around for this situation. First I found this SO post Styling file upload button for simple_form_for with Bootstrap in Rails 3 which lead me to try https://github.com/jasny/bootstrap/. Jasny has some sweet file uploaders but all of the gems are way out of date. [Note, I hope to fix this with a patch as I have time this week] so I downloaded the Jasny files to the vendor javascripts and stylesheets folders as shown:

    enter image description here

    I also used https://rails-assets.org/ to pull in holder.js in my gemfile:

    source 'https://rails-assets.org' do
      gem 'rails-assets-holderjs'
    end
    

    Next, I updated my application.js file with the following:

    //= require refile
    //= require holderjs
    //= require jasny-bootstrap
    

    Next, I needed the styles in my sass setup:

    // External Libraries Built For Bootstrap in Vendor
    @import 'awesome-bootstrap-checkbox';
    @import 'jasny-bootstrap';
    

    This gave me the tools to modify my file uploader in simple form to:

    = j.simple_fields_for :company do |jc|
      = jc.input :name
      div
        label
          = t('simple_form.labels.company.logo')
      div[class="form-group fileinput fileinput-new" data-provides="fileinput"]
        div[class="fileinput-new thumbnail" style="width: 200px; height: 200px;"]
          img[data-src="holder.js/200x200" alt="..."]
        div[class="fileinput-preview fileinput-exists thumbnail" style="max-width: 200px; max-height: 200px;"]
        div
          span[class="btn btn-default btn-file"]
            span[class="fileinput-new"]
              |Select image
            span[class="fileinput-exists"]
              |Change
            = jc.input_field :logo, direct: true, presigned: true
          a[href="#" class="btn btn-default fileinput-exists" data-dismiss="fileinput"]
            |Remove
        p[class="help-block"]
          = t('simple_form.hints.company.logo')      
      = jc.input :url
      = jc.input :email
    

    Which resulted in a pretty uploader!

    enter image description here

    I would like to refactor this to a partial, but I will wait until I have another file upload form to tackle that. Also, if you take a look into the code above I followed the locale convention that simple_form uses. Not pretty but it works.