I have this form field:
<%= f.url_field :url, class: "form-control", placeholder: "Website" %>
I'd like to be able to have the user impute a URL and then have it automatically post as a clickable link. Right now all it does is submit a string that you'd have to copy and past.
Any suggestions?
Based on your comment: Change the index view to render a link instead of rendering plain text like so.
<%= link_to startup.url, startup.url %>
Or, if you're not forcing them to enter http:// in the form you can do
<%= link_to startup.url, "http://#{startup.url}" %>
Related
I have a Rails 4, that uses Rails' default form (I am NOT using Simple Form).
—————
EDIT: although the goal is fairly similar (allowing users to submit a form by pressing the enter key instead of pushing a submit button), my question is different from Form submitting when pressing enter in Textarea since it relates to Rails forms, which have a particular behavior and do not work in the same way as regular jQuery forms.
—————
One of my forms allows users to create comments:
<%= form_for([post, post.comments.build]) do |f| %>
<p>
<%= f.text_area :body, :placeholder => "New comment", size: "15x1" %><%= f.submit id: 'create_comment'%>
</p>
<% end %>
I would like to get rid of the <%= f.submit id: 'create_comment'%> part and allow users to submit a new comment just by pressing the enter key.
How can this be achieved?
If you use a f.text_field rather than text_area it should submit the form on enter by default.
If you need to use a textarea, then it will have to be javascript. something like:
$('#id_of_textarea').keypress(function(e){
if(e.which == 13){
$(this).closest('form').submit();
}
});
How can I dynamically hide an input field that is built using Rails form helpers? For example, consider the following code:
<%= f.select :notification_type, [['Specific','Specific'],['Mass','Mass'],['All','All']] %>
<%= f.label 'Enter the specific customer imei whom you want to send' %>
<%= f.text_area :imei %>
How would I hide or show the imei text area based on the value of notification_type?
You would need to use JS/jQuery if you want this to happen without refreshing the page. First set your form like so:
<%= f.select :notification_type, [['Specific','Specific'],['Mass','Mass'],['All','All']], class: "notification-type" %>
<%= f.label 'Enter the specific customer imei whom you want to send' %>
<%= f.text_area :imei, class: "imei", display: none %>
Then add some jQuery (CoffeeScript in this example) either in your assets/javascript or your views/action_name.coffee.erb like so:
$->
$(".notification-type").on "select", ->
if $(this).val() == "Mass" # replace the condition with the thing that should show the text area
$(".imei").show()
else
$(".imei").hide()
Something like this should work.. though you'll probably need to play with it as I haven't tested this code.
I have been recently working with Ruby on Rails and have run into an issue that I can not quite figure out. I need to create a bunch of form mockups, that do not function. That is they should have the submit button, but it should not do anything upon being clicked. Normally using html I would do something along the lines of
<form action="#">
</form>
Trying to convert this to use Rails form helpers, I have done the following
<%= form_tag "#" do %>
<%= label_tag :username, "Username: " %>
<%= text_field_tag :username %>
<br />
<%= label_tag :password, "Password: " %>
<%= password_field_tag :password %>
<br />
<%= submit_tag "Login" %>
<% end %>
This generates a form that is similar to what I want to achieve, however when clicking the submit button it tries to access /# via post which is not the desired result. Currently the only thing I can think of to achieve this is to set the disabled attribute of the button, but is there a better way?
Unfortunately this can't be achieved with form helpers. Defining a form_for or a form_tag requires an action for the form. You can set
:action => "#"
But this will require including the action in routes -> having a controller with action for it -> rendering some page yet again.
You could manipulate the form after loading with javascript however (sust remember to set :remote to true - ). Or alternatively, if you insist on using the form helpers - replace the submit_tag with a button_tag:
<%= button_tag "Login", :type => 'button'%>
Try
<% form_tag "#", :onSubmit => "return false" do %>
Have you tried with button_tag instead of submit_tag? See here. Just make sure you don't use the default, or you will be right back where you started.
I would like to add username inside the username text field in my application (vs having a label next to it) the user would be able to type over this text. I've seen it done in html but I'm confused as to how to do it on my new.html.erb page since im using the form_for tag and the text_field tag.
thanks in advanced!
Use "placeholder".
<%= form_for #user do |f| %>
<%= f.text_field :username, :placeholder => "Username" %>
...
<%= f.submit %>
<% end %>
This will only work for html5 supported browsers by the way, so make sure you have jquery fallback for IE 8, 7 etc.
This is achieved by using the HTML5 placeholder attribute.
In rails, you can simply add the placeholder attribute:
<%= f.text_field :whatever, :placeholder => "text for placeholder..." %>
How I can submit form with link on correct rails 3 format?
Thanks.
<%= form_for #post do |f| %>
<%= f.label :title %><br>
<%= f.text_field :title %>
<p><%= f.submit %></p>
<% end %>
My code sample.
For people who came here via Google, I have an improvement on Zequez's answer. Instead of the method that he gives, add this method to the application helper instead:
def link_to_submit(*args, &block)
link_to_function (block_given? ? capture(&block) : args[0]), "$(this).closest('form').submit()", args.extract_options!
end
Then, as Zequez stated, for simple links you can just do this in your view:
<%= link_to_submit 'Submit Form' %>
...and for more complicated buttons you can pass HTML options and a block to be used inside the link. If you use Twitter Bootstrap, for example, this lets you add CSS classes, formatting and icons:
<%= link_to_submit( class: 'btn btn-primary' ) do %>
<strong>Submit</strong> the Form <i class="icon-arrow-right"></i>
<% end %>
The JQuery code will work as long as the link is a child of the form (that is, as long as link_to_submit is called from somewhere within the form_for block).
"Correct" is a tricky word in this context ;) . One could ask why you're not just taking a button element and make it look like a link?
Anyways — you can't achieve this with plain HTML (at least not to my knowledge). With a Javascript framework like e.g. jQuery you could simply do something like this:
$('a').click(function(){
$('form').submit();
return false;
});
Rails 2.3.x had a link_to_remote helper which let's you specify a :submit parameter (= DOM element's ID, default is the parent form). So you were be able to write:
link_to_remote 'submit', :url => {…}, :submit => "my_form"
But with Rails 3's push to UJS, this helper is gone.
You can add the following to the application helper:
def link_to_submit(text)
link_to_function text, "$(this).closest('form').submit()"
end
Then inside your view files you can just call
link_to_submit 'Submit Form'
And the link must be child of the form.
With jquery, this one-liner will work fine for a simple form.
<%= link_to t("translate.submit"), "#", class: "make it beautiful", :onclick=>"$('form').submit()" %>
Of course you don't really have to use jquery, just finding the dom element for your form will work fine as well.
<%= link_to t("translate.submit"), "#", class: "make it beautiful", :onclick=>"document.getElementById('your_form_id').submit()" %>
This way you don't use any ajax, just plain form submit.
In Rails 3, the link_to_remote helper is gone, but it's replaced with
link_to 'submit me', url_for(#post), {:remote => true, :class => 'submit_me'}
In your case, you likely want your form to do the AJAX, like so:
<%= form_for #post, :remote => true do |f| %>
<%= f.label :title %><br>
<%= f.text_field :title %>
<p><%= f.submit %></p>
<% end %>
With a companion link:
link_to 'submit me', '#', :class => 'submit_me'
Then, in an .js file included in the page body:
$('.submit_me').click(function() {
$('form').submit();
return false;
});
The idea is that anything more complicated than turning a link or form into an ajax request should be done with the jQuery callbacks, as listed here:
https://github.com/rails/jquery-ujs/wiki/ajax
And if you want to really get into interactive AJAX requests, go here for a great 2-part article on it.