Removed “disabled & ready only” attributes from html form elements before form submission

Question

I have a form that I have a stack of fields that have been set with read only and disabled using jquery such as follows:

$('.adminOnlyField').prop('disabled', 'disabled');
$('.adminOnlyField').attr("readonly","true");

I'm using both so the select fields also look read only to the viewer.

I want to remove these attributes from the form before it is submitted so the other non-disabled fields will go though to my model. I've tried this but it doesn't seem to work:

$('.clear_ready_only').click(function(e) 
{
   e.preventDefault();
   $('.adminOnlyField').removeAttr('disabled');
   $('.adminOnlyField').removeAttr('readonly');
   $('#CardModifysaleForm').submit();
});

Am I missing something? I thought this would have done the job?

Thanks

// FULL JS FUNCTIONALITY AFTER BELOW CHANGES

$(function () {

    var $adminOnly = $('.adminOnlyField');
    $adminOnly.prop('disabled',true).prop('readonly',true);
    $adminOnly.attr("onclick","return false");
    $adminOnly.attr("onkeydown","return false");
    $adminOnly.removeClass('required');
    $adminOnly.removeClass('date_picker');



    $('.clear_ready_only').click(function(e) 
    {
        e.preventDefault();
        $adminOnly.prop('disabled',false).prop('readonly',false);
        $adminOnly.attr("onclick","return true");
        $adminOnly.attr("onkeydown","return true");
        $('#CardModifysaleForm').submit();
    });

});

Answer 1

First, you can use .prop() for both, which is faster than .attr() :

$('.adminOnlyField').prop('disabled',true);
$('.adminOnlyField').prop('readonly',true);

Second, for efficiency you should cache and chain:

var $adminOnly = $('.adminOnlyField');
$adminOnly.prop('disabled',true).prop('readonly',true);

And third, to answer your question, just flip the switches on submit:

$('.clear_ready_only').click(function(e){
    e.preventDefault();
    $adminOnly.prop('disabled',false).prop('readonly',false);
    $('#CardModifysaleForm').submit();
});

Answer 2

$('.adminOnlyField').
   prop('disabled', false).
   prop('readonly', false);

Should do it.