I am trying to create a button and on that button I have created a popup with angularjs. When I am using normal html tag it is opening the popup properly .But When I am converting in rails tag the popup gets dissapear within 1 sec and automatically the pages gets redirected to some other page .I have never use angularJs..Any solution will be helpful
<button type="button" class="btn btn-primary btn-lg" ng-click="deviceregisteration($event)">Add New Device</button>
So my this rails code is creating problem as I have mention above
<%= f.submit 'Add New Device',:class =>'btn btn-primary btn-lg' ,'ng-click'=>"deviceregisteration($event)" %>
The reason that your button made the popup disappeared is that it submitted the form.
Your plain HTML way, that button is simply a button, nothing more, so when you hit that button, it triggered the event.
When you used rails code, that button is a submit button, when you click on, it triggered the event and also submit the form and redirect to another page due to the response.
To fix this, you can just use f.button instead of f.submit.
Related
I'm trying to incorporate Hotwire/Turbo into an existing Rails application. I've added turbo frames to a simple edit page, but now when I click my back button, it disappears instead of taking me to target page. The link is a simple link_to "Back", my_model_show_path(model_instance).
I see that the network request takes place, and succeeds. The page preview in DevTools' Network tab shows the correct page being loaded and rendered as html. The browser just doesn't take me to the new location.
How do I make this work like before? I feel like I should be able to redirect anywhere in my application with regular links even if I'm using Hotwire/Turbo.
Turns out there are three ways (at least) to restore default link behavior.
1: Set the data-turbo attribute.
<%= link_to "Click Here", path_helper_method, data: { turbo: false } %>
(or in plain html)
<a href="" data-turbo="false">
2: Set the target attribute.
<%= link_to "Click Here", path_helper_method, target: "_top" %>
(or in plain html)
<a href="" target="_top">
Move the link outside any Turbo frame. Any link inside a Turbo frame, without one of the above attributes, will be handled by Turbo by default.
On an index page I have a table with a bunch of listed items. Each <tr></tr> within the table's <tbody>not only lists each item, but also allows you to
update that item
click edit to take you to the edit screen for that item
Here is a picture:
Within development in safari: I can successfully update each listed item and it all works just fine. However: when running my feature spec with capybara and selenium-webkit (which uses firefox):
It appears that capybara finds the submit button ok and even clicks it
But then nothing happens. For some reason the form appears to not be submitting when that update button is clicked.
To make things even more strange: in development mode while testing with firefox, clicking the update button works sometimes. Sometimes it doesn't work and I have to refresh the page, and then it works.
I tried putting a binding.pry in right before clicking the Update abc button in order to manually click the button at that step. I noticed that clicking the button manually was not submitting the form either.
Here is my relevant spec:
scenario "within the index page", js: true do
select 'some selection', from 'item_1_jazz'
select '12345', from 'item_1_something'
# I attempted putting a binding.pry here, and noticed that clicking the update button still wasn't submitting the form
find("#update_some_item_1_btn").click
expect(page).to have_content 'The item was successfully updated.'
end
Update Here are my buttons within the form:
<td class="btn-group">
<%= f.submit 'Update abc', class: "btn btn-success btn-sm", id: "update_#{dom_id(item)}_btn" %>
<%= link_to edit_item_path(item), class: "btn btn-info btn-sm" do %>
<i class="fa fa-pencil"></i> Edit
<% end %>
</td>
Question: In firefox: Capybara appears to find the submit button just fine and even click it. But why isn't Capybara able to submit the form within Firefox? Also: why in development mode with firefox does the button only work sometimes? It appears something is stopping the form form from submitting.
Based on responses to comments on the OQ, it appears you have form elements wrapping your td elements inside a tr. That is invalid HTML since a form element is not a valid child of a tr, and different browsers may/do interpret markup like that differently. If you don't need IE compatibility then you can use the HTML5 form attribute to tie form elements outside a form back to the form you want them associated with, however if you do need IE compatibility you'll need to look at other solutions such as not using table/tr/td elements but possibly styling other types of elements with 'display: table/table-row/etc` or one form wrapping the whole table and determining which element to update based on the button clicked.
I know this question has been asked several times, but there is one thing that I cannot follow. I am trying to move to the next user in my Kaminari pagination after a form is submitted. I have the code working where it will increment the page, but there's currently no conditional statement to keep it from stopping until the form has been submitted:
<%= f.submit "Submit Score", class: "btn btn-default" %>
<script type="text/javascript">
window.location.href="?page=<%=#users.current_page+1 %>"
</script>
Here I have my f.submit button and below it is the code that increments the counter. Right now, however, nothing is stopping the incrementing, so when I refresh the page, the counter scrolls until the last user has been reached. I have tried using hidden_tags and flags to add to the conditional if-statement, but nothing is working correctly. I just feel like there is a very simple solution, but I have been messing with my code for a couple hours now, so I am at a loss. Thank you in advance!
I need an help on How to submit 2 form's POST methods both
with a one single click.
Suppose that I have two seperate forms
I want my secound form to be submited at the time I click on the first form action button.
You need to do this with Javascript
first place a button that is going to submit both forms like this in your html
<button type="submit" class='input_submit' style="margin-right: 15px;" onClick="submitBothForms()">submit both</button>
then your submitBothForm method has to includes these lines
document.forms["first_form_name"].submit();
document.forms["secound_form_name"].submit();
I have two buttons in my page.html.erb file that updates the values in a table.
<div class="container container-1">
<button class="_button _button-2">action1</button>
<button class="_button _button-3">action2</button>
</div>
When I press a button I want it to execute a piece of code in the pagecontroller and display the result in the table. I am able to do all these but struck at recognizing button. How do I execute ruby code on click of the buttons? I want to do it with rails not JavaScript.
You should define a an AJAX request for that method, because Ruby-Code is serverside and The button-click is clientside.
I allready asked that in an earlier question:
How to call a Method from controller in rails?