I currently am using Rails' "Devise" plugin to handle login/authentication. I am using a very basic form_for tag to handle the log-in form. Here is the code:
<div class="well-outer splash-signin-block">
<div class="well-inner">
<h2>Sign in</h2>
<div>
<%= form_for(resource, as: resource_name, url: user_session_path, html: {
class: "form-inline"
}) do |f| %>
<p><%= f.text_field :email, placeholder: "Email", autofocus: true %></p>
<p><%= f.password_field :password, placeholder: "Password" %></p>
<p>
<%= f.submit 'Sign in', class:"btn btn-primary btn-large" %>
<%= f.check_box :remember_me, class: "checkbox" %>
<%= f.label :remember_me %>
</p>
<% end %>
</div>
</div>
</div>
However, I would like to change that "Remember me" checkbox in to a button. The user experience would be that they could either click "Sign in" (the default action) or they could click "Remember me" to sign in persistently.
Behind the scenes, I imagine this would work by using a hidden field that sets the resource[remember_me] property to "1". However as a rails newbie I don't know how to go about coding this. I imagine it will need some javascript and that is fine, but googling has only turned up AJAX-y stuff and I don't think that's necessary. I won't shy away from it if it is necessary, though.
You would create a button with some id, then use javascript to bind to the click event of that button. When the button is clicked, you want to change the value of a hidden field. If you were using jQuery, it would be something like...
$('#id_of_button').click(function() {
$('#id_of_hidden_field').val("true");
});
Then you just check for that value in the controller like you normally would.
If you're not using jQuery it's not much more work, I just don't know it off the top of my head. Btw this code should be located in a .js file in your assets/javascript folder
Related
I need a way for my form to not be sent if the user didn't bother to select any radio buttons.
I'd like to to that within the view and the controller, not in the model (the data shouldn't even be sent)
<%= form_tag("/bookings/new", method: "get") do %>
<% #flights.each do |flight| %>
<%= radio_button_tag :flight_id, flight.id %>
<% end %>
<%= submit_tag "book now" %>
<% end %>
edit, to clarify
normally I'd do
<%= f.text_field :name, required: true %>
but, as I have many radio buttons and I only need one for the form to work, I don't know how to implement it
You can set validation in the model to see the presence of checkbox if javascript is disabled. This is a more robust method.
validates :flight_id, :acceptance => true
Docs here - http://guides.rubyonrails.org/active_record_validations.html#acceptance
Edit
function validateCheckBox() {
var x = document.getElementById("flight_id").checked;
if(!x) {alert("Not checked")}
}
<%= submit_tag "book now" , :onclick => "validateCheckBox();" %>
<%= f.text_field :name, required: true %>
This still works perfectly for radio buttons, and it's okay if it ends up on all radio items. The form will still only require one input.
I just tested it on my Rails 6 app.
I'm running into a strange issue when trying to add a checkbox (for a boolean field) to my form(s). The forms works perfectly when just updating text fields or file fields but since I added in a boolean field checkbox, upon checking any of the checkboxes, the submit form button "disables" itself.
I can't seem to figure out how or where from Rails is doing this behind the scenes:
My code is as below:
<%= simple_form_for #resource, url: resources_path do |f| %>
<div class="form-items">
<div class="form-item full">
<%= f.input :name, autofocus: true %>
</div> <!-- /.form-item full -->
<div class="form-item">
<%= f.input :file, as: :file %>
</div> <!-- /.form-item -->
<div class="form-item">
<%= f.input :public_file %>
</div> <!-- /.form-item -->
</div> <!-- /.form-items -->
<%= f.button :submit, 'Add Resource', class: 'button' %>
<% end %>
public_file is the boolean field which is marked as:
t.boolean "public_file", default: false
in the database schema
The submit button starts out with this rendered HTML
<input type="submit" name="commit" value="Add Resource" class="btn button" data-disable-with="Add Resource">
but as soon as I check the checkbox:
<input type="submit" name="commit" value="Add Resource" class="btn button" data-disable-with="Add Resource" disabled>
I'm not really too sure how to debug this and haven't found any documentation on Rails automatically disabling forms? Could that be what is happening?
Any pointers greatly received!
just replace your
<%= f.input :public_file %>
with
<%= f.check_box :public_file %>
Hope, It will work.
Try to disable default validation with novalidate option. To add 'public_file' as checkbox use as: :boolean.
<%= simple_form_for #resource, url: resources_path, html: { novalidate: true } do |f| %>
<%= f.input :public_file, as: :boolean %>
It appears I was a victim of not correctly isolating my Javascript functions. Another function intended for another page was causing the issue.
Sorry for this, have started trying to add body classes and using a statement like the following for isolating (as well as one can) JS in Rails:
return unless $('.students.index').length > 0
I am starting use Ruby on Rails and I am having a little problem. I have a form with 3 fields, this is the code:
<%= form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| %>
<%= devise_error_messages! %>
<div class="field">
<%= f.text_field :name, autofocus: true, placeholder: "Name" %>
</div>
<div class="field">
<%= f.email_field :email, autofocus: true, placeholder: "Email" %>
</div>
<div class="field">
<%= f.number_field :age, autofocus: true, placeholder: "Age" %>
</div>
<div class="actions">
<%= f.submit "Sign up" %>
</div>
<% end %>
In the email field when you write something that is not an email and try to submit, the browser (chrome or firefox ) display an error saying that the field must content an #. The same happen with the age field, if a letter is entered the browser show an error saying that the field only accept numbers.
I wanna know how to make that the browser show a message when any field is empty when you try to submit. I know how to do it in cakephp so I guess it can be done here in ruby too. I already validate the fields in the model, setting the presence in true but that only works for show a message after you submit and the page reload again.
When you use something like:
f.email_field
It is generating an HTML5 input element that tells the browser it has to be a valid email. HTML 5 also has a required='required' option that can be used to prevent blank fields.
You can add it like this:
<div class="field">
<%= f.email_field :email, autofocus: true, placeholder: "Email", :required => 'required' %>
</div>
This will add required='required' to your form element. Note that in HTML5 you only need the word required in your form element, but the only way I know to add it in Rails is to use the option form I'm showing you here.
This will prevent submitting the form without that field. This works for current versions of Firefox, Chrome, Opera, and IE11. Safari will prevent the submission but doesn't indicate why. It just does nothing.
I would check this out: http://blueashes.com/2013/web-development/html5-form-validation-fallback/
You can set the HTML required attribute to true. Just add required: true to each field.
Here's what your new form will look like:
<%= form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| %>
<%= devise_error_messages! %>
<div class="field">
<%= f.text_field :name, required: true, autofocus: true, placeholder: "Name" %>
</div>
<div class="field">
<%= f.email_field :email, required: true, autofocus: true, placeholder: "Email" %>
</div>
<div class="field">
<%= f.number_field :age, required: true, autofocus: true, placeholder: "Age" %>
</div>
<div class="actions">
<%= f.submit "Sign up" %>
</div>
<% end %>
Your case is pretty custom, that's why it looks pretty easy, but what you're really trying to achieve here is called 'client-side validation'.
To be really portable and user-friendly it has to be done in JavaScript. Basically this will be a script that validates the fields and outputs the corresponding error messages to the user, preventing form submission at the same time. This is almost the same that Rails does on the server side when you submit the form.
Once the problem is defined, you can approach it in one of the following ways:
Stay with Rails. Rails is initially designed to handle form validation on the server side. You can just accept the way it is, and it will yield the cleanest, shortest and the most semantic code possible. For it to be more seamless you can easily pull in some AJAX for it, which should be easy (http://guides.rubyonrails.org/working_with_javascript_in_rails.html). To user it'll look like nothing ever got submitted.
Write some custom JS yourself to handle those validations. Either on your own, or with the aid of libraries like http://jqueryvalidation.org/. This is going to be a mess, since you'll basically have to duplicate Rails server-side validation code on the client-side in a different language. And keep it in sync.
Use one of the helper libraries for Rails. E.g. https://github.com/joecorcoran/judge looks promising, but there are others to be Googled. These guys exercise the same idea: you've got server-side validations and they should be easily usable on the client-side. Certain libraries generate JavaScript automatically, others just send the form to be validated to the server behind the scenes.
If I were you, I would choose the 1st way + AJAX. Other ways would make simple matters unnecessarily complex, and instead of writing useful stuff you'll most certainly have to dive into debugging obscure JS and cryptic meta-programmed Ruby/Rails libraries.
Hope that helps!
HTML 5 has required=true option that can be used to prevent form submission with empty fields. In rails form helpers, you can use it like
<%= f.text_field :first_name, required: true %>
<%= f.email_field :email, required: true %>
I've previously been able to use the following code to link to an external site listed in a form. However, I can't get it work here. My controller defines the parameter and it's in the view and in my db/schema (t.string "website").
Is there something I'm missing?
/show
<p>
<strong>Website:</strong>
<%= link_to #woman.website %>
</p>
The website shows up in active admin in my db, but not as a link. This is what the form partial asks the user to input:
/_form
<div class="form-group">
<%= f.label :website %><br>
<%= f.text_field :website, class: "form-control" %>
</div>
Every time I click the link, it just reloads the same page I'm on. Would appreciate any insight.
You missed the href part, try this
<%= link_to #woman.website, #woman.website %>
My form has two radio buttons, public and private:
<div class='review-form'>
<%= simple_form_for(#review) do |f| %>
# input boxes for current_user to put text here
#'public' radio button, checked by default, class is for css
<%= f.radio_button :visible, "true" , :class => "share_button" %>
#'private' radio button, class is for css
<%= f.radio_button :visible, "false", :class => "keep_private_button" %>
#user can cancel
<%= link_to I18n.t('write_review.cancel_button'), landing_page,
:class => 'btn' %>
#user can submit
<%= f.button :submit, I18n.t('write_review.submit_button'),
:class => 'btn btn-primary' %>
How can I determine if the radio button in each review is true or false, so I can use it after the review has been saved in my app?
For example, something like:
<% if #review.radio_button.value = true %>
<%= label_tag("This review is public") %>
<% end %>
<% if #review.radio_button.value = false %>
<%= label_tag("This review is private") %>
<% end %>
Where is "elsewhere?" Is this after the user has saved? If so, then you should just be able to say:
if #review.visible?
or
if review.visible?
depending on the scope of your variable.
If, by "elsewhere," you mean on the same page, then you'll need some clever javascript. You can use something like jQuery to help here, but essentially you'll just want a listener on those radio buttons that, on click, fires off to a javascript function that evaluates the radio buttons, then updates the text of a div on the page appropriately. It's a very common pattern that I'll leave as an exercise for the alert reader, as, again, I'm not sure exactly what you mean by "elsewhere" -- from your question, though, I'm guessing it's the former (after the user has saved).
Hope that helps!