I have a view with link_to method like this :
= link_to "Add Friend", friendships_path(:id => #user), :method => :post, :remote => true
As you can see I want to send a post request with link_to using ajax (remote: true).
This request go to the create method in friendships controller and it work fine (it create a relationship) but it render anything (firebug show me: 500 Internal Server Error).
views/friendships/create.js.erb
$("#my_selector").html("<%= escape_javascript(render('users/cancel_invitation')) %>")
views/users/cancel_invitation
= link_to "Cancel request", { :controller => "friendships", :action => "cancel", :id => #user }, data: { confirm: "Cancel friendship request?" }
I can't find the error.
= link_to "Cancel request", { :controller => "friendships", :action => "cancel", :id => #user }, data: { confirm: "Cancel friendship request?" }, :remote => true
The :remote => true bit is important for ajaxy stuff.
Related
i'm trying to load a payment form within a modal within a rails form. As it is right now, when I click "Buy Now" the modal will load, but the form will submit. How do I have it not submit until, the someone clicks "Submit" in the modal.
= form_tag foo_path, id: 'payment-form' do
-if #store.products == nil
Test
- #store.products.each_with_index do |product, index|
.row
.col-lg-2
- if current_user
- if store.user_id == current_user.id
= link_to "Delete", product_path(product), data: { method: "delete", confirm: "Are you sure?"}
.col-lg-8
.panel.panel-default
.panel-body
.row
.col-lg-2
%input{:type => "checkbox", :id => "switchName#{index}", :class => "check"}/
%label{:for => "switchName#{index}"}
.col-lg-8
= hidden_field_tag("order_products[][product_id]", product.id)
= product.name
%br
.subheader= number_to_currency(product.cost_in_cents.to_f / 100)
.col-lg-2
= select_tag("order_products[][quanity]", options_for_select([0,1,2,3,4,5,7,8,9,10,11,12,13,14,15]), "data-cost-per-unit" => product.cost_in_cents, id: product.name, class: "drop", :prodindex => index)
.col-lg-2
-if current_user
-else
%span.payment-errors
.text-center
%h2.total-amount
Total:
$0.00
%hr
.text-center
%button.btn.btn-primary.btn-lg{"data-target" => "#myModal", "data-toggle" => "modal"}
Buy Now
By default, when clicking on a <button> element, the containing form is submitted: source.
If you use {"data-target" => "#myModal", "data-toggle" => "modal", "type" => "button"} when creating your button, it should display your modal without submitting the form.
Then, you'll have to handle submitting the form in your modal if that's what you want to happen.
I have the following in my view:
<%= button_to 'Check In', controller: "posts", action: :check_in, id: #post.id, :class => "btn", :style => "display:inline" %>
For some reason, the :class and :style do not end up in the HTML that is rendered. I have tried putting this class and style on other ERB tags and they get rendered from there. Why are they being stripped on this tag only?
button_to(name = nil, options = nil, html_options = nil, &block)
so, you need to wrap the options and html_options attributes to hashes
<%= button_to 'Check In', { controller: "posts", action: :check_in, id: #post.id }, { :class => "btn", :style => "display:inline" } %>
Many tag helpers require HTML attributes to be in a :html key.
<%= button_to 'Check In', controller: "posts", action: :check_in, id: #post.id, :html => {:class => "btn", :style => "display:inline"} %>
The following is very confusing to me:
The first link is correctly not using turbo links but the query is not being sent
The second link is the opposite scenario
= link_to 'yesturbo_noquery', "/controller/action", "data-no-turbolink" => true, query: "hello"
= link_to "noturbo_yesquery", {'data-no-turbolink' => true, :controller => "controller", :action => "action", :query => "hello" }
How do I make both work?
Edit, This works Thanks to Sikachu
= link_to 'yesturbo_yesquery', controller_action_path(:query => 'hello'), "data-no-turbolink" => true
link_to method actually consist of 3 parts:
link_to(name = nil, options = nil, html_options = nil, &block)
From both of the example you wrote there, example 1 mixed in query into the html_options, and example 2 mixed in data-no-turbolink into options.
I think if you changed it to this, it will work:
link_to 'noturbo_yesquery', {:controller => 'controller', :action => 'action', :query => 'query'}, :data-no-turbolink => true
I think following code is more correct:
<%= link_to('Product', #product, data: { no_turbolink: true }) %>
Also following code will works:
<%= link_to('Product', #product, 'data-no-turbolink' => true) %>
I'm trying to follow this post How can I unobtrusively disable submit buttons with Javascript and Prototype? but I can't get it to work. The form triggers an RJS function, so I need to keep the helpers' onclick events intact. The RJS returns/reloads the same forms along with two new texts. I'm really confused. Here is my rails code for the forms:
.span-20#comparison
/ new comparison . . .
/ voting forms (also reloaded)
.span-4.prepend-3.append-6
- form_remote_tag :action => url_for(:controller => :comparisons), :method => :post do
= hidden_field_tag :poem1_id, poems[:a].id
= hidden_field_tag :poem2_id, poems[:b].id
= hidden_field_tag :response, 1
= submit_tag "Vote for me", :disabled => false, :disable_with => 'Vote for me', :class => "compare"
.span-4.append-3.last
- form_remote_tag :action => url_for(:controller => :comparisons), :method => :post do
= hidden_field_tag :poem1_id, poems[:a].id
= hidden_field_tag :poem2_id, poems[:b].id
= hidden_field_tag :response, 2
= submit_tag "Vote for me", :disable_with => 'Vote for me', :class => "compare"
.span-4.prepend-8.append-8.prepend-top.last
- form_remote_tag :action => url_for(:controller => :comparisons), :method => :post do
= hidden_field_tag :poem1_id, poems[:a].id
= hidden_field_tag :poem2_id, poems[:b].id
= hidden_field_tag :response, 'draw'
= submit_tag "Declare Draw", :disable_with => 'Declare Draw', :class => "compare"
RJS
page.replace_html :comparison, :partial => 'poems', :object => #poems
page.insert_html :top, :previous, :partial => 'comparison', :object => #comparison
page << "Effect.ScrollTo($('top'));"
Here's one way you could do it using Prototype:
<script type="text/javascript">
document.observe("dom:loaded" function() {
$$("input .compare").each(function(submit) {
submit.observe("click", function() {
submit = true;
});
});
});
</script>
This adds an onclick event handler to every input element with a compare CSS class (i.e. your submit buttons) when the DOM is loaded. The onclick event handlers disables each button when it's clicked. Note that adding event handlers using Prototype this way does not replace any existing event handlers on the elements.
how to call a different controller's action using link_to_remote
:url => {:controller => "Posts", :action => "update"} doesn't work
the method:
link_to_remote(name, options = {}, html_options = nil)
passing in a hash like:
link_to_remote "hug kittens", { :url => { :controller => 'kittens', :action => 'show' } }
as the second argument (options) works. verified.
the result:
<a onclick="new Ajax.Request('/kittens/hug', {asynchronous:true, evalScripts:true, parameters:'authenticity_token=' + encodeURIComponent('/BdZwHdC/QqtBJsdCU+cCHxabHj/QHUT6i8ggbr5CtY=')}); return false;" href="#">hug kittens</a>
The problem with your implementation might be, that there is no "real" update-url (except you created one by hand). Please have a look at the url of your edit-form. It's actually a post-request to "posts/:post_id".
<%= link_to_remote "Save", :url=>{:controller => "Posts", :action => "update"}, :update=>"div_id" %>