html form readonly,javascript - HTML form readonly SELECT tag/input - Stack Overflow

Set the select disabled when you plan for it to be read-only and then remove the disabled attribute just before submitting the form.

// global variable to store original event/handler for save button

var form_save_button_func = null;

// function to get jQuery object for save button

function get_form_button_by_id(button_id) {

return jQuery("input[type=button]#"+button_id);

}

// alter value of disabled element

function set_disabled_elem_value(elem_id, value) {

jQuery("#"+elem_id).removeAttr("disabled");

jQuery("#"+elem_id).val(value);

jQuery("#"+elem_id).attr('disabled','disabled');

}

function set_form_bottom_button_save_custom_code_generic(msg) {

// save original event/handler that was either declared

// through javascript or html onclick attribute

// in a global variable

form_save_button_func = get_form_button_by_id('BtnSave').prop('onclick'); // jQuery 1.6

//form_save_button_func = get_form_button_by_id('BtnSave').prop('onclick'); // jQuery 1.7

// unbind original event/handler (can use any of following statements below)

get_form_button_by_value('BtnSave').unbind('click');

get_form_button_by_value('BtnSave').removeAttr('onclick');

// alternate save code which also calls original event/handler stored in global variable

get_form_button_by_value('BtnSave').click(function(event){

event.preventDefault();

var confirm_result = confirm(msg);

if (confirm_result) {

if (jQuery("form.anyForm").find('input[type=text], textarea, select').filter(".disabled-form-elem").length > 0) {

jQuery("form.anyForm").find('input[type=text], textarea, select').filter(".disabled-form-elem").removeAttr("disabled");

}

// disallow further editing of fields once save operation is underway

// by making them readonly

// you can also disallow form editing by showing a large transparent

// div over form such as loading animation with "Saving" message text

jQuery("form.anyForm").find('input[type=text], textarea, select').attr('ReadOnly','True');

// now execute original event/handler

form_save_button_func();

}

});

}

$(document).ready(function() {

// if you want to define save button code in javascript then define it now

// code below for record update

set_form_bottom_button_save_custom_code_generic("Do you really want to update this record?");

// code below for new record

//set_form_bottom_button_save_custom_code_generic("Do you really want to create this new record?");

// start disabling elements on form load by also adding a class to identify disabled elements

jQuery("input[type=text]#phone").addClass('disabled-form-elem').attr('disabled','disabled');

jQuery("input[type=text]#fax").addClass('disabled-form-elem').attr('disabled','disabled');

jQuery("select#country").addClass('disabled-form-elem').attr('disabled','disabled');

jQuery("textarea#address").addClass('disabled-form-elem').attr('disabled','disabled');

set_disabled_elem_value('phone', '123121231');

set_disabled_elem_value('fax', '123123123');

set_disabled_elem_value('country', 'Pakistan');

set_disabled_elem_value('address', 'address');

}); // end of $(document).ready function