Hi Guys,
It is common behavior of ASP.NET that if a control is set to
Visible = "false"
, the response stream doesn't contain the definition of it. Therefore, if you want to make the control visible during runtime from Javascript always put
display = none
in styles attribute.
Say you have a textbox which you want to make invisible but want to display when required from the browser.
<asp:textbox id="txt" runat="server" />
In codebehind instead of writing
txt.Visible=false;
You write:
txt.Style.Add(HtmlTextWriterStyle.Display, "none");
If you take the 2nd approach, the server will render the control and send to the client and finally will not be displayed because of
display:none
CSS style. You may again show the control using the following javascript :
var elem = document.getElementById("txt");
elem.style.display='block';
Note : It is better to use txt.ClientID
instead of txt
directly as identifier in Javascript.
Another issue of ASP.NET is with setting
Enabled = false
/
Readonly=true
.
In case of
Enabled=false
or
Readonly = true
, ASP.NET sends the input control to the browser, but any changes made in the control in client side will not reflect in the server.
That means, whenever the control is recreated in the web server during postback, it will not include the Form data posted for the control. Thus the initial value will be restored.
Therefore, to overcome the issue again, you should put
ctrl.Attributes.Add("readonly", "readonly");
ctrl.Attributes.Add("disabled", "disabled");
This will work the same way but the value changes in the client side will reflect to the server side controls.
So if you want to work with the controls in the client side using javascript, dont use restriction using properties from server side, rather use CSS Attributes to do this.
Hope you will like this. :rose: