I want to change to state of the submit button when a user clicks on that I want to make these transitions on that button.
Text change to "submitting..." and state of that submit button becomes "disabled"
I know how to do this with Jquery something like:
Let's say that the button has a #derp id.
$("#derp").click(function(){
this.toggleClass("pressed");
});
Basicly this will add or remove the "pressed" class from the item based on its state. Just add the css for .pressed and you're ready to go.
#derp {...}
#derp:hover {...}
#derp:active {...}
#derp.pressed {...}
Or we do using different selectors.
Question: Is there is default functionality in ruby on rails.
Update:
I am using ajax based form submission and when i try to click 2-3 times form submittion quickly. Its actually submitted 2-3 times. I want to prevent that thing and I am using simple_form
<%= f.button :submit, "Submit Review", :disable_with => "Processing..." %>
You can use :disable_with option:
http://api.rubyonrails.org/classes/ActionView/Helpers/FormTagHelper.html#method-i-button_tag
To make :disable_with Work with Ajax Remote You have to edit your public/javascripts/rails.js and change
document.on("ajax:after", "form", function(event, element) {
to
document.on("ajax:complete", "form", function(event, element) {
Related
For one form, I want to have two submit buttons , named:
Appove, Decline
when the user clicks on Approve it should send approve: true as well
when the user clicks on Decline it should send approve: false as well
Basically the buttons should work like a checkbox
Is this possible with Rails and how to implement it? Thanks
If you're using the standard submit form helper, you will get returned a param with the key "commit". You can test for this in your controller code.
<%= f.submit 'Approve' %>
<%= f.submit 'Decline' %>
in the controller...
def create
approved = params[:commit] == 'Approve'
The approved variable will then contain true or false and you can use it as needed in the rest of the action / method.
You can do it but you need js/jquery for this. You will have hidden checkbox that you will check in proper way and two buttons.
Lets assume that your form has id 'form'. And you checkbox has id 'approve_checkbox'
In this case you need submit function for something like this.
$('#approve_button').on('click', function(e){
e.preventDefault();
$('#approve_checkbox').prop('checked', true);
$('#form').submit();
});
$('#decline_button').on('click', function(e){
e.preventDefault();
$('#approve_checkbox').prop('checked', false);
$('#form').submit();
});
Of course you can simplify this code, but I think idea is clear.
I have one select_tag and multiple button_to buttons on the same page. I'm looking to use the parameters from the select_tag for several of the buttons, is there a non-form way to do this?
The reason I don't want to use a form is two fold:
1. the number of buttons is dynamic
2. the positioning of the buttons do not follow the form structure (object at the top and submit at the bottom)
-here is one of the create methods that are linked to one of the buttons
def create
params[:options].each do |x|
#connector = Connector.find_or_create_by_options_id_and_follow_id(x.id, current_user.follow(#product).id)
#connector.save
end
end
I checked and this params[:options] is always nil no matter what is selected by me when I test
<%= select_tag :options, options_for_select(#current_user_options.map {|p| [p.name, p.id] }), {:multiple => true} %>
button_to method actually creates a form which has a submit button, with the form action being the url which you had mentioned in button_to. So when you hit the submit button, obviously the options param will be nil, since the button_to form has no data in it
You can use a form itself, and form does not mandate, having an object at the top and submit button below. Submit button just submits the form irrespective of its position in the form
It sounds like you actually need a second field in your form that's a select field or radio buttons to choose your action. Then you have one button that submits the form, and in your controller you can then parse that new action field and decide where to redirect the user.
How can I change submit button on form to text?
<%= f.submit "Text" %>
I know how to change text on button but I need to change a way to submitting.
You can press on link, for example Submit and submit.
You don't say what ruby version you are using. But try this
<%= submit_tag "Text" %>
Note that there is no form helper here, so no "f." in front
In order to change the submitting of a form to be triggered by a link as opposed to a submit button, you must use javascript instead of raw generated HTML only.
See similar answers on StackOverflow but a summary of a possible solution in jQuery (which comes baked into recent versions of Rails) would be as follows:
$('#submit_link').click(function(){
$('form').submit();
return false;
});
Update: This should do it using HAML notation in Rails 2.3.x:
- form_for(#object) do |f|
= f.submit 'Update Or Whatever'
You could also try "button" tag or use an image link that looks like a button.
Hi I am working in ruby on rails,
I want to auto click on
<%= link_to 'Referesh', :onclick => 'window.opener.location.reload(true)' %>
when I submit the form by
<%= f.submit 'Save' %>
My question is how I can perform auto clicking on link_to when I submit the form by f.submit.
Both are in the same form.
I am not sure why/what you want to do.. the question is not clear. However, you can override the onsubmit() and do something there.
If you're using JQuery, you can trigger the click event on a link with something like this:
$("a#my_link").trigger('click');
If you're using Prototype, you should include event.simulate.js
I've used this several times and it works like a charm. It allows you to manually trigger native events, such as click or hover:
$('a#my_link').simulate('click');
Can anyone point me towards some simple step by step guides that would help me to understand how to couple Fancybox and Ajax together?
I have three models:
Class Event
belongs_to :site
belongs_to :operator
End
Class Site
has_many :events
End
Class Operator
has_any :events
End
Users can add a new event, and select Site or Operator from select boxes. I've also created a quick-add partials for Site and Operator. These are rendered in a div on the Event form, and displayed in Fancybox when a link is clicked.
<%= link_to_box "Add", "#site" %>
<%= link_to_box "Add", "#operator" %>
<div id="site">
<%= render 'sites/quickadd' %>
</div>
<div id="operator">
<%= render 'operators/quickadd' %>
</div>
So far so good.
Now I have two questions.
1- How to I hide the quick-add divs on the Event form, but display them in Fancybox. CSS classes such as display:none or visibility:hidden result in the partials not displaying in either location. Currently the partials are rendered at the end of the Event form as well as in the Fancybox popup, but this is not ideal.
2- How do I setup these quickadd partials so that they dynamically update the Event form. For example I'm adding a new Event for site Foobar. Foobar is not available in the select box so I click "add", enter Foobar in the popup form, click save, and Foobar is automatically set in the select box on the Event form.
I assume that question 2 will involve Ajax and calls for remote => true. However I'm very new to this and really need a basic step by step guide that would help me understand how to implement this. For example, do the "add" links need to be remote, or the partials? If the partials, how do I code that? After save, how do I update and set the parent form select box?
Like I said, basic stuff, but having read several guides for Fancybox and other lightbox-like popups, and several guides for Ajax, I'm still having trouble tying the two together.
Thank you for any pointers.
1) If it isn't showing and hiding the divs correctly for you, then I would put them as display:none; in the css and use something like this for your fancybox call
$("#site").fancybox({
onStart : function() {
$('#DIV').show();
},
onClosed : function() {
$('#DIV').hide();
}
});
2) When I have a form like your describing, after you are done submitting the form (which I would submit using :remote => true on the form tag, you can have it check for ajaxComplete. and you can set some variables on your create.js.erb or update.js.erb files that will show and hide forms, set the current index, or you might have to reload your list after the ajaxCompleted is "completed"
Not sure if this helps or gives direction, but hope it will give some guidance..might be able to post more later today to help