Главная » 2016 » Сентябрь » 10 » Атрибут disabled
22:07
Атрибут disabled
Sometimes, we required to display form fields in non-editable mode. We can achieve this functionality by setting read-only or disabled attribute to form fields (textbox, label, checkbox, text area). Before using both these attributes, we should understand the key differences between read only and disabled attributes.

Difference between disabled and read only attributes

Sometimes, we required to display form fields in non-editable mode. We can achieve this functionality by setting read-only or disabled attribute to form fields (textbox, label, checkbox, text area). Before using both these attributes, we should understand the key differences between read only and disabled attributes.

Disabled attribute

Disabled form fields or elements values don’t post to the server for processing.

Disabled form fields or elements don’t get focus.

Disabled form fields or elements are skipped while tab navigation.

Some browsers (Like IE) provide default style (Gray out or emboss text) for disabled form fields or elements.

Read Only Attribute

Read Only form fields or elements values post to the server for processing.

Read Only form fields or elements get focus.

Read Only form fields or elements are included while tab navigation.

Some browsers do not provide default style for Read-Only form fields or elements.

Note

We can’t set readonly attribute to all the form fields or elements. The <SELECT>. <OPTION>. and<BUTTON> elements do not have readonly attributes while they can have disabled attributes.

Set Disabled Attribute

Set Read Only Attribute

CSS For read only and disabled attribute input element

Since some browser don’t provide default style for disabled element. Hence to display disabled elements on all browsers in same look and feel, we can use below css.

Similarly we can change the look and feel of readonly element by using below css.

Share with your friends!

Basant Badwal Kumar (Web Developer ) AngularJS Development

Mohit Tyagi ( Software Engineer) NodeJS Development

Sanjay Kumar (Sr. Software Developer) MEAN Stack Development

Mukesh Sharma (Software Engineer) NodeJS Development

Puspendra Singh (Managing Director ) NodeJS Development

Manju Lata Yadav (Software Professional) AngularJS Development

vibhu mishra (Software Programmer) AngularJS Development

Parmanand Kumar (Software Engineer ) AngularJS Development

Sheetal Bhat (Software Engineer) NodeJS Development

Mayank Agarwal (Sr. Software Engineer ) NodeJS Development

Rajneesh Joshi (UI Developer) NodeJS Development

Shamim Ahmad (Web Developer) NodeJS Development

Akash Saini (Software Developer) AngularJS Development

I thought it was an enjoyable course, with a great tutor. Lots of information which will benefit my job role. Thank you.