Decimal button in RoR - ruby-on-rails

I just managed to do a decimal migration.
But all of the sudden a weird button appeared next to the field.
Any idea how i can remove it or maybe the name of that weird thing?
Its on the right side of the field. And it has arrow up and down.
(I´m very new to coding)
This is the code
<%= f.input :phone, as: :decimal, placeholder: "Phone Nr.", label: "Contact", input_html: { rows: "1"} %>
Sorry, not allowed to post images yet.

It's a numeric input from HTML5, you may see this for description.
You may control input type by setting as parameter, possible values.
For most fields you may omit it, formtastic will guess correct input type by attribute type or name.
I think it would expect the phone attribute to be of a string type. If you need some why to keep it numeric but normal phone input is required, force it with as: :phone. But then you should have some preprocessing for this value before writing it to attribute.

The weird button is a part of number input. Read here about most common input types available in HTML5. It's purpose is to enter a decimal number. HTML5 introduced new input semantics so instead of boring box your browser will render additional controllers on top of the input depending on it's type.
What you probably want is a tel input. Rails provide <%= telephone_field() %>. Here is the list of all form helpers available in Rails.
Also consider using string for your phone number and validate it on model instead

Related

Checkbox in Rails has three values which is causing issues

I'm new to Rails.
I have a situation where we have a fairly important form that we can't default answers for users as it revolves around government tax authorisation related things so our boolean answers essentially have three states:
nil -> user hasn't provided an answer
true -> User has said true
false -> User has said false
The issue I'm having in our Rails backend with this is by default the form.check_box :some_proper is defaulting the input to false when if the value is nil it needs to remain nil.
So what's happening is a whole series of nil values are changing to false when our form is submitted.
I have provided some code examples, but I can't find anyway of doing what's needed and we may just need to swap from checkboxes to select fields or something.
%dt= form.label :knowledge_intensive
%dd= form.check_box(:knowledge_intensive, {}, "1", "0")
I have attached a GIF to illustrate the issue clearer:
Demo of issue in GIF Form
The form builder adds a hidden field with the same name as your knowledge_intensive field. If you inspect the generated HTML it will appear immediately before the input for the checkbox.
The reason for this is to allow an unchecked box to pass through as false. I'm not sure how you can get around this, as this mechanism is required to pass the state as a param (HTML spec implies unchecked checkboxes aren't passed as form params). There's no easy way to have separate nil/true/false values - you are probably better off using radio buttons for that.
But that's the reason. The auxiliary hidden field is has a value of '0' and that will be interpreted as 'false' by Rails, unless the user checks the check box.
Does that make sense?

Ruby on rails: Id attribute of input elements generated by form helpers, with non english values

Some Rails form-helpers (for instance 'radio_button' helper), append the element's value to the generated id string.
But if the value is not in English - nothing gets appended to the id string. This may result in multiple elements (all with non English values) having the same id attribute.
What's the recommended way to tackle this problem ?
This is a very old post, but it's coming up first in Google so I thought I'd spare some other rails developers a bit of misery by giving a code example of how to get this to work.
<%= radio_button_tag "name", "value", false, :class => "test-class", :id => "radio-id" %>
I just spent 20 mins trying to figure out how to do it and realised I was missing the 3rd parameter (checked). Aaargh!
Rails documentation here: https://apidock.com/rails/ActionView/Helpers/FormTagHelper/radio_button_tag
You can pass your own custom id in the options hash
http://apidock.com/rails/ActionView/Helpers/FormHelper/radio_button

How to process text input data before form submit ruby on rails

I'm using rails form helper to generate form and retrieve data from users.
like this
<div class="controls">
<%= f.text_field :duration, class: "input-large" %>
</div>
however,I need this input, before its store to database 'duration' column,multiply by 10.
I have search about this and try implement a method,create a function,which multiply the value,and call it under before_save
before_save :multiply_ten, on: [ :create,:update ]
problem is,i'm not only updating this column using web page form,and also by http request send by device.by implementing this I multiply all value by 10,But I only want the web form input part multiply 10.
is there a way to do it in form css or have other tricks?
thanks
There a multiple ways to achieve what you're looking for. Since you only want to multiply duration by 10 in the case of a particular web form, I would suggest doing the multiplication at the controller level, or even at the view level, instead of at the model level.
You could have your view modify the http params before the request is made via javascript.
Or, if you'd prefer to do it at the controller level, you need a way to communicate to the controller that the submitting form is in fact the one requiring the multiplication. Example:
First, in your view, add an extra parameter via hidden input indicating that the form needs a multiplication of 10:
<%= hidden_field_tag :special_form, true %>
Then, in your controller, before you assign attributes to a new object to be saved, modify the params if params[:special_form] exists:
params[:duration] = params[:duration].to_f * 10 if params[:special_form].present?
Hope this helps!

Is it possible to have date_select with year text box?

I'm looking to create an ancestry type webpage with a date field that allows user to enter a date going back to thee digits. This makes date_select with dropdown boxes and the jquery datepicker very un-user friendly.
Does anyone know a good way to display a text box for the year but a dropdown for month and day?
I'm hoping to use the "intelligence" of date_select while still allowing the user to enter the year in a more user friendly fashion (the textbox).
Thanks for any help you can give me!
With great respect to the developers of Rails, the date_select usability is pretty weak for almost any case :-)
Unlike other field types, the date_select helper generates three select tags with special names and ids, one each for the year, month, and day elements. It's the naming convention that allows controller code to auto-magically re-assemble the inputs into a (single) date when it is processing the params array.
Sorry, I don't have a handy example of the naming format (since I never use date_select), but if you look at the names of the fields, you might be able to mimic the behavior without too much hackery by using the :discard_year option. That gets you the month and day fields, and a hidden field (I think) containing the current year.
If you're not averse to a little JS or CoffeeScript, you could modify the input field after the DOM is loaded, by removing the hidden "type" attribute (thus making it a simple text field) and setting its value to be empty.
I would choose between three options
1-Use a date_select only for day and month and a text field with some javascript for the year
Date_select accepts a :discard_year option, if you set it to true, the year field is rendered as a hidden_field so there's no select/dropdown http://api.rubyonrails.org/classes/ActionView/Helpers/DateHelper.html#method-i-date_select
Then you put a text_field and bind to the keyUp event and modify the value of the hidden year field
The most important problem about this is that, if the user has javascript disabled, the value of the text field will never be set to the hidden field and that's a problem.
2-Use a date_select only for day and month and a text field
I'm not sure if you can do this option, you can try using the same date_select as above and set the name of the input field with the name of the year field. The problem is that date_select will put a hidden field with that name and you put another field with the same name and the value sent on submission may not be what you want... You should see if it's posible.
3-Use a date_select and add extra functionality using Choosen http://harvesthq.github.com/chosen/
Put the date_select as always and set the start_year and end_year that you want, then replace the selects with choosen selects, the choosen select includes a text field to search between the years of the select
Choosen gives you a nice and consistence look almost crossbrowser (didn't test it on old IE versions), you get the text input for user-friendliness and, if javascript is disabled, the user still have the three selects.
I would definitelly use number 3, but maybe you don't want to add a plugin.
Experimenting with the Javascript route suggested by Tom, I came up with something like the following:
<%= f.date_select :birth_date %>
<script>
var date_field =
document.getElementsByName('ancestor[birth_date(1i)]')[0];
var new_html = '<%=
f.text_field 'birth_date(1i)', :value=>(f.object.birth_date.strftime("%Y") rescue "") %>';
date_field.outerHTML = new_html;
</script>
(Improvements welcome)

Setting hint text in a text field in Ruby on Rails

Can some one suggest the best way for setting hint text(not default text) for a text field in Ruby on Rails. Currently I am using this:
<%= text_field_with_auto_complete
"customer",
:contact_person, {
:value => 'last, first',
:style => 'color:#aaa;width:11em;',
:onfocus => "if(this.getValue()=='last, first'){this.clear();this.style.color = '#000';}",
:onblur => "if(this.getValue()==''){this.setValue('last, first');this.style.color = #aaa';}"
} %>
The text field is attached to a model and in turn to a value in a database. Also, the same html that is used in index.html is also used in edit.html and hence when I try to edit the field, the default value shows up instead of the value from the database. What is the correct way to do this?
Note: I am not trying to set a default value but just a hint to what needs to be entered in the text box.
Thanks,
Raja Ram
I'd recommend using the HTML 5 placeholder attribute, and then using a jQuery plugin to make it work on older browsers (like this one, but there are many others on Google).
You can see this technique used in production here.
Try this jquery plugin
http://plugins.jquery.com/project/hint
or choose here:
http://plugins.jquery.com/plugin-tags/hint
For prototype
http://davidchambersdesign.com/autopopulating-input-fields-with-prototype/

Resources