I am new to spree and ckeditor integration.
I want to integrate ckeditor to the spree admin. I could configure ckeditor correctly with rails_admin section of my website (following the steps in https://github.com/galetahub/ckeditor), but now i want to add it to a field in the product edition page in the spree admin
The field is:
<div data-hook="admin_product_form_description">
<%= f.field_container :description, class: ['form-group'] do %>
<%= f.label :description, Spree.t(:description) %>
<%= f.text_area :description, { rows: "#{unless #product.has_variants? then '20' else '13' end}", class: 'form-control' } %>
<%= f.error_message_on :description %>
<% end %>
</div>
I changed f.text_area to f.cktext_area but it didn't work...
Do you have any experience with this matter ?
Thanks!
I finally found the trick.
You have to load the ckeditor javascript for the spree admin views.
For that add to spree_backend-3.0.0/app/views/spree/admin/shared/_head.html.erb (Via Deface or Override) the following line.
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
And then simply you change your text area form f.text_area to f.cktext_area
Obviously, you have to follow before the steps to integrate ckeditor to your project. (https://github.com/galetahub/ckeditor)
Related
I am trying to implement the country_select gem (gem 'country_select','~> 2.1.0') in a Rails 4 app without success. This is the code in my form. I have tried several permutations of this from similar questions on stack without success. I don't understand why I am getting the error -
"undefined method `input' for ActionView::Helpers::FormBuilder:0x007fafb5878c48>"
Bear in mind that I am a Rails beginner.
<%= form_for(#user, html: { multipart: true }) do |f| %>
<%= f.label :country %><br>
<%= f.input :country, as: :country %>
<%= f.submit "Update my account", class: "btn btn-primary" %>
<% end %>
I have also tried
<%= f.label :country %>
<%= f.country_select :country %>
from the documentation. 'country' is one of my user attributes.
Any guidance would be welcome on the newbie problem.
I have just spent an hour on the same problem and am annoyed at the brevity of the github documentation. Nevertheless, this worked for me and it sounds like what you need:
<%= f.country_select(:country, {selected: #user.country}, {class: "form-control"}) %>
I couldn't get the second parameter (see https://github.com/stefanpenner/country_select) to work - it gave me an error every time I tried to add anything else before the {selected...}.
<%= f.country_select :country, {priority_countries: ["SG", "US"], include_blank: "select country"}, class: 'form-control' %>
This worked for me, the first :country is an attribute of user, all the options of country_select gem will come as the next parameter and the last param will take the class name and other format features.
If the param contains a single field it can be passed with or without brackets.
I have a problem with my nested_form, now when I click on my link_to_add button, three forms are displayed... It is the same for all my nested forms and this is new. I really don't know the reason, any idea ?
My code :
<div id="new_upload">
<%= f.fields_for :uploads do |file| %>
<%= file.label :filename, 'Nom pièce jointe :'%>
<%= file.text_field :name, :size => "19", :id=>"field" %>
<%= file.file_field :file if file.object.new_record? %>
<%= file.link_to_remove "Supprimer" %>
<% end %>
</div>
<%= f.link_to_add "Ajouter pièce jointe", :uploads, :class=>"btn" %>
</div>
This issue is linked with Rails 4 and Turbolinks. See https://github.com/ryanb/nested_form/issues/307 for instance.
You should be able to add data-no-turbolinks to your div to locally disable turbolinks.
With me it was because the application.js was called in the body instead of head. Duh! See https://github.com/ryanb/nested_form/issues/286
I decided on using bootstrap-wysihtml5-rails, which is a packaged wysiwyg editor with Twitter bootstrap built in. My question is about how to "activate" the editor inside the form which I created with the form_for helper.
I have the following form which I would like to use the wysiwyg editor in:
<%= form_for(#question) do |f| %>
<%= f.label :title, "Title" %>
<%= f.text_field :title %>
<%= f.label :content, "Content" %>
<%= f.text_area :content %> <!-- make this into wysiwyg editor -->
<%= f.submit "Create question", class: "btn btn-large btn-primary" %>
<% end %>
The instructions noted to simply add the following:
<textarea id="some-textarea" class='wysihtml5' placeholder="Enter text ..."></textarea>
<script type="text/javascript">
$('.wysihtml5').each(function(i, elem) {
$(elem).wysihtml5();
});
</script>
However, I am a bit lost about how I could toggle just my text_area section to make it into a wysiwyg. I looked into the Rails guide for form_for, but didn't see how I could insert javascript or even apply a css class to a particular field. Thanks for your help.
Add html class 'wysihtml5' to any text_area you want to implement the editor on.
<%= f.text_area :content, class: 'wysihtml5' %>
You can either paste the script inline as suggested, or put a global initializer at app/assets/javascipts/application.js:
$(function() {
$('.wysihtml5').each(function(i, elem) {
$(elem).wysihtml5();
});
})
I've got a Rails app that is using TinyMCE, via the TinyMCE-Rails gem. I'm trying to use the maxchars plugin to get word count going. I've added the plugin to config/tinymce.yml
plugins:
- fullscreen
- maxchars
And I've added the max_chars and max_chars_indicators to my view.
<%= simple_form_for #project |f| %>
<%= f.input :overview, input_html: { :class => "tinymce", :rows => 70, :cols => 140 } %>
<%= tinymce max_chars: 6000, max_chars_indicator: "characterCounter" %>
<div id="characterCounter">
</div>
<div class="form-actions add-top">
<hr>
<p>
<%= f.button :submit, :class => 'inline-block large_button add-bottom' %>
</p>
</div>
<% end %>
But now the editor doesn't even appear. Is there something I'm missing when it comes to adding this plugin?
Complex solution for this problem: had to actually read the documentation! (Outrageous, right?!)
I had neglected to actually download the plugin files. I created a directory, app/assets/javascripts/tinymce/plugins/ and popped in the folder containing the necessary JS files. Once I started my server, everything worked great.
I have CarrierWave (0.6.1) and Nested Form gem installed. I have a Resource model with many Attachments which have a FileUploader.
I have a nested form where users can upload multiple files with one resource. I am following the section on github (https://github.com/jnicklas/carrierwave) that says how to make uploads work across redisplays unfortunately it's only for 1:1 ratio.
Here's the code that I have:
<%= nested_form_for #resource, :html=>{:multipart => true } do |f| %>
<p>
<%= f.label :title %>
<%= f.text_field :title %>
</p>
<%= f.fields_for :attachments, #attachment do |attachment_form| %>
<p>
<%= attachment_form.label :file %>
<%= attachment_form.file_field :file %>
<%= attachment_form.hidden_field :file_cache %>
<%= image_tag(attachment_form.file_url) if attachment_form.file? # DOESN'T WORK!!! %>
</p>
<%= attachment_form.link_to_remove "Remove this attachment" %>
<% end %>
<%= f.link_to_add "Add attachment", :attachments %>
<p><%= f.submit %></p>
<% end %>
Everything works and it populates the file_cache variable just fine for the attachment_form however I somehow need to add the following line in there to show the user the image of the document:
<%= image_tag(attachment_form.file_url) if attachment_form.file? %>
However there's a number of problems with this. First of all attachment_form is referencing the form_builder whereas I want the actual attachment. Second, attachment knows nothing about file.
Probably need to use another type of looping mechanism, but I'm new to Ruby so any help is appreciated.
Thanks all!
If you try this:
<%= image_tag(attachment_form.object.file_url) if attachment_form.object.file? %>
You will be able to show previous uploaded images. But if you want to display uploaded right now, you need to use something else. For example: https://github.com/blueimp/jQuery-File-Upload/wiki/jQuery-File-Upload-v4-for-Rails-3
Sorry, if I misunderstood your question.