Adding multiple images on a page with CRUD - ruby-on-rails

I want to add several different images with a crud to make some "work pages" but i struggle with the way to do this. Do I have to update my model or how i can specify that each adding field is for a section of my view? I'm using cloudinary to host the images.
For now when I add an image its all the same but I wanted to add differents ones at each spot.
My work#new view :
<div class="container text center">
<%= simple_form_for(#work) do |f| %>
<div class="row justify-content-center">
<div class="col-md-6 col-sm-12">
<h1 class="heading-02" style="padding: 2rem 0rem;">New Work</h1>
<div class="work-new-section">
<h2 class="sub-heading-03">Header</h2>
<%= f.input :name %>
<%= f.input :description %>
<%= f.input :photo, as: :file %>
</div>
<div class="work-new-section">
<h2 class="sub-heading-03">Tasks</h2>
<%= f.input :task_title %>
<%= f.input :tasks %>
<%= f.input :photo, as: :file %>
</div>
<div class="work-new-section">
<h2 class="sub-heading-03">Content#1</h2>
<%= f.input :content1_title %>
<%= f.input :content1 %>
<%= f.input :photo, as: :file %>
</div>
<div class="work-new-section">
<h2 class="sub-heading-03">Focus</h2>
<%= f.input :focus_title %>
<%= f.input :focus %>
</div>
<div class="work-new-section">
<h2 class="sub-heading-03">Content#2</h2>
<%= f.input :content2_title %>
<%= f.input :content2 %>
<%= f.input :photo, as: :file %>
</div>
<%= f.submit 'Create a new Work', :class => 'button-accent mb-4' %>
</div>
</div>
<% end %>
</div>
Work#new
My Work model :
class Work < ApplicationRecord
has_one_attached :photo
end
For the work#show is use some partials with the same behaviour in it:
<div class="container">
<div class="row">
<div class="col-md-4 col-sm-12">
<%= cl_image_tag #work.photo.key, :class=> "work-image", :width => 420, :height => 236, :crop => "fill" %>
</div>
<div class="col-md-4 col-sm-12">
<h2 class="sub-heading-03"><%= #work.content1_title %></h2>
<p class="ui-regular-01"><%= #work.content1 %></p>
</div>
</div>
</div>
Work#show
How could I specify one particular photo to each section? (task, content#1, content#2 etc...)
Thank you very much for your time!
I tried to change my new view but i have the impression that i omit something that i don't understand very well.

Related

How to add in multiple options for checkbox in Ruby on Rails?

This is likely a super easy answer for a Ruby on Rails expert. I have a form and need to add in a checkbox that has multiple items. I've been messing with the following code for a lot longer than I'd like to admit:
<%= form_for :lead, url: something, html: {id: 'product-form'} do |f|%>
<div class="row">
<div class="col-md-12">
<div class="form-group">
<%= f.label :product%>
<%= f.check_box :product, {multiple:true}, "option", "option2", :class => 'form-control'%>
</div>
</div>
</div>
<% end %>
With this code I get the error "wrong number of arguments (5 for 1..4)".
Basically I just want someone to be able to pick multiple options. I've also tried the following:
<div class="row">
<div class="col-md-12">
<div class="form-group">
<%= f.label :product%>
<%= f.check_box :option1, "Option1" :class => 'form-control'%>
<%= f.check_box :option2, "Option2", :class => 'form-control'%>
</div>
</div>
</div>
And I get the delightful "undefined method `merge' for "Option1":String". What am I missing to put the values in associated with the label?
I use Rails 5.1.6 and this is how I achieved adding multiple options for checkbox. I also placed it in a dropdown.
In the migration file:
t.string :skills
In my controller "tasks_controller.rb":
def task_params
params.require(:task).permit(:work_type, :title, :post, {skills: []})
end
In my model "task.rb" I did:
validates :skills, presence: true
serialize :skills, JSON
I created a module mobilephones_data.rb in directory "app/model/concerns/" which holds all the options of the checkbox as an array that can be edited easily.
In app/model/concerns/mobilephones_data.rb I wrote:
module Mobilenphones_Data
Activities = [
'Amazon Kindle', 'Blackberry', 'iPad', 'iPhone', 'Mobile Phone', 'Nokia',
'Palm', 'Samsung'
]
end
This will put all data from module's array into the checkbox drop-down as checkbox options. In My form I did:
<div class="card">
<a class="card-link card-header" data-toggle="collapse" href="#collapseOne">
Mobile Phones
</a>
<div id="collapseOne" class="collapse" data-parent="#accordion">
<div class="card-body">
<% Mobilenphones_Data::Activities.each do |activity| %>
<div id="skill_list" class="col-lg-3 col-md-4 col-sm-12 col-12">
<%= f.check_box :skills, { multiple: true }, activity, false %>
<%= activity %>
</div>
<% end %>
</div>
</div>
</div> <!--bottom-->
</div>
In my view "show.html.erb":
<% #name_of_model.skills.each do |skill| %>
<%= skill %>
<% end %>
For posterity sake:
<div class="row">
<div class="col-md-12">
<div class="form-group">
<%= f.label "Select a Product" %><br />
<%= f.check_box(:option) %>
<%= f.label(:mug, "Option") %><br />
<%= f.check_box(:option2) %>
<%= f.label(:mousepad, "Option2") %>
</div>
</div>
</div>

file_field upload button appearing multiple times on edit form

I have this code in my _form.html.erb file:
<%= f.fields_for :request_attachments do |ra| %>
<div class="row westmontTextMuseo3" id="uploader">
<div class="col-xs-12">
<label class="btn btn-info"> Upload Files
<%= ra.file_field :request_attachment_file, :multiple => true, name: "request_attachments[file][]", :style => "display: none", type: "file" %>
<%= ra.hidden_field :file_cache %>
</label>
<%= link_to(ra.object.file.url.to_s.split('/')[-1], ra.object.file.url) %>
</div>
</div>
<% end %>
I can see why the Upload Files button appears. It seems like I want it outside the scope of the nested form, but I don't know how to do that.
My goal is to place the button once after it has provided links to each of the already attached files.
Any help would be great, thanks.
Edit: Other code to see if we can get it to work.
<%= f.fields_for :request_attachments do |ra| %>
<%= link_to(ra.object.file.url.to_s.split('/')[-1], ra.object.file.url) %>
<% end %>
<div class="row westmontTextMuseo3" id="uploader">
<div class="col-xs-12">
<label class="btn btn-info"> Upload Files
<%= #request.request_attachments.file_field :request_attachment_file, :multiple => true, name: "request_attachments[file][]", :style => "display: none", type: "file" %>
<%= #request.request_attachments.hidden_field :file_cache %>
</label>
</div>
</div>
But this fails with an undefined method file_field' for #<RequestAttachment...
This seemed to have worked
<%= f.fields_for :request_attachments do |ra| %>
<div class="row">
<div class="col-xs-12">
<%= link_to(ra.object.file.url.to_s.split('/')[-1], ra.object.file.url) %>
</div>
</div>
<% end %>
<div class="row westmontTextMuseo3" id="uploader">
<div class="col-xs-12">
<label class="btn btn-info"> Upload Files
<%= file_field_tag :request_attachment_file, :multiple => true, name: "request_attachments[file][]", :style => "display: none", type: "file" %>
<%= hidden_field_tag :file_cache %>
</label>
</div>
</div>
I assumed since the attributes were nested it wouldn't work, but it did work.

Rails 4 - Simple form arguments

Can anyone see what's wrong with this form of expression?
<%= simple_fields_for :article do |f| %>
<%=f.input :q, :nil, placeholder: "Search" %>
<% end %>
Error message says:
wrong number of arguments (3 for 1..2)
So- my wider code is:
articles#index.html.erb:
<div class="row">
<div class="col-md-10 col-md-offset-1">
<%= render 'articles/searchform' %>
</div>
<div class="col-md-10 col-md-offset-1">
<% Article.all.sort_by(&:created_at).in_groups_of(3) do |group| %>
</div>
<div class="row">
<% group.compact.each do |article| %>
<div class="col-md-4">
<div class="indexdisplay">
<%= image_tag article.image_url, width: '100%', height:
'200px' if article.image.present? %>
<div class="indexheading"> <%= link_to article.title, article %> </div>
<div class="indexsubtext"> <%= truncate(article.body, :ommission =>
"...", :length => 250) %></div>
</div>
</div>
<% end %>
</div>
<div class="row">
<%= link_to 'New Article', new_article_path %>
</div>
In my views articles#form.html.erb
<div class="col-xs-10 col-xs-offset-1">
<%= simple_form_for(#article) do |f| %>
<%= f.error_notification %>
<div class="form-inputs">
<%= f.input :title, autofocus: true %>
<%= f.input :body, :label => "Post", :input_html => {:rows => 10} %>
<%= f.input :image, :label => "Add an image" %>
</div>
<div class="form-actions">
<%= f.button :submit, "Review a draft", :class =>
'formsubmit' %>
</div>
<% end %>
In articles#searchform.html.erb
<% f.simple_fields_for :article do |a| %>
<%=a.input :q, :nil, placeholder: "Search" %>
<% end %>
I get this error:
undefined local variable or method `f' for #<#<Class:0x007f874133c410>:0x007f8740448058>
You are missing your form variable, e.g. f.
For instance if you have simple_form_for ... do |f| you should then write
= f.simple_fields_for :article do |article|
= article.input :q, :nil, placeholder: 'search'
[EDIT] You seem confused. The simple_fields_for is a special command to iterate over nested items, inside a form (e.g. comments for a post). So simple_fields_for would require a surrounding form (simple_form_for). For your search-form you should just be using simple_form_for.

Using Devise and Simple form

I am using devise in my rails app, I converted the devise views to use simple form. When I attempt to sign up with an incorrect password format the flash messages for the password do not appear. Flash messages appear for ever other field. Does anyone know how to fix this problem.
<div class="container">
<div class="panel small-5 small-centered columns">
<div class="row">
<h2>Sign Up</h2>
<%= simple_form_for(resource, :as => resource_name, :url => registration_path(resource_name),
:html => {:multipart => true}) do |f| %>
<%= f.input :email, label: "E-mail", :autofocus => true %>
</div>
<div class="row">
<div class="row">
<div class="small-6 columns">
<%= f.label :password, label: "Password" %>
<%= f.password_field :password %>
</div>
<div class="small-6 columns">
<%= f.label :password_confirmation %>
<div id="password-confirm">
<%= f.password_field :password_confirmation %>
</div>
</div>
</div>
</div>
<div class="row">
<div class="row">
<div class="small-6 columns">
<%= f.input :last_name, label: "First Name" %>
</div>
<div class="small-6 columns">
<%= f.input :first_name, label: "Last Name" %>
</div>
</div>
</div>
<div class="row">
<div class="sign-up">
<%= f.label "Profile Photo" %><br>
<%= f.file_field :avatar, label: "Profile Photo" %>
<%= f.input :twitter_handle, label: "Twitter Url" %>
<%= f.input :linked_in_url, label: "Linked In Url" %>
<%= f.input :about_me, label: "About You (500 character max)" %>
<%= f.submit "Sign up", class: "button" %>
<% end %>
</div>
</div>
</div>
</div>

Display error messages at the bottom of form submit

Is there a twitter boot strap class to display all validation error messages at the bottom of the form submit button?
<div class="row-fluid">
<div class="span12">
<div class="devise-body">
<%= simple_form_for(resource, :as => resource_name, :url => registration_path(resource_name),
:html => { :class=>'control-group error'} ) do |f| %>
<%= f.error_notification %>
<div class="controls">
<div class="row-fluid">
<div class="span6">
<%= f.input :first_name,:required=>true,:autofocus => true %>
</div>
<div class="span6"><%= f.input :last_name,:required=>true%>
</div>
</div>
<div class="row-fluid">
<div class="span6"><%= f.input :company %></div>
<div class="span6"><%= f.input :title %></div>
</div>
<div class="row-fluid">
<div class="span6"> <%= f.input :email, :required => true %></div>
<div class="span6"><%= f.input :phone_number %></div>
</div>
<%= f.input :password, :required => true %>
<%= f.input :password_confirmation, :required => true %>
</div>
<div class="form-actions" >
<!-- #class="form-actions" -->
<%= f.button :submit, "Sign up" ,:class => 'btn'%>
</div>
<% end %>
<%= render "devise/shared/links" %>
</div>
</div>
If I were you I'd use their alert classes:
http://twitter.github.com/bootstrap/components.html#alerts

Resources