Freigeben über


SYSK 118: ReadOnly or ContentEditable?

Consider this:  you want a text box on a web page to be not editable by the user, but you want to be able to change the text box’s contents in client side script and see the updated text on the server.

 

Did you know that if you set TextBox1.ReadOnly = true, the value set by the client side script will not be visible on the server?    Try it for yourself… Here is the code:

<form id="form1" runat="server">

    <div>

        <input id="Button2" type="button" value="Change Text via Client-Side Script" onclick="ChangeText();" />

    </div>

    <asp:TextBox ID="TextBox1" runat="server">initial text</asp:TextBox>

    <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="See Value on the Server-Side" />

</form>

<script language="javascript" type="text/javascript">

<!--

function ChangeText()

{

    form1["TextBox1"].setAttribute("innerText", "abc");

}

-->

</script>

 

 

public partial class MyForm : System.Web.UI.Page

{

    protected void Page_Load(object sender, EventArgs e)

    {

        TextBox1.ReadOnly = true;

    }

    protected void Button1_Click(object sender, EventArgs e)

    {

       Response.Write(TextBox1.Text + "<br>");

       

    }

}

However, if instead of setting TextBox1.ReadOnly property you set ContentEditable attribute to false, you’ll get the behavior you’re looking for:

TextBox1.Attributes["contentEditable"] = "false";

 

 

Special thanks to Vinay Kumar Baliyan who replied with the information used in this post to Les Cardinal‘s question.

Comments

  • Anonymous
    May 03, 2006
    Wow, the behavior has changed. On 1.*, ReadOnly TextBox works fine

  • Anonymous
    May 13, 2006
    有时候,我们不希望用户直接编辑TextBox,而是希望通过客户端脚本的方式来设置内容,一般的做法是设置TextBox的属性ReadOnly为true。但在ASP.NET 2.0里有了变化,设置了ReadOnly为true的TextBox,在服务器端不能通过Text属性获取在客户端设置的新内容

  • Anonymous
    May 15, 2006
    The comment has been removed

  • Anonymous
    May 17, 2006
    Then you might as well stick to readonly, but use
    TextBox1.Attributes("Readonly") = "readonly"
    instead.
    contentEditable is not supported by all browers.

  • Anonymous
    May 21, 2006
    ASP.NET 2.0中ReadOnly的TextBox

  • Anonymous
    November 02, 2006
    TextBox1.Attributes["readonly"] = "true"; 这样不是更方便

  • Anonymous
    May 16, 2007
    [来源:AppDev-SYSK118] 有时候,我们不希望用户直接编辑TextBox,而是希望通过客户端脚本的方式来设置内容,一般的做法是设置TextBox的属性ReadOnly为 true。但...

  • Anonymous
    May 27, 2007
    [来源:AppDev-SYSK118]有时候,我们不希望用户直接编辑TextBox,而是希望通过客户端脚本的方式来设置内容,一般的做法是设置TextBox的属性ReadOnly为true。但在AS...

  • Anonymous
    November 06, 2007
    今天转一个asp.net程序从vs2003到vs2005,老报错,postback后取不到textbox控件的改变的值,在vs2003下完全正常,在vs2005下就是不行,搞了一上午都不知为啥,于是上...

  • Anonymous
    November 25, 2007
    The comment has been removed

  • Anonymous
    January 09, 2008
    PingBack from http://www.watch-life.net/aspnet/aspnet-textbox-readonly.html