Aesthetic analysis of ExtJS in disabled and readonly

Analysis of aesthetics of Disabled and ReadOnly in ExtJS

The ExtJS. Assuming that the Set input box is a read-only property, the first consideration is readonly=true

It has the same effect as the normal input box, but does not agree with the input;

However, it is very easy to cause ambiguity, let the user first feel is that it is the input box, there is the impulse to input information, in fact, otherwise;

At this time, you can consider using the Disabled=true property

This will definitely not feel can input, a look to know disagree with the changes, but the font color is obviously very vague, so the effect is poor;

So. Use often still use readonly=true, but change the background color to do disabled better performance, effect such as the following:

The obvious feeling is that the input is forbidden and the font is clear. Code snippets such as the following:

{columnwidth:1,
Layout: ' Form ',
Defaults: {
Xtype: "TextField",
width:150,
Allowblank:true,
Readonly:true,

style: ' Background: #E6E6E6 '
},
items:[
{fieldlabel: ' event title ', Name: ' Event_title ', width:435}
]
},

Why choose ReadOnly instead of disabled? Another obvious difference:

Disabled=true, the form submission time cannot pass the data to the background action layer, but readonly=true can; this difference is consistent with the disabled and readonly performance differences of the tags in HTML.

Copyright notice: This article blog original articles, blogs, without consent, may not be reproduced.

Aesthetic analysis of ExtJS in disabled and readonly