below is how i disable all submit button on click
$('form').submit(function(){
// On submit disable its submit button
$('input[type=submit]', this).attr('disabled', 'disabled');
});
how to disable all selectbox onchange easily for all selectbox in the page
Something like this will disable all select boxes:
$('select').attr('disabled', 'disabled');
To tie it to a form submission you can add it to your existing function.
To bind this to a select box's onChange event you can use jQuery's change listener. So if you want all select boxes disabled when any select box changes you can use this:
$('select').change(function(){
$('select').attr('disabled', 'disabled');
});
If you want to operate on a specific select box you can change the first $('select') above to reference that box.
Almost the same as what you're doing above, just change it to select
$('form').submit(function(){
// On submit disable its submit button
$('select', this).attr('disabled', 'disabled');
});
Related
This code won't work:
$(document).on('change', '#myRadioButton', function(){ // Won't work
});
I want to catch whenever a radiobutton is deselected or selected, but the code above doesn't catch when it's unselected.
What's the proper way to catch radio button deselection?
I guess, you should use something like that, setting onchange event on all radios from same group:
DEMO jsFiddle
$(document).on('change', ':radio[name=mygrp]', function(){
alert($('#myRadioButton').is(':checked'));
});
Do this:
$('#myRadioButton').change(function(){
alert("changed");
});
$('input[type=radio]').not('#myRadioButton').change(function(){
$('#myRadioButton').change();
});
What it does ?
We know that, a radio button only gets deselected when any other radio button gets selected.
So I basically bind a change event for #myRadioButton and then bind all other radio buttons except #myRadioButton to the change event and on it, i invoke #myRadioButton's change event. like $('#myRadioButton').change();
Here is the JsFiddle
I'm damn sure, that it will work.
Mark it as answer if it helps :)
Hi I have numbers of check boxes and below that I have a Button, which will filter data as per check box selection..
When I will click on filter button it will transfer to other page and when I click on back button the checkbox reamains checked.
but I want that when I click on back button then checkbox should be uncheck.
Any help.
For those who have similar issues, add autocomplete="off" to checkbox might help.
https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion
You can reset the checkboxes on page load using jQuery
$('input:checkbox').prop('checked', false);
Demo (Checkbox will be never checked as onload am getting rid of checked property)
ondomready (Place the below code anywhere in your document)
$(document).ready(function(){
$('input:checkbox').prop('checked', false);
});
You may use below code :
window.onbeforeunload = function() {
//unchecked your check box here.
$("input[type='checkbox']").prop('checked', false)
};
Try this when back button is clicked
Use Jquery to clear the checkboxes
$("input[type='checkbox']").each( function() {
$(this).removeAttr('checked');
});
I'm trying to prevent users from clicking the button on the page twice, so what I've been doing is hiding that button with jQuery after it's been clicked once. But is there a way instead of hiding that button to disable with jQuery that button after it was clicked once?
I've tried
$(document).ready(function () {
$('#onClickHideButton').click(function () {
$(this).prop('disabled', true);
});
});
but the problem that I'm having with this function is that as soon as the button is clicked it it becomes disabled before it get the chance to submit the form, so the form never gets submitted.
Why not disable the button when the form is submitted, since that's what you actually want to do...
$('#myForm').on('submit', function () {
$('#myButton').prop('disabled', true);
});
Instead of using a submit button, just use a simple button and send manually the form submit.
<input type="button" id="onClickHideButton" value="Submit"/>
$('#onClickHideButton').click(function () {
$(this).prop('disabled', true);
$('#myform').submit();
});
or you could disable the button when the form is submitted
$('#myform').on('submit', function(e) {
$('#onClickHideButton').prop('disabled',true);
});
I have an form with dropdown. whenever i select the drop down once i click save itself it appear it do some action. I want to as auto save when you change the dropdown values.
Here is the fiddle:
http://jsfiddle.net/GGtTw/
jQuery('select[name="dropdown"]').change(function() {
alert(jQuery(this).val());
});
jQuery('#submit').click(function() {
alert('you click submit button');
});
I want once you select the dropdown it automatically submit the values means it automatically click save without noticing to the user.
Any suggestion would be great.
Thanks
Use trigger to simulate a click event for the given object
jQuery('select[name="dropdown"]').change(function() {
jQuery('#submit').trigger('click');
});
jQuery('#submit').click(function() {
alert('you click submit button');
});
just do
$( "#submit" ).trigger( "click" );
Another Approach:
jQuery('select[name="dropdown"]').change(function() {
save();
});
jQuery('#submit').click(function() {
save();
});
function save()
{
alert('Save');
}
Make an ajax call to save from inside your drop down change event. Unless you want to perform a form submit, in that case trigger the click function on the submit like so
jQuery('#submit').trigger('click');
jQuery ajax()
After a user submits a comment, I want the textarea and summit button to be "disabled" and somewhat visually disabled.
Like Youtube.
How can I do that with Jquery using the simplest plugin and/or method?
Simply set the disabled attribute on your input elements when the button is clicked:
$("#mybutton").click(function(){
$("#mytext,#mybutton").attr("disabled","disabled");
});
Example: http://jsfiddle.net/jonathon/JcXjG/
$(document).ready(function() {
$('#idOfbutton').click(function() {
$('#idOfTextarea').attr("disabled", "disabled");
$('#idOfbutton').attr("disabled", "disabled");
});
});
This basically says: When the document is "ready", attach an event handler to the button's (HTML ID "idOfButton") click event which will set the disabled attribute of the textarea (HTML ID "idOfTextarea") and the button.
$('form').submit(function(){
return false;
});
jQuery(document).ready(function() {
$('form').submit(function(){
$('input[type=submit]', this).attr('disabled', 'disabled');
});
});
$('#btn').click(function(){
$(this, '#textarea').attr('disabled', 'disabled');
})
So first handle the event where the user submits the comment and then disable the textarea and submit button. (assuming your submit button can be selected with "input#submit-comment" and your textarea can be selected with "textarea". The addClass part is optional but can be used for you to style those elements differently if they happen to be disabled.
$("input#submit-comment").click(function(){
$("textarea").attr("disabled", "disabled").addClass("disabled");
$(this).attr("disabled", "disabled").addClass("disabled");
// ... Actually submit comment here, assuming you're using ajax
return false;
}