Develop Reference

Rails emoji picker won't load for Simple_Form textarea

I'm using a gem called rails_emoji_picker to easily implement an emoji solution for my project. The gem is not loading the emoji picker inside of the textarea, even though I followed the instructions that were given. I see no errors in my javascript debugging console. How can I make the emoji picker display inside of the textarea? I'm currently using rails 5. https://github.com/ID25/rails_emoji_picker
post _form.html.erb
<div class=container">
<%= simple_form(#post, multipart: true, remote: true) do |f| %>
<div class="row">
<div class="col-6">
<p class="emoji-picker-container">
<%= f.input :body_text, class: 'form-control', label: false, id: 'text-area-reset', placeholder: 'write something', data: {emojiable: true} %>
</p>
</div>
</div>
<div class="row">
<div class="col-6>
<%= f.button :submit, 'Post it', class: 'btn btn-outline-success' %>
</div>
</div>
<% end %>
</div>

Multiple epiceditors on one page

In my project I have two forms for two locales, so I have two EpicEditors on one page. However, it does not work well.
_form.html.erb
<div id="tabs-1">
<%= f.globalize_fields_for :ru do |g| %>
<div class="form-inputs">
<%= g.input_field :title, placeholder: t('.course_title') %>
<div id="epiceditor">
</div>
<%= g.input_field :description, id: "epiceditor-textarea" %>
</div>
<% end %>
</div>
<div id="tabs-2">
<%= f.globalize_fields_for :en do |g| %>
<div class="form-inputs">
<%= g.input_field :title, placeholder: t('.course_title') %>
<div id="epiceditor">
</div>
<%= g.input_field :description, id: "epiceditor-textarea" %>
</div>
<% end %>
</div>
<div class="form-actions">
<%= f.button :submit, t('.save'), class: "pull-right" %>
</div>
application.js
function LoadEditor(element) {
new EpicEditor({
container: element,
textarea: '#epiceditor-textarea',
theme: {
preview: '/assets/application.css'
}
}).load();
}
$("#epiceditor").each(function(index, element) {
LoadEditor(element)
});
What can you suggest I do?
Of course I can call method LoadEditor two times, but I think it is not a good solution, because then I will add more locales, maybe.
Using this code I have error:
Uncaught TypeError: Cannot read property 'value' of null

I have given a detailed answer at https://stackoverflow.com/a/35285968/936494. It shows passing custom options and how to use that to instantiate EpicEditor. Please have a look at it and try using the code given. I am sure it will be helpful.

Put html param into Rails array parameter

Ruby on Rails 4.1
The form is placing the parameters into an array when POST is done. I am making a script to auto fill the billing address the same as the shipping address. When the script runs it is assigning the values as html values.
How do you put these values into the payment array being sent?
The log where cc_name and ship_name are outside the payment array, I want them inside:
Parameters: {"utf8"=>"✓", "authenticity_token"=>"x", "cc_name"=>"Bobby", "payment"=>{"telephone"=>"555", "email"=>"drfernandez1#yahoo.com", "address1"=>"641 W Rt 66", "address2"=>"", "city"=>"Glendora", "state"=>"CA", "postal_code"=>"91740", "country"=>"USA", "cc_type"=>"Visa", "cc_number"=>"5555555588884444", "ccv"=>"321", "expires_on(1i)"=>"2014", "expires_on(2i)"=>"9", "expires_on(3i)"=>"1", "ship_address1"=>"641 W Route 66", "ship_address2"=>"", "ship_city"=>"Glendora", "ship_state"=>"c", "ship_postal_code"=>"91740", "ship_country"=>"u", "card_holder_auth"=>"1", "charge_auth"=>"1", "name_auth"=>"David Duke", "date_auth"=>"7"}, "billingtoo"=>"on", "ship_name"=>"Bobby", "commit"=>"Send Payment"}
The form (minus clutter):
<%= form_for #payment do |f| %>
<%= render 'shared/payment_error_messages' %>
<h1>Fill in all blank areas with payment information:</h1>
<div class="col-md-5 col-md-offset-1">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Applicant Information</h3>
</div>
<div class="panel-body">
<%= f.label :cc_name, "Name as it appears on credit card:" %><br>
<%= f.text_field :cc_name, class: "input-lg", :name => "cc_name" %> <%#= #payment.errors.get(:cc_name) %>
<%= f.label :telephone, "Telephone Number:" %><br>
<%= f.text_field :telephone, class: "input-lg" %>
...
<div class="panel-body">
<input type="checkbox" name="billingtoo" onclick="FillBilling(this.form)"><em>Shipping Address is the same as the Billing Address</em>
<p>Please Note: This cannot be a P.O box address</p>
<%= f.label :ship_name, "Name:" %><br>
<%= f.text_field :ship_name, class: "input-lg", :name => "ship_name" %>
<%= f.label :ship_address1, "Address 1:" %><br>
<%= f.text_field :ship_address1, class: "input-lg" %>
...
<%= f.submit "Send Payment", class: "btn btn-lg btn-primary", id: "commit" %>
</div>
</div>
</div>
<% end %>
<br/>
<%= link_to 'Back', session[:last_page] %>
</div>
<script>
function FillBilling(f) {
if(f.billingtoo.checked == true) {
f.ship_name.value = f.cc_name.value;
}
}
</script>

You are overwriting the field's name:
:name => "cc_name"
That's the reason why it is sent outside of the array. Try removing the :name assigning:
<%= f.text_field :cc_name, class: "input-lg" %>
and
<%= f.text_field :ship_name, class: "input-lg" %>

Rails:In-place editing in edit form with submit button

I want to create my edit form such that it will display the current user information simply as text not in text filed and when user click on the text it will turn into text field and user can edit his information . Changes will be reflect in data base only when user click on submit button.
Simply it is not completely in place editing and not completely like default edit form it is mixture of the behaviour of both the features.
My form looks like following .it is not complete form these are some of the fields of form.
<%= form_for #contact, :html => { :multipart => true, :class => "contact_form"} do |f| %>
<% if #contact.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(#contact.errors.count, "error") %> prohibited this contact from being saved:</h2>
<ul>
<% #contact.errors.full_messages.each do |msg| %>
<li><%= msg %></li>
<% end %>
</ul>
</div>
<% end %>
<div class="field">
<%= f.label :f_name, "First Name" %><br/>
<%= f.text_field :f_name %>
</div>
<div class ="field">
<%= f.label :experience, "Total years of experience "%><br/>
<%= f.select :experience, (0...30),{},{:class => 'select'} %>
</div>
<div class="field">
<%= f.label :l_name, "Last Name" %><br/>
<%= f.text_field :l_name %>
</div>
<div class = "field">
<%= f.label :primary_practice_area, "Primary practice area" %><br/>
<%= f.select :primary_practice_area , MetaPracticeArea.all.collect {|p| [ p.practice_area, p.id ] } %>
</div>
<div class = "field">
<%= f.label :phone, "Phone" %><br/>
<%= f.text_field :phone %>
</div>
<div class="actions">
<%= f.submit :class => "submit_btn" %>
</div>
<% end %>
and controller and model is default.

You can try the REST_in_place gem: https://github.com/janv/rest_in_place

Check below link for in_place_editing :
http://railscasts.com/episodes/302-in-place-editing?view=asciicast

Using Ajax to replace a div with a partial in Rails

I'm following Ryan Bates' Railscast #136 and trying to use AJAX to replace a div ('#inviteform1') with a partial ('thankyou') after a form submission. For some reason, when the form is submitted, it's not working -- instead a blank screen appears, and the URL redirects to localhost:3000/inviterequests. What am I missing?
inviterequests_controller
def create
#inviterequest = Inviterequest.new(params[:inviterequest])
respond_to do |format|
format.js
end
end
inviterequests/create.js.erb
$("#inviteform1").hide().after('<%= j render("thankyou") %>')
inviterequests/_form.html.erb -- includes the div to be replaced
<%= simple_form_for(#inviterequest, html: { class: 'form-horizontal'}) do |f| %>
<% if #inviterequest.errors.any? %>
<div id="error_explanation">
<h3><%= pluralize(#inviterequest.errors.count, "error") %> prohibited this inviterequest from being saved:</h3>
<ul>
<% #inviterequest.errors.full_messages.each do |msg| %>
<li><%= msg %></li>
<% end %>
</ul>
</div>
<% end %>
<!-- INVITE BOX CONTENT -->
<div class="invitebox">
<div class="invitebox-inner">
<div id="inviteform1">
<br> <br> <br>
<h5> INDIAN WEDDING <BR> PLANNING JUST GOT EASIER </h5>
<%= image_tag("smalldivider.png") %>
<h5> REQUEST AN INVITE </h5>
<div class="field">
<%= f.input :email, :placeholder => 'enter your email, please', label: false %>
</div>
<div class="actions">
<%= f.submit "SUBMIT", class: "btn btn-primary btn-special", remote: true %>
</div>
</div>
</div>
</div>
<% end %>
inviterequests/_thankyou.html.erb -- the partial to replace the div
<div id="thankyou">
<br> <br> <br>
<h3>THANK YOU </h3>
<h4> We are working hard to launch soon <br> and will be in touch. </h4>
<%= image_tag("smalldivider.png") %>
<p class="smallcaps"> <br> SHARE WITH FRIENDS IN THE MEANTIME </p>
<div class="socialbuttons">
<div class="twitter">
<%= link_to (image_tag("twitter2.png")), "https://twitter.com/intent/tweet?screen_name=namastewedding&text=is%20making%20Indian%20wedding%20planning%20easy.%20I%20just%20requested%20my%20invitation.%20%23indianwedding%20www.namastewedding.com", :target => '_blank' %>
</div>
<div class="facebook">
<%= link_to (image_tag("facebook2.png")), "https://www.facebook.com/pages/Namaste-Wedding/359192570873560" %>
</div>
</div>
</div>
LOGS
Started POST "/inviterequests" for 127.0.0.1 at 2013-08-29 22:08:39 -0400
Processing by InviterequestsController#create as HTML
Parameters: {"utf8"=>"✓", "authenticity_token"=>"pqDBzdaYKuOfjuVo1ovHvrQJTTrsUptAcQekCn4X+Ho=", "inviterequest"=>{"email"=>"foobar#gmail.com"}, "commit"=>"SUBMIT"}
Completed 406 Not Acceptable in 1ms (ActiveRecord: 0.0ms)

It seems that you should use remote: true in simple_form_for instead of f.submit.
Such as
<%= simple_form_for(#inviterequest, remote:true, html: { class: 'form-horizontal'}) do |f| %>