CODEWITHSUNDEEP
javascriptjqueryhtmlformbuilder
Blawless
Blawless

Reputation: 1279

Make all inputs with class readOnly

So I am building a drag and drop form builder and I want to make a particular field on all the inputs readOnly. This can be

Date input

example image

All these inputs will be generated dynamically.

I had a look at How can i add readonly attribute on all input fields using javascript? & How to set readonly property to false on multiple textboxes with same class?

but none make the name input readOnly just by the class name.

I am currently doing it this way:

$("#editClick").on('click', function(){
 $('.myNameClass').attr('readonly', false);

});

But need a way to fire it every time a new field appears on the page(i.e. check is the length of a class increases)

Something like:

if ($(".myNameClass")[0]).increases -> fire event-> and every time it does

Upvotes: 2

Views: 10353

Answers (1)

Shafiqul Islam
Shafiqul Islam

Reputation: 5690

you can do this using this

jQuery <1.9

<script>
    $(function () {
       $('input[type="text"], textarea').attr('readonly','readonly');

    });
</script>

or use this for readonly mode

jQuery 1.9+

 $(function () {
         $('input[type="text"], textarea').prop("readonly",true);

    });

and remove readonly mode

jQuery <1.9 

     $(function () {
         $('input[type="text"], textarea').removeAttr('readonly');

    });

</script>

or use this for remove

jQuery 1.9+

 $(function () {
         $('input[type="text"], textarea').prop("readonly",false);

    });

Upvotes: 6

Related Questions