In rails 3.2.9, i am using bootstrap's wysihtml5 editor to one textarea field but in IE9 i am not getting that field's(textarea) value. I am loading a form via ajax to preview this text field's details before saving it. In IE-10 it is working fine.
In application.js
//= require bootstrap-wysihtml5
In application.css
*= require bootstrap-wysihtml5
While serializing the form i am not getting text field's value
form_data = jQuery("#form_id").serialize();
jQuery.ajax({type :'POST', url : '/user/preview.js?', data : form_data});
In views,
<%= f.input :description, :as=>:text, :label =>false, :required => false, :placeholder=>"Description", :input_html=>{:rows=>"10", :class=>"texteditor", :style=>"width: 520px;"} %>
In script,
function loadTextEditor(){
$('.texteditor').wysihtml5();
}
window.onload = loadTextEditor();
How do i get texteditor's value before saving it via ajax. Please help me to solve this issue.
Did you try to look the error on inspect element > console?
Always use the editor object to get the value of the textarea:
$('.texteditor').data("wysihtml5").editor.getValue();
Related
I have a textarea in my view page and I am using rails fckeditor plugin for converting it into WYSIWYG editor. I need to set the default value for the textarea. How it is possible.I have written like this.. Please help
<%= fckeditor_textarea :reminder, :body,:lang => I18n.locale,:langdir => (rtl? ? 'rtl' : 'ltr') %>
I have a Rails project using simple_form and I can't seem to get the date picker to work (using the Bootstrap Datepicker gem https://github.com/Nerian/bootstrap-datepicker-rails.
I have tried what's been proposed in the following stack overflow posts:
How do i write a cleaner date picker input for SimpleForm
Add datepicker with rails 3.2.11, simple_form and bootstrap
Changes in the form are not saved to database
But, so far none of them have worked.
Here is my code:
In my View I have this:
<%= f.input :start_date, :input_html => {data: {behaviour: "datepicker"}}, :as => :string %>
I have added the following to Application.js
//= require bootstrap-datepicker
$(function() {
$('input.datepicker').datepicker();
});
I have added the following to Application.css
*= require bootstrap-datepicker
I've even tried putting the js code directly on the page and it still doesn't work.
Any ideas? I'm stumped.
Thanks
Your function assigning the datepicker behavior searches for inputs with class 'datepicker'. Your inputs must have this class.
Use the following:
<%= f.input :start_date, :input_html => {class: 'datepicker', data: {behaviour: "datepicker"}}, :as => :string %>
I have an submit_tag or input button, however you wanna call it, but I can't get the Text + Font-Awesome icon to work together.
I tryied like this
%input{type: "submit", name: "A", "data-theme" => "b"}
%i.icon-time
= "Finish"
But the icon and the text are outside the input tag( ... )
I tryied to use
= content_tag :input, type: "submit", name: "A", "data-theme" => "b" do
%i.icon-time
= "Finish"
but the same problem, the %i was left outside.
with button_tag it looks good, but the content is not submitted to the controller. ( maybe because the html tag is button and not input )
How can I get this working?
Check your console for any errors. I feel like you may just have a css problem. If the button tag works for you, you could easily add a jquery fix.
$('button').click(function() {
$('form').submit();
});
From what I can see that is the only fix for nesting content inside of a form submit.
P.S. You don't have to write = "Finish", you could just write Finish!, HAML will insert it as plain text wither way.
In the application.html.haml I have the following
= javascript_include_tag "application"
= javascript_include_tag "disable_ajax"
In the application.js
//= require jquery.mobile-1.3.0
In the disable_ajax.js
$( document ).bind( 'mobileinit', function(){
$.mobile.ajaxEnabled = false; // Here is where I fix the problem
});
The key is to include the jquery mobile first
I'm using Bootstrap-sass and formtastic in my Rails application, and I'm not sure why the bootstrap-typeahead feature isn't working.
Form partial:
<%= f.input :tag, :input_html => { :'data-provide' => "typeahead", :'data-source' => '["hello", "hellow", "heaven", "helo", "herr"]' } %>
application.js manifest:
//= require bootstrap-typeahead //typeahead is correctly loaded, checked with firebug
result HTML source code:
<input :data-minLength="2" data-provide="typeahead" data-source="["hello", "hellow", "heaven", "helo", "herr"]"
In the end, I will need to customize typeahead to get the performance I want, but even this simple javascript isn't working for some reason. I cant find anything wrong with the code. Could anyone help me?
UPDATE:
I tried it in the javascript way as follows:
<script> //call typeahead
$(function() {
$('input#type_ahead').typeahead({
'source' : ["hello", "heaven", "heythere"]
});
})
</script>
<%= f.input :tag_list, :input_html => { :id => "type_ahead" }, %> //input tag
And still it seems like typeahead fails to work. i.e) typing in "he" does not get me a dropdown of those three items in the above array. Does anyone have an idea?
I think you need to set html_safe for:
{ :'data-source' => '["hello", "hellow", "heaven", "helo", "herr"]'.html_safe }
Have you called the typeahead() method when your page loads? You need to do something like this;
$(function() {
$('input').typeahead();
})
You'll need to assign a class or id to your input to bind the typeahead to it specifically (Rails probably has assigned an id to it automatically, I'm presuming you've omitted it specifically)
$(function() {
$('input#my-tag-field-with-a-cool-typeahead').typeahead();
})
edit:
The following worked for me. It'll take a bit of modification to the rails part to fit your situation, but this definitely works.
<script>
$(function() {
$('input#type_ahead').typeahead()
}
</script>
<%= text_field_tag :test_type, '', data: {provide: 'typeahead', source: "['hello','heythere','heaven']"} %>
I am using the typeahead js extension from twitter bootstrap for an autocomplete field. I have a subtle problem with that. I have a text field like :
<%= text_field_tag :search, params[:search], :data => { :provide => 'typeahead', :source => ...} %>
The problem is that i have to specify name='search' (with :search), in order to be able to grab the text input search value. However, if i do so, the browser automatically creates an autocomplete history of the entries i have already tried in my text field.
If i remove :search and replace with '', the browser cannot 'save' the history, because there is no name attribute on the text field. However, this way, i cannot get the inputted value myself.
How can i work around this ?
When I use autocomplete from jquery-ui, it sets the attribute autocomplete="off" in the input tag, so you might try including the option :autocomplete=>"off". The field doesn't show any inputs from the history, just what was passed in to autocomplete.
If that doesn't work, just try jquery-ui's autocomplete instead. It definitely works.