This is what I found by Firebug in Firefox.
Values of disabled inputs will not be submitted
Is it the same in other browsers?
If so, what's the reason for this?
This is what I found by Firebug in Firefox.
Values of disabled inputs will not be submitted
Is it the same in other browsers?
If so, what's the reason for this?
You can use three things to mimic disabled:
HTML: readonly attribute (so that the value present in input can be used on form submission. Also the user can't change the input value)
CSS: 'pointer-events':'none' (blocking the user from clicking the input)
HTML: tabindex="-1" (blocking the user to navigate to the input from the keyboard)
There are two attributes, namely readonly and disabled, that can make a semi-read-only input. But there is a tiny difference between them.
<input type="text" readonly />
<input type="text" disabled />
readonly attribute makes your input text disabled, and users are not able to change it anymore.disabled attribute make your input-text disabled(unchangeable) but also cannot it be submitted.jQuery approach (1):
$("#inputID").prop("readonly", true);
$("#inputID").prop("disabled", true);
jQuery approach (2):
$("#inputID").attr("readonly","readonly");
$("#inputID").attr("disabled", "disabled");
JavaScript approach:
document.getElementById("inputID").readOnly = true;
document.getElementById("inputID").disabled = true;
PS disabled and readonly are standard html attributes. prop introduced with jQuery 1.6.
select controls are still clickable even on readonly attrib
if you want to still disable the control but you want its value posted. You might consider creating a hidden field. with the same value as your control.
then create a jquery, on select change
$('#your_select_id').change(function () {
$('#your_hidden_selectid').val($('#your_select_id').val());
});
Here's the Solution and still using disabled property. First disable your inputs on load.
$(document).ready(function(){
$("formselector:input").prop("disabled",true);
$( "formselector" ).submit(function( event ) {
$(":disabled").prop("disabled",false);
});
});
on submit enable all of them. this will assure everything is posted
<input type="text" disabled />
instead of this disabled use readonly
<input type="text" readonly />