I don't know whether you noticed this problem already. ASP.net doesn't seem to handle the viewstate of disabled and
readonly controls on the UI (i.e. textboxes etc...). I had the following feature: there where 4 text-fields, one after
the other. The first one shouldn't be edited directly by the user wherefore it has been set to readonly. The other
fields are usually automatically filled out according to some other information. Furthermore the feature stated that if
the user changes one of the autocompleted fields, the value of the first (readonly) text-field should be emptied. To
enhance the user experience everything should happen without a post-back. So due to the easiness of this
task, I added a client-side JavaScript change event handler on the 3 text-fields where any change would empty the first
field. In this way no postback has to be done which improves the performance and user experience. Everything seemed to
work out fine, the first field was cleared correctly. But then, after the postback, the value was again there. After
trying around a bit, I recognized that the viewstate isn't handled for readonly and disabled fields (enabling the field
caused everything to work fine). To some degree this is reasoning is also understandable. ASP.net is a server-side
technology (at least prior to the introduction of ASP.net Ajax) wherefore client-side changes are not taken into
consideration. So since readonly and disabled fields aren't supposed to be changeable between postbacks their viewstate
doesn't have to be handled. But as you can see there may be cases where this isn't true.
What you have to do so is
to create some workaround. I researched a bit on the web and found some solutions where developers worked with hidden
fields. I don't like that however, my solution was to handle this via JavaScript by "simulating" a readonly textbox.
There are basically two different approaches:
- Fast solution
The fastest solution is for sure to simulate a
readonly textbox. That can be achieved by creating a CSS class that mimics the style of a readonly text field.
Moreover to avoid that the user is able to change the content of the text-field (which is the intended behaviour of
a readonly field), you return "false" on the onkeypress, onkeyup and onkeydown events. The effect of this solution
is that you have a normal textbox wherefore its viewstate will also be treated normally.
Note: You should take care the the user is able to navigate over the
field by using the tab-key. That can either be achieved by setting the tabindex to "-1" s.t. the field never
receives the focus or you don't return "false" on the event handlers in case that the "tab"-key was pressed.
Example:
<asp:TextBox ID="txbWorkOfficeCompanyCode" runat="server" CssClass="m text readonly" onkeydown="return false;" onkeypress="return false;" onkeyup="return false;">
</asp:TextBox>
- Cleaner solution
The cleaner solution is to
exploit the ASP.net Ajax functionalities and create a TextBoxExtender which includes the functionalities mentioned
in point 1. This solution is cleaner since you could add the extender on a text-field without directly modifying
the textbox itself. Moreover it facilitates reusability which is a major point why this solution should
be preferred.
Questions? Thoughts? Hit me up
on Twitter
