Thomas BP
Thomas BP

Reputation: 1227

Add readonly to input fields in jQuery

I have problems adding readonly to some input fields.

I have this code in the <head>

$(document).ready(function() {
    $('#powermail_field_ordreid').prop('readonly', true);
    $('#powermail_field_destination').prop('readonly', true);
});

And then I have these 2 out of 6 input fields, that I need to add the readonly on.

<div id="powermail_fieldwrap_9" class="powermail_fieldwrap powermail_fieldwrap_input powermail_fieldwrap_9 ">
    <label class="powermail_label" for="powermail_field_ordreid"> Ordre id </label>
    <input id="powermail_field_ordreid" class="powermail_field powermail_input " type="text" value="0521104821">
</div>
<div id="powermail_fieldwrap_7" class="powermail_fieldwrap powermail_fieldwrap_input powermail_fieldwrap_7 ">
    <label class="powermail_label" for="powermail_field_destination"> Destination </label>
    <input id="powermail_field_destination" class="powermail_field powermail_input " type="text" value="Luxembourg">
</div>

I have tried .attr() and now im using .prop() because I'm using jQuery 1.10+, but I can still edit the input fields, what's wrong.

...EDIT... Can see its works fine, on jsfiddel - so can someone tell me if its an other script that blok it here http://wnf.dk/bestillingsform.html?tx_powermail_pi1[field][7]=Luxembourg the 2 first fields have the readonlyadd.

Upvotes: 3

Views: 2521

Answers (2)

jandro5
jandro5

Reputation: 56

Your web, console log: Uncaught ReferenceError: $ is not defined

You should put the references to the jquery scripts first. Uncaught ReferenceError: $ is not defined?

Upvotes: 2

Najib
Najib

Reputation: 510

<script>
    $(document).ready(function(){
        $('#powermail_field_ordreid').attr('readonly', true);
        $('#powermail_field_destination').attr('readonly', true);
    });
</script>

it works for jQuery <1.9

jQuery 1.9+

<script>
        $(document).ready(function(){
            $('#powermail_field_ordreid').prop('readonly', true);
            $('#powermail_field_destination').prop('readonly', true);
        });
    </script>

you may look at http://jsfiddle.net/najibcse/M7rkB/

Upvotes: 1

Related Questions