What is a better way of collection_select for large datasets? - ruby-on-rails

Currently, I have a model with 100+ records. I have a second model that has_one of the first model. In my form to create the second model, I'm using collection_select calling the first model. The user ends up having to scroll and look through each record. Is there a searchable collection_select or some other form helper that would make this a better experience? Below is my current solution:
<%= form.collection_select :thing_id, Thing.all, :id, :name, {class: "form-control"} %>
_form.html.erb
<%= form_with(model: order) do |form| %>
<% if order.errors.any? %>
<div style="color: red">
<h2><%= pluralize(order.errors.count, "error") %> prohibited this order from being saved:</h2>
<ul>
<% order.errors.each do |error| %>
<li><%= error.full_message %></li>
<% end %>
</ul>
</div>
<% end %>
<div class="form-group">
<%= form.label 'Status:' %>
<%= form.collection_select :order_status_id, OrderStatus.all, :id, :status, #order.persisted? ? {class: "form-control"} : {:selected => 1}, {class: "form-control"} %>
</div>
<div>
<%= form.label :subject, style: "display: block" %>
<%= form.text_field :subject %>
</div>
<div>
<%= form.label :body, style: "display: block" %>
<%= form.text_area :body %>
</div>
<div>
<%= form.label 'Asset:' , style: "display: block" %>
<%= form.collection_select :thing_id, Thing.all, :id, :name, {class: "form-control"} %>
</div>
<div class="form-group">
<%= form.label :assigned_to %>
<%# form.collection_select :assigned_to_id, User.all, :id, :email, {:include_blank => true}, {class: "form-control"} %>
<%= form.collection_select :assigned_to_id, User.all, :id, :email, {:prompt => true}, {class: "form-control"} %>
</div>
<div class="mb-3">
<%= form.label :images, class: "form-label" %>
<%= form.file_field :images, {multiple: true, class: "form-control", id: "formFileMultiple", type: "file"} %>
</div>
<%= form.hidden_field :requested_by_id, value: current_user.id %>
<div>
<%= form.submit %>
</div>
<% end %>
I'd be happy to include any other code if requested.

You could use select2
Select2 is a jQuery replacement for dropdown boxes and it contains a searchbox to filter through data and other features too such as lazy loading dropdown options. Check it out
https://select2.org/getting-started/basic-usage

Related

How to get the value of previous select option in form_for rails?

<%= form_for #bug do |f| %>
<div class="form-group">
<%= f.label :description %>
<%= f.text_field :description %>
</div>
<div class="form-group">
<%= f.label :Bug_Type %>
<%= f.select :bugtype, [["Feature","Feature"], ["Bug","Bug"]], required: true %>
</div>
<div class="form-group">
<% if f.object.bugtype == 'Feature' %>
<%= f.label :Bug_Status%>
<%= f.select :status,
[
["New","New"],
["Started","Started"],
["Resolved","Resolved"]
],
required: true %>
<% else %>
<%= f.label :Bug_Status %>
<%= f.select :status,
[
["New","New"],
["Started","Started"],
["Completed","Completed"]
],
required: true %>
<% end %>
</div>
<%= f.submit %>
<% end %>
I have this code in my form. I want to know the value user selects for :bugtype, in order to display status accordingly. I am not able to access value of bugtype using instance variable or f.object.bugtype

Rails: Saving Parent and Child simultaneously with nested forms

I have an Event model and a Packages model:
# event.rb
belongs_to :organization, optional: true
belongs_to :event_type, optional: true
has_many :packages
has_many :collaborations
has_many :messages, through: :collaborations
has_many :forms, through: :collaborations
# package.rb
belongs_to :event
has_many :package_collaborations
has_many :collaborations, through: :package_collaborations
I want the user to be able to create an Event and Packages at the same time with a nested form like this:
These are my two forms:
#_event_form.rb (simplified for easier reading)
<%= form_for(event) do |f| %>
<%= render 'shared/error_messages', object: f.object %>
<br>
<div class="form-group">
<%= f.label :title %>
<%= f.text_field :title, class: 'form-control' %>
</div>
<% if f.object.new_record? %>
<%= f.hidden_field :status, value: 'upcoming' %>
<% else %>
<div class="form-group">
<%= f.label :attendee_count %>
<%= f.number_field :attendee_count, class: 'form-control' %>
</div>
<div class="form-group">
<%= f.label :status %>
<%= f.select :status, [['Upcoming','upcoming'],['Completed','completed']], {}, class: 'form-control' %>
</div>
<% end %>
<hr>
<div class="form-group required">
<%= f.label :started_at, 'Starts' %>
<div class='input-group date form_datetime'>
<% if event.started_at.present? %>
<%= f.text_field :started_at, class: 'form-control', value: event.started_at.strftime("%m/%d/%Y %H:%M %p") %>
<% end %>
</div>
</div>
<div class="form-group required">
<%= f.label :ended_at, 'Ends' %>
<div class='input-group date form_datetime'>
<% if event.ended_at.present? %>
<%= f.text_field :ended_at, class: 'form-control', value: event.ended_at.strftime("%m/%d/%Y %H:%M %p") %>
<% end %>
</span>
</div>
</div>
<%= f.hidden_field :platform_type, value: "a_platform" %>
<hr>
<%= render 'packages/package_form', event: #event %> # <--- Nested form here.
<div class="actions" id="listen-for-hover">
<%= f.submit 'Save', class: 'btn btn-primary', :id => "event-create-button" %>
</div>
<% end %>
#_package_form.rb
<%= form_for([#event, #package]) do |f| %>
<%= render 'shared/error_messages', object: f.object %>
<%= f.hidden_field :kind, value: params[:kind] if f.object.new_record? %>
<div class="form-group required">
<%= f.label :Your_offer_?, "Your Offer?" %>
<%= f.text_area :offering, class: 'form-control', :placeholder => "e.g. Your logo on stuff" %>
</div>
<div class="form-group">
<%= f.label :notes %>
<%= f.text_area :notes, class: 'form-control', :placeholder => "Notes here" %>
</div>
<hr>
<div class="actions">
<%= f.submit 'Submit', class: 'btn btn-primary', id: 'package-submit-button', disabled: true %>
</div>
<% end %>
Using the form this way results in this error:
Extracted source (around line #3):
1 <%# remoteFlag = false %>
2 <%# remoteFlag = true if #event.title == "dummy event" %>
3 <%= form_for([#event, #package]) do |f| %>
4 <%= render 'shared/error_messages', object: f.object %>
Obviously this is because #event hasn't been created yet so there isn't an ID for it. What would be the best way to make this nested form that is used to make new Event/Packages (new Objects with no ID) at the same time or Edit existing (Existing objects with IDs) ones by using the partial in another part of the app?
You need to add
accepts_nested_attributes_for :package
to your Event model (in event.rb). Then, in the 'new' method of your events controller, add
#package = #event.packages.build
In your form, you will need to use the fields_for method. There is an excellent Railscast on this whole process here: http://railscasts.com/episodes/196-nested-model-form-part-1
If you're not familiar with Ryan Bates' Railscasts, I highly recommend you spend some time with them.
You can use the 'build' method for creating an empty 'package' in your 'event'. There is an example on the official RoR guides
E.g.
<%= form_for([#event, #event.packages.build]) do |f| %>

search for select in rails

I have a rails app where user can assign task to another user by creating task action. At the moment I have the f.collection_select, but as the number of users grows it won't be a good solution. I would like to change it into kinda search form. My problem is that I don't see how I can do this. I have other search forms, but those are for show/index action. How can I do this for the create action?
here is my current code:
<%= form_for ([#user, #task]) do |f| %>
<%= render 'layouts/error_messages', object: f.object %>
<div class="field form-group">
<%= f.label :executor_id %>
<%= f.collection_select(:executor_id, User.all, :id, :email, class: "form-control") %>
</div>
<div class="field form-group">
<%= f.label :content %>
<%= f.text_area :content, class: "form-control" %>
</div>
<div class="field form-group">
<%= f.label :deadline %>
<%= f.date_select :deadline, class: "form-control" %>
</div>
<div class="actions">
<%= f.submit "Create Task", class: 'btn btn-primary', "data-sid" => current_user.id, "data-rip" => :executor_id %>
</div>
<% end %>

Ruby on Rails - How to make one form action create two entries in differents tables

Im creating a match, that contains maps (you can see in the 5th line)
<%= form_for(#match) do |f| %>
<%= f.datetime_select :time %> </div>
<%= f.collection_select(:event_id, Event.all, :id, :name) %>
<%= f.number_field :best_of, min: 1, :style => "width: 50px;", :class => "bo-input" %>
<%= collection_select(:round, :map_id, Map.all, :id, :display_name) %>
<%= f.submit %>
<% end %>

Rails 4 - How to populate remote content in a form?

Here is what I have
I have a method like this in my bookmarks_controller.rb
def fetch
#result = LinkThumbnailer.generate(params[:url])
end
I have the following form fields to create new bookmarks
url
title
description
thumbnail
tags
So my new.html.erb looks like this
<%= form_for(#bookmark, :html => {class: "panel-body"}) do |f| %>
<% if #bookmark.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(#bookmark.errors.count, "error") %> prohibited this bookmark from being saved:</h2>
<ul>
<% #bookmark.errors.full_messages.each do |msg| %>
<li><%= msg %></li>
<% end %>
</ul>
</div>
<% end %>
<div class="block">
<%= f.label :url, :class => 'control-label' %>
<%= f.text_field :url, :class => 'form-control', :placeholder => 'URL' %>
</div>
<div class="block">
<%= f.label :title, :class => 'control-label' %>
<%= f.text_field :title, :class => 'form-control', :placeholder => 'Title' %>
</div>
<div class="block">
<%= f.label :description, :class => 'control-label' %>
<%= f.text_area :description, rows: 6, :class => 'form-control', :placeholder => 'Description' %>
</div>
<div class="block">
<%= f.label :thumbnail, :class => 'control-label' %>
<%= f.text_field :thumbnail, :class => 'form-control', :placeholder => 'Thumbnail url' %>
</div>
<div class="block">
<%= f.label :tag_list, :class => 'control-label' %>
<%= f.text_field :tag_list, :class => 'form-control', :placeholder => 'Tags (separated by commas)' %>
</div>
<div class="actions">
<%= f.submit :class => "btn btn-info" %>
</div>
<% end %>
I would like to have a button called Fetch right next to url field.
When user click Fetch button, I would like to populate the form fields using ajax.
I viewed rails documentation. It says to add remote: true attribute to the form.
But I wanna use ajax function only when the user click fetch button.
Can someone help me with this?
Thankyou
You can generate an object using the LinkThumbnailer gem and than convert it to json
with this action:
def fetch
#result = LinkThumbnailer.generate(params['given_url'])
respond_to do |format|
format.json do
result.to_json
end
end
end
And in your view you could use the Jquery getJSON method to access the #fetch action and pass the given url as a parameter:
<script type="text/javascript">
require(['jquery'], function($) {
$('.fetch-button-class').change(function() {
var given_url = $('.url-class').val();
$.getJSON('<%= fetch_action_url %>', {'given_url': given_url }, function(obj) {
$('.title-class').val(object.title);
$('.description-class').val(object.description);
});
});
});
</script>

Resources