问题
I have a bootstrap select with readonly="true" but I can still change the selected option.
I need the disabled="true" behavior, but when I use this the select is not submitted.
I need a combination of the 2, the selected option can not be changed but the select has to be submitted.
I could use hidden fields, but I was hoping for an easier solution.
回答1:
Another possibility could be to use a select replacement with dropdowns there it should be possible to disable the dropdown but still submitting the value of the hidden select element. But then you could also use hidden fields...
Or you really add a hidden field with the selected value in case the select element is disabled.
<input type="hidden" name="whatever">
<select name="whatever">
If the hidden field has the same name as the select, the selected value of the select should overwrite the submitted value of the hidden field (e.g. when the select field is dynamically enabled with js). And if the select is disabled the value of the hidden field is sent. Not sure about the order of what is submitted first.
$(document).ready(function(){$('select option:not(:selected)').attr('disabled',true);});
this solution should also work (at least with js enabled). It disable every not selected option. And therefore the selected option is submitted and it couldn't be changed.
There is a similar and already answered question html-form-readonly-select-tag-input
回答2:
I've run into a similar issue and what i do is when the form onsubmit event is fired remove the disabled attributes as the browser will not post disabled attributes back to the server.
$('form').submit(function () { $('[disabled]').removeAttr('disabled'); })
As you mentioned the only other option i have found is to find the values to hidden inputs.
回答3:
At pageload add disabled to readonly
$('[readonly]').prop( "disabled", true );
Before Submit remove disabled
$('[readonly]').prop( "disabled", false );
Note from Jquery doc:
As of jQuery 1.6, the .attr() method returns undefined for attributes that have not been set. To retrieve and change DOM properties such as the checked, selected, or disabled state of form elements, use the .prop() method.
来源：https://stackoverflow.com/questions/32846865/twitter-bootstrap-select-readonly-still-able-to-change-options