Simple_Form Auto Disabling Inputs on Reload - ruby-on-rails

Updating simple_form works fine but when I reload the page, it renders all the inputs as disabled. Any ideas? I can't find anything in the documentation that says what causes it to do this automatically. Thanks
the simple form.
<%= simple_form_for #product_campaign, url: update_completion_criteria_rules_partner_product_product_campaign_path(partner_id: #partner.id, product_id: #product.id, id: #product_campaign.id), remote: true, html: { id: "product-campaign-completion-criteria-rules"} do |f| %>
<div class="">
<%= f.simple_fields_for :completion_criteria_rules, f.object.completion_criteria_rules.order(:created_at) do |complete_criteria_rule| %>
<%= render 'completion_criteria_rule_fields', :f => complete_criteria_rule %>
<% end %>
<%= link_to_add_association "Add Completion Criteria Rule", f, :completion_criteria_rules, class: "btn btn-info float-left mt-10", id: "add-completion-criteria-rule", data: { } %>
<button type="submit" class="btn btn-info float-right mt-10" id="update-product-campaign-form" ><span id="save-journey-button-text">Save Changes</span></button>
</div>
<% end %>
completion_criteria_rule_fields partial
<div class="form-row">
<div class="form-group col-md-6">
<%= f.input :events, collection: CompletionCriteriaRule::EVENTS_OPTIONS, label: 'Choose Events', include_blank: false, input_html: { class: "form-control form-field-type", "data-provide": "selectpicker", multiple: true } %>
</div>
<div class="form-group col-md-6">
<%= f.input :actions, collection: [['Add Campaign', 'add_campaign']], label: 'Choose Action', input_html: { class: "form-control form-field-type actions-dropdown", "data-provide": "selectpicker", multiple: true } %>
</div>
</div>
<div class="form-row add-campaign-dropdown-wrapper" <% unless f.object.actions&.include?('add_campaign') %>style="display:none;<% end %>">
<div class="form-group col-md-6">
<%= f.input :transition_campaign_id, collection: #product_campaign.product.product_campaigns.where.not(id: #product_campaign.id).published.map{|k,v| [k.name.titleize, k.id]}, label: 'Select Campaign To Add', input_html: { class: "form-control form-field-type", "data-provide": "selectpicker" } %>
</div>
<div class="form-group col-md-6">
<label>Campaign Start Delay</label>
<div class="input-group">
<%= f.input_field :transition_campaign_delay, class: "form-control form-field-type" %>
<span class="input-group-addon">days</span>
</div>
</div>
</div>
<div class="form-row">
<div class="form-group col-md-12">
<span class="float-right">
<%= link_to_remove_association 'Remove Rule', f, class: "btn btn-danger btn-xs" %><br>
</span>
</div>
</div>
<div class="divider"></div>
</div>
completion_criteria_rule.rb
class CompletionCriteriaRule < ApplicationRecord
EVENTS_OPTIONS = [["Appointment Booked", "appointment.booked"], ["Appointment Attended", "appointment.attended"], ["Appointment Cancelled", "appointment.cancelled"], ["Lifecycle Changed to Client", "lifecycle.client"], ["Lifecycle Changed to Lead", "lifecycle.lead"], ["Lifecycle Changed to Former Client", "lifecycle.former_client"], ["Lifecycle Changed to None", "lifecycle.none"]].freeze
belongs_to :product_campaign
belongs_to :transition_campaign, class_name: 'ProductCampaign', foreign_key: 'transition_campaign_id', optional: true
validates :product_campaign, :events, :actions, presence: true
validates :transition_campaign, :transition_campaign_delay, presence: true, if: -> { actions&.include? 'add_campaign' }
before_save :reject_blank_events
before_save :reject_blank_actions
def reject_blank_events
events.reject!(&:blank?)
end
def reject_blank_actions
actions.reject!(&:blank?)
end
end

Found out that I had some js that was disabling form inputs with a certain class that was disabling the inputs after page load. All working now.

Related

What would the rails helper tag equivalent be of this select?

I have been struggling to convert this to some sort of rails helper select. Can anyone help with this?
<%= form_with(model: scheduleevent, class: "contents", data: { controller: 'nested-form', nested_form_wrapper_selector_value: '.nested-form-wrapper' }) do |form| %>
... schedtimerange_form start ...
<%= select_tag "days[]",options_for_select(Date::DAYNAMES.zip((1..7))), id:"days[]", multiple: true, class: 'multis' %>
<% end %>
The select tag is within a nested attribute partial called schedtimerange_form that is called like this:
<template data-nested-form-target="template">
<%= form.fields_for :schedtimeranges, Schedtimerange.new, child_index: 'NEW_RECORD' do |schedtimerange| %>
<%= render "schedtimerange_form", form: schedtimerange %>
<% end %>
</template>
<%= form.fields_for :schedtimeranges do |schedtimerange| %>
<%= render "schedtimerange_form", form: schedtimerange %>
<% end %>
Schedtimerange_form:
<div data-new-record="<%= form.object.new_record? %>">
<div class="w-full">
<div data-controller="select">
<%= select_tag "days[]",options_for_select(Date::DAYNAMES.zip((1..7))), id:"days[]", multiple: true, class: 'multis' %> </div>
</div>
<div>
<div class="w-full mb-2">
<label class="form_label"><%= t("scheduling_events_new_lbl_starttime") %> </label>
<div class="pr-4"><%= form.text_field :start_time, data: { controller: "flatpickr", flatpickr_enable_time: true, flatpickr_no_calendar: true,
flatpickr_date_format: "h:i K" }, class: 'form_control', placeholder: "#{t("scheduling_events_new_lbl_starttime")}" %> </div>
</div>
<div class="w-full mb-4">
<label class="form_label"><%= t("scheduling_events_new_lbl_endtime") %> </label>
<div class="pr-4"><%= form.text_field :end_time, data: { controller: "flatpickr", flatpickr_enable_time: true, flatpickr_no_calendar: true, flatpickr_date_format: "h:i K" }, class: 'form_control', placeholder: "#{t("scheduling_events_new_lbl_endtime")}" %> </div>
</div>
<div class="w-full">
<button type="button" class="font-medium text-red-600 dark:text-red-500 hover:underline" data-action="nested-form#remove">Remove Times</button>
</div>
</div><%= form.hidden_field :_destroy %>
</div>
<%= select_tag "days[]",options_for_select(Date::DAYNAMES.zip((1..7))), id:"days[]" %>

Can't seem to submit collection_select and receiving Unpermitted parameter: :hero_id

Sorry for the messy post, my first time posting. I have been trying to get this collection submit to work, but every time I press create report button I have it goes back to the screen and puts out Unpermitted parameter: :hero_id in the rails server terminal.
Model
class Report < ApplicationRecord
validates :subject, presence: true, length: { minimum: 6, maximum: 100 }
validates :description, presence: true, length: { minimum: 10, maximum: 300 }
belongs_to :requester
has_and_belongs_to_many :heros
end
View/Form
<div class="container">
<div class="row justify-content-center">
<div class="col-10">
<% if #report.errors.any? %>
<h2>The following errors prevented the article from being saved</h2>
<ul>
<% #report.errors.full_messages.each do |msg| %>
<li><%= msg %></li>
<% end %>
</ul>
<% end %>
<%= form_with(model: #report, class: "shadow p-3 mb-3 bg-dark rounded", local: true) do |f| %>
<div class="form-group row">
<%= f.label :subject, class: "col-2 col-form-label text-light" %>
<div class="col-10">
<%= f.text_field :subject, class: "form-control shadow rounded", placeholder: "Subject of Report" %>
</div>
</div>
<div class="form-group row">
<%= f.label :description, class: "col-2 col-form-label text-light" %>
<div class="col-10">
<%= f.text_area :description, rows: 10, class: "form-control shadow rounded", placeholder: "Description of Issue" %>
</div>
</div>
<div class="form-group row">
<%= f.label :hero, class: "col-2 col-form-label text-light" %>
<div class="col-10">
<%= f.collection_select(:hero_ids, Hero.all, :id, :hero_name, {prompt: "Select a Hero"}, {:required => true}) %>
</div>
</div>
<div class="btn-toolbar p-2 mb-2 row justify-content-center">
<%= f.submit class: "btn btn-primary" %>
</div>
<% end %>
</div>
<div class="mb-3">
<%= link_to '[ Cancel and return to reports listing ]', reports_path, class: "text-info" %>
</div>
</div>
</div>
Controller
def report_params
#byebug
params.require(:report).permit(:subject, :description, hero_ids: [])
end
Console
(byebug) params.require(:report)
<ActionController::Parameters {"subject"=>"Test report", "description"=>"Test report", "hero_ids"=>"1"} permitted: false>

Rails 5: Ways to validate forms

Working on a form:
<%= form_for(#contact, html: {multipart: true}) do |f| %>
<div class="card">
<div class="card-header">
<h2 class="display-5 main-text-blue text-center font-weight-bold">Add New Contact</h2>
</div>
<div class="card-body">
<div class="errors">
<% if #contact.errors.any? %>
<div class="alert alert-danger">
<h5 class="text-center mb-n1 pb-1"><i class="fa fa-exclamation-triangle text-danger"></i> Please correct the following errors: </h5>
</div>
<% end %>
</div>
<div class="form-group row">
<div class="col-md-5 mx-auto">
<div class="wrap" id="avatar-container">
<div class="valign-middle">
<div class="form-group">
<% if #contact.new_record? %>
<%= image_tag "100x100.png", class: "img-responsve img-preview" %>
<% else %>
<%= image_tag #contact.avatar, class: "img-responsve img-preview" %>
<% end %>
<label for="file" class="sr-only">Choose Image</label>
<%= f.file_field :contact_avatar, id: "file" %>
</div>
</div>
</div>
</div>
</div>
<div class="form-group row">
<%= f.label :name, class: "col-lg-2 col-form-label" %>
<div class="col-lg-10">
<%= f.text_field :name, class: "form-control #{'is-invalid' if has_error?(#contact, :name) }", id: "name", placeholder: "Name.." %>
<% if has_error?(#contact, :name) %>
<span class="text-danger">
<%= get_error(#contact, :name)%>
</span>
<% end %>
</div>
</div>
<div class="form-group row">
<%= f.label :email, class: "col-lg-2 col-form-label" %>
<div class="col-lg-10">
<%= f.text_field :email, class: "form-control #{'is-invalid' if has_error?(#contact, :email) }", id: "email", placeholder: "Email.." %>
<% if has_error?(#contact, :email) %>
<span class="text-danger">
<%= get_error(#contact, :email)%>
</span>
<% end %>
</div>
</div>
<div class="form-group row">
<%= f.label :mobile, class: "col-lg-2 col-form-label" %>
<div class="col-lg-10">
<%= f.text_field :mobile, class: "form-control #{'is-invalid' if has_error?(#contact, :mobile) }", id: "mobile", placeholder: "Mobile.." %>
<% if has_error?(#contact, :mobile) %>
<span class="text-danger">
<%= get_error(#contact, :mobile)%>
</span>
<% end %>
</div>
</div>
<div class="form-group row">
<%= f.label :phone, class: "col-lg-2 col-form-label" %>
<div class="col-lg-10">
<%= f.text_field :phone, class: "form-control #{'is-invalid' if has_error?(#contact, :phone) }", id: "phone", placeholder: "Phone.." %>
<% if has_error?(#contact, :phone) %>
<span class="text-danger">
<%= get_error(#contact, :phone)%>
</span>
<% end %>
</div>
</div>
<div class="form-group row">
<%= f.label :country, class: "col-lg-2 col-form-label" %>
<div class="col-lg-10">
<%= f.text_field :country, class: "form-control", id: "country", placeholder: "Country.." %>
</div>
</div>
<div class="form-group row">
<%= f.label :address, class: "col-lg-2 col-form-label" %>
<div class="col-lg-10">
<%= f.text_field :address, class: "form-control", id: "address", placeholder: "Address.." %>
</div>
</div>
<div class="form-row">
<%= f.label :location, class: "col-lg-2 col-form-label" %>
<div class="col-4">
<%= f.text_field :city, class: "form-control", id: "city", placeholder: "City.." %>
</div>
<div class="col-4">
<%= f.text_field :state, class: "form-control", id: "state", placeholder: "State.." %>
</div>
<div class="col-2">
<%= f.text_field :zip, class: "form-control", id: "zip", placeholder: "Zip.." %>
</div>
</div>
<div class="form-group row category-mt">
<%= f.label :category, class: "col-lg-2 col-form-label" %>
<div class="col-lg-5">
<%= f.collection_select :category_id, Category.all, :id, :name, { prompt: "Select Category" }, id: "category_select", class: "form-control #{'is-invalid' if has_error?(#contact, :category) }" %>
<% if has_error?(#contact, :category) %>
<span class="text-danger">
<%= get_error(#contact, :category)%>
</span>
<% end %>
</div>
<div class="col-lg-3">
<a class="btn btn-outline-secondary add-category-button btn-block mt-1" href="#" id="add-category-btn">Add Category</a>
</div>
</div>
<div class="form-group row" id="add-new-category">
<label class="col-lg-2 col-form-label" for="location">New Category:</label>
<div class="col-lg-10">
<div class="input-group">
<input id="new-category" name="new-category" class="form-control <%= 'is-invalid' if has_error?(#category, :name) %>" placeholder="Enter category name" type="text">
<% if has_error?(#category, :name) %>
<span class="text-danger">
<%= get_error(#category, :name)%>
</span>
<% end %>
<div class="input-group-append">
<button class="btn btn-outline-secondary category-btn" id="save-new-category-btn" type="button"><i class="fa fa-check"></i></button>
</div>
</div>
</div>
</div>
<div class="form-group row">
<%= f.label :note, class: "col-lg-2 col-form-label" %>
<div class="col-lg-10">
<%= f.text_area :note, class: "form-control", id: "note", placeholder: "Note..", rows: "3" %>
</div>
</div>
</div>
<div class="card-footer">
<%= f.submit "Save", class: "btn btn-primary border-button mb-3 ml-3", id: "save-btn" %>
<a class="btn btn-outline-secondary border-button mt-n3" data-dismiss="modal" href="#" id="cancel-btn">Cancel</a>
</div>
</div>
<% end %>
As you can see here I place some rails validation codes which already exist on contacts model. For instance:
<%= f.text_field :name, class: "form-control #{'is-invalid' if has_error?(#contact, :name) }", id: "name", placeholder: "name.." %>
Which will add the class is-invalid if there are any errors. And this also:
<% if has_error?(#contact, :phone) %>
<span class="text-danger">
<%= get_error(#contact, :phone)%>
</span>
<% end %>
Which will simply print the error text at the bottom if there's an error. Here's the helper codes for that:
def has_error?(resource, field)
resource.errors.messages[field].present?
end
def get_error(resource, field)
msg = resource.errors.messages[field]
field.to_s.capitalize + " " + msg.join(' and ') + '.'
end
So, basically I am working on two tables here: Contact and Category. So far what am I verifying on my form are mostly contacts. I have this feature here where in user can add NEW CATEGORY right on the spot via ajax which is a foreign key on the contacts table which can also be seen on the code above.
Now, on my understanding, I can also add a validation on models. So I tried to put some validation on my category:
validates :name, uniqueness: true
I was hoping that this will validate the uniqueness of the new category being output, meaning if the text (category name) already exist on the database it must prohibit it and throw an error. So what I did is I tried the following code to display the error:
<input id="new-category" name="new-category" class="form-control <%= 'is-invalid' if has_error?(#category, :name) %>" placeholder="Enter category name" type="text">
<% if has_error?(#category, :name) %>
<span class="text-danger">
<%= get_error(#category, :name)%>
</span>
<% end %>
And so I thought it will work however it just throw an error saying
undefined method errors' for nil:NilClass which is I thought it should work since I am using #category but then I realize it's a form for #contact.
Is there a better way to make this work and display the error on the add new category field? I am really stuck on this. I hope someone can help me.
You can get categories errors through f object
<% f.object.categories.each do |category| %>
<input id="new-category" name="new-category" class="form-control <%= 'is-invalid' if has_error?(category, :name) %>" placeholder="Enter category name" type="text">
<% if has_error?(category, :name) %>
<span class="text-danger">
<%= get_error(category, :name)%>
</span>
<% end %>
<% end %>

Three forms for one object in a modal

I have a webpage with a list of offices. Currently I'm trying to make three forms for editing/adding/deleting an office. This is what I have:
A model:
class ChangeOfficeAddress < ApplicationRecord
belongs_to :office
belongs_to :insurer
belongs_to :city
VALID_EMAIL_REGEX = /\A[\w+\-.]+#[a-z\d\-.]+\.[a-z]+\z/i
validates_presence_of :email
validates_format_of :email, with: VALID_EMAIL_REGEX
validates_presence_of :edit_office_address
validates_presence_of :add_office_address
validates_presence_of :delete_office_address
validates_presence_of :city_id
validates_presence_of :insurer_id
validates_presence_of :name
end
In a view I have my modals in partials:
<div id="addModal" class="modal fade" role="dialog" tabindex="-1" aria-hidden="true">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<div class="text-center">
<div class="btn-group topbar header-buttons" role="group" aria-label="...">
<%= link_to 'Add', '#', class: 'btn btn-default disabled' %>
<%= link_to 'Edit', '#editModal', { 'class' => 'btn btn-default', 'data-toggle' => 'modal', 'data-dismiss' => 'modal' } %>
<%= link_to 'Delete', '#deleteModal', { 'class' => 'btn btn-default', 'data-toggle' => 'modal', 'data-dismiss' => 'modal' } %>
</div>
</div>
</div>
<div class="modal-body">
<%= form_for (#change_office_address), remote: true, format: :json, html: { class: :contact_form } do |f| %>
<div id="error_explanation" style='display:none;' class="bg-danger text-danger alert fade in alert-danger alert-dismissable errors">
<ul>
<% if #change_office_address.errors.any? %>
<% #change_office_address.errors.full_messages.each do |msg| %>
<li><%= msg %></li>
<% end %>
<% end %>
</ul>
</div>
<%= f.text_field :name, placeholder: 'Name', class: 'form-control' %>
<br>
<%= f.text_field :email, placeholder: 'e-mail', class: 'form-control' %> <br>
<%= f.label :city_id %>
<%= f.collection_select :city_id, City.order(:name), :id, :name,
{ include_blank: true }, { class: 'form-control' } %>
<br>
<%= f.label :insurer_id, 'Insurer' %>
<%= f.collection_select :insurer_id, Insurer.order(:short_name), :id, :short_name,
{ include_blank: true }, { class: 'form-control' } %>
<br>
<%= f.text_area :add_office_address, placeholder: 'Add address', class: 'form-control', cols: '30',
rows: '5' %> <br>
<div class="text-center">
<%= f.submit, class: 'btn btn-default' %>
</div>
<% end %>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
And two other modals, the only differences between them is that :add_office_address is substituted with :edit_office_address and :delete_office_address.
When there are no validations in the model, the form submits, and everything is Ok, but when I add validations to :add_office_address, :edit_office_address and :delete_office_address, the validation doesn't pass, cause these fields(I mean :edit_office_address, :delete_office_address or :add_office_address) are blank.
How can I make different forms? Thanks ahead!
For some context, what are the reasons for different fields for [add|edit|delete]_office_address?
However, to solve your issue, you should probably do something like:
class ChangeOfficeAddress < ApplicationRecord
belongs_to :office
belongs_to :insurer
belongs_to :city
VALID_EMAIL_REGEX = /\A[\w+\-.]+#[a-z\d\-.]+\.[a-z]+\z/i
validates_presence_of :email
validates_format_of :email, with: VALID_EMAIL_REGEX
validates_presence_of :edit_office_address, if: :edit_office_address_changed?
validates_presence_of :add_office_address, if: :add_office_address_changed?
validates_presence_of :delete_office_address, if: :delete_office_address_changed?
validates_presence_of :city_id
validates_presence_of :insurer_id
validates_presence_of :name
end
Let me know if that works.

Rails save not working on gem cocoon with different edit form

Friends , I have a model order that has many details. I am using the cocoon gem to generate forms . They render ok but are not saving . I click the button to save and nothing happens , and rails console shows nothing. The default edit form, called detail_fields saves with no problem. But i had to create this one called detail_fields_dev, and this one is not working. Can someone help?
routes.rb
resources :details
resources :orders
get '/orders/:id/devolucao' => 'orders#devolucao' , as: 'devolucao_order'
put '/orders/:id' => 'orders#update'
patch '/orders/:id' => 'orders#update'
orders_controller, is ok, using the default rails code. I created this action to call the detail_fields_dev form:
def devolucao
# #order = Order.find(params[:id])
end
The details params are ok too:
def order_params
params.require(:order).permit(:customer_id, :valor_total, :valor_total_dev, :item_total, :item_total_dev,:tipo,:descontado,:order_num, details_attributes: [:id,:order_id, :cod_produto, :desc_produto, :cod_cor, :desc_cor, :desc_tamanho,:preco,:quantidade,:quantidade_dev,:total, :total_dev,:barcode, :_destroy])
end
Order view:
_form_devolucao.html.erb
<%= simple_form_for(#order) do |f| %>
<%= f.error_notification %>
<div class="form-inputs form_fixed">
<%= f.input :customer, :as => :hidden %>
<%= f.input :tipo, :as => :hidden %>
<%= f.input :descontado, :as => :hidden %>
<%= f.input :valor_total, :as => :hidden %>
<%= f.input :item_total, :as => :hidden %>
<%= f.input :order_num, :as => :hidden %>
<div class="row">
<form action="#" method="post">
<div class="small-6 medium-3 columns leitor_dev">
Código de barras
(Leitor):
<input class = "cod_barras_dev" type="text" name="cod_barras_dev" value="" />
</div>
</form>
<div class="small-5 columns end not_found">
<span class="not_found">Produto não existe neste pedido!</span>
</div>
</div>
</div>
<div class="row">
<div class="small-12 columns">
<hr/>
<div id="details">
<%= f.simple_fields_for :details do |detail| %>
<%= render partial: "orders/detail_fields_dev", locals: {f: detail} %>
<% end %>
</div>
<hr/>
</div>
</div>
<div class="row">
<div class="small-12 columns">
<div class="form-actions container">
<%= link_to_add_association '+ ítens', f, :details, data: {"association-insertion-method" => :before, "association-insertion-node" => ".container " },:class => "button tiny radius add" %>
<br />
<br />
<br />
</div>
</div>
</div>
<div class="row">
<div class="small-6 medium-2 columns">
<%= f.button :submit, "Salvar" %>
</div>
<div class="small-6 medium-2 columns end">
<%= link_to 'Cancelar', orders_path, :class => "button alert"%>
</div>
</div>
<% end %>
And the partial orders/detail_fields_dev.html.erb
<div class="nested-fields">
<div class="row listCod" data-cod="<%= f.object.barcode %>">
<div class="small-6 columns show-for-small-only">
<%= f.input :barcode, label: "Cod Barras", input_html: { class: 'barcode_ror_dev' } %>
</div>
<%= f.input :order_id, :as => :hidden, input_html: { class: 'order_id_ror_dev' } %>
<div class="show-for-medium-up small-2 columns">
<%= f.input :cod_produto, label: "Produto", input_html: { class: 'cod_produto_ror_dev' } %>
</div>
<%= f.input :desc_produto,:as => :hidden, input_html: { class: 'desc_produto_ror_dev' } %>
<%= f.input :cod_cor,:as => :hidden, input_html: { class: 'cod_cor_ror_dev' } %>
<div class="small-2 show-for-medium-up columns">
<%= f.input :desc_cor,label: "Cor", input_html: { class: 'desc_cor_ror_dev' } %>
</div>
<div class="small-2 show-for-medium-up columns">
<%= f.input :desc_tamanho,label: "Tam", input_html: { class: 'desc_tamanho_ror_dev' } %>
</div>
<div class="small-2 show-for-medium-up columns">
<%= f.input :preco,label: "Preço",input_html: { class: 'preco_ror_dev' } %>
</div>
<div class="small-6 medium-2 columns">
<%= f.input :quantidade_dev,label: "Qtd Dev", input_html: { class: 'quantidade_ror_dev' } %>
</div>
<div class="show-for-medium-up medium-2 columns end">
<%= f.input :total_dev,label: "Total Dev",input_html: { class: 'total_ror_dev' } %>
</div>
<div class="small-1 columns end">
<%= link_to_remove_association "-", f, :class => "button tiny alert remove"%>
</div>
</div>
</div>
Output:
!(http://imgur.com/kVPpwY6)

Resources