ASP.net Migration: ReadOnly TextBox persistance

April 28, 2010 by C#   ASP.NET  

If you ever migrated from ASP.net 1.0 to ASP.net 2.0, you might have noticed the following issue.

Imagine you've got a page like the following one: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>

    <script type="text/javascript">
        function populate() {
            var txtTest = document.getElementById("<%=txtTest.ClientID %>");
            txtTest.value = "test 123";
        }
    </script>

</head>
<body>
    <form runat="server">
    <div>
        <asp:TextBox runat="server" ID="txtTest" ReadOnly="true" Text="abc"></asp:TextBox>
        <input type="button" onclick="populate()" value="Test" />
        <br />
        <asp:Button ID="btnSubmit" runat="server" Text="Submit" />
    </div>
    </form>
</body>
</html>

Basically what we've got here is client-side code modifying the contents of a server-side based control.

The user clicks on the test button, which sets the value of the readonly textbox "txtTest" to test 123 (the test button being our input method instead of the keyboard).

If we click submit (in ASP.net 1.0) it sends the value to the server assigning/persisting our readonly textbox with the new value (client-side javascript assigned). In ASP.net 2.0 you'll find that ASP.net simply ignores the changes we made via the test button (ignoring our client-side action).

This isn't a bug though, this is purely by design - its all about security; preventing a malicious user to change readonly values. Quite a logical design since readonly values are supposed to be readonly, right?

What about legitimate reasons e.g. a datepicker?

One workaround would be to rather set the readonly value using the attribute collection of the control: 
txtTest.Attributes.Add("readonly", "readonly");

What about if we've got this issue throughout our application e.g. we just migrated from ASP.net 1.0? We can always go through every page and make the necessary changes or alternatively change the default behaviour of the textbox control to act like it did in ASP.net 1.0.

Or what if we prefer the ASP.net 1.0 way of handling readonly values?

We can always simply change the behaviour of the textbox control by creating a WebControlAdapter: 
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI.WebControls.Adapters;
using System.Web.UI.WebControls;

namespace CSTruter
{
    public class TextBoxAdapter : WebControlAdapter
    {
        protected override void OnInit(EventArgs e)
        {
            TextBox sender = this.Control as TextBox;
            
            if (sender.Attributes["secure"] == null)
            {
                if (sender.ReadOnly == true)
                {
                    sender.ReadOnly = false;
                    sender.Attributes.Add("readonly", "readonly");
                }
            }
            base.OnInit(e);
        }
    }
	/* Since the value of a multiline textbox doesn't persist when we create an adapter, we need to do the following */
        protected override void Render(System.Web.UI.HtmlTextWriter writer)
        {
            TextBox sender = this.Control as TextBox;

            base.RenderBeginTag(writer);
            if (sender.TextMode == TextBoxMode.MultiLine)
            {
                System.Web.HttpUtility.HtmlEncode(sender.Text, writer);
            }
            else
            {
                base.RenderContents(writer);
            }
            base.RenderEndTag(writer);

        }
}

Adding the previous snippet to our solution, along with the appropriate browserfile will change the default behaviour of all the TextBoxes in our application to function like it did in ASP.net 1.0. If we want a secure readonly textbox, we can simply add an attribute named secure to the textbox, inforcing the ASP.net 2.0 model e.g. 
<asp:TextBox runat="server" ID="txtTest" Text="abc" Secure="true"></asp:TextBox>


Leave a Comment