title: ASP.Net: How to maintain TextBox State after postback
body: <p>I would like to know how to maintain the control state that has been modified in Javascript.<br />
  I have two TextBoxes, one DropDownList and a button (all Runat=Server) in C# ASP.net 2010 Express.<br /><br />
  First textbox is just accept whatever data user input. <br />Second textbox enable state will change based on DDL selected value. <br />If ddl selected value is "-", second textbox will become Enabled = False. <br />
  If not "-", it will become Enabled = True. This enable is done through Javascript.</p>
  
  <p><br />
  In my Page Load event, I have below code.</p>
  
  <pre><code>if (!IsPostBack)
  {
       txtKey2.Text = "";
       txtKey2.BackColor = System.Drawing.ColorTranslator.FromHtml("#CCCCCC");
       txtKey2.Enabled = false;
  }
  </code></pre>
  
  <p><br />And in my aspx page, I have some javascript which will clear the textbox data and disable the textbox.</p>
  
  <p>Here is for Second Textbox.</p>
  
  <pre><code>&lt;asp:TextBox ID="txtKey2" runat="server" Width="425px" EnableViewState="False"&gt;&lt;/asp:TextBox&gt;
  </code></pre>
  
  <p><br />
  And here is for DDL.</p>
  
  <pre><code>&lt;asp:DropDownList ID="selKey1" runat="server" onchange="EnableSelkey(this.value,1)"&gt;
      &lt;asp:ListItem Value="0"&gt;-&lt;/asp:ListItem&gt;
      &lt;asp:ListItem Value="1"&gt;AND&lt;/asp:ListItem&gt;
      &lt;asp:ListItem Value="2"&gt;OR&lt;/asp:ListItem&gt;
  &lt;/asp:DropDownList&gt;
  </code></pre>
  
  <p>Here is the code for my Javascript. (I have a plan to implement other textbox and ddl so in my code I have Else if condition).</p>
  
  <pre><code>function EnableSelkey(val, strID) {
      var txtBox;
      if (strID == "1")
          txtBox = document.getElementById('&lt;%= txtKey2.ClientID %&gt;');
      else if (strID == "2")
          txtBox = document.getElementById('&lt;%= txtKey3.ClientID %&gt;');
      else
          txtBox = document.getElementById('&lt;%= txtKey4.ClientID %&gt;');
  
      if (val != 0) {
          txtBox.disabled = false;
          txtBox.style.backgroundColor = "White";
          txtBox.value = "";
          txtBox.select();
      }
      else {
          txtBox.disabled = true;
          txtBox.style.backgroundColor = "#CCCCCC";
          txtBox.value = "";
      }
  }
  </code></pre>
  
  <p>I have nothing in button click event.</p>
  
  <p>By using above all code, when I run the project, the page loads Ok.
  The second textbox enabled state is set to False (through Page_Load event). So far Ok.</p>
  
  <p>Then from my browser, I choose ddl value to other instead of "-", the textbox become enable because of javascript. This is Ok.</p>
  
  <p>I input the value and click on the button. Page PostBack happens here. Textbox is still enabled (because of EnableViewState = False for my textbox).</p>
  
  <p>I choose ddl value to "-", second textbox became disabled.
  <br />Click on the button, page postback happen, but this time the textbox is still enabled. &lt;&lt; This is the issue I'm trying to solve. I change EnableViewState, ViewStateMode in different values but still the same.</p>
  
  <p>Is there any solution for this one?</p>
  
  <p>Here is my test image URL.
  <a href="http://postimg.org/image/atrtkip49/" rel="nofollow">State 1</a> , 
  <a href="http://postimg.org/image/3pa0bhhux/" rel="nofollow">State 2</a> , 
  <a href="http://postimg.org/image/hy9mtjwdl/" rel="nofollow">State 3</a> <br /></p>
  
  <p>Sorry for the long post.</p>