Enabling asp.net txtbox from button OnClientClick js function

Question

I want to enable a textBox and make it Visible (default settings are false for both) on button click. I can postback but it's inefficient so I want my button to activate onClientClick just to activate and make it Visible.

I tried this:

JS:
function EnableTxt() {
       document.getElementById( '<%=txtSearch.ClientID%>' ).disabled = 'false';
   }

HTML:
<asp:ImageButton ID="btnSearch2" runat="server" ImageUrl="~/Images/search.png" Height="27px" Width="30px" ImageAlign="AbsBottom" OnClientClick="EnableTxt()"/>

<asp:TextBox ID="txtSearch" runat="server" CssClass="btnSearchStyle" Height="27px" Width="134px" onkeypress="return EnterEvent(event)" BackColor="#BDC3C7" BorderStyle="None" Visible="true" Enabled="false"></asp:TextBox>

The JS function that I found doesn't do anything...

manu sharma · Accepted Answer · 2019-04-09 04:42:55Z

1

Change your code to-

<asp:ImageButton ID="btnSearch2" runat="server" ImageUrl="~/Images/search.png" Height="27px" Width="30px" ImageAlign="AbsBottom" OnClientClick="if(!EnableTxt()){return false};"/>
    <asp:TextBox ID="txtSearch" runat="server" CssClass="btnSearchStyle" Height="27px" Width="134px" onkeypress="return EnterEvent(event)"  BorderStyle="None" style="visibility:hidden" BackColor="#BDC3C7" Enabled="false"></asp:TextBox>

And change JS as-

 function EnableTxt()
  {
 var id = document.getElementById('<%=txtSearch.ClientID%>');
    if (id.style.visibility === "hidden" && id.getAttribute('disabled'))
    {
         id.style.visibility = "visible";
         id.removeAttribute("disabled");
    }
    else {
         id.style.visibility = "hidden";
         id.setAttribute("disabled");
         }
  }

edited Apr 9, 2019 at 4:42

answered Apr 8, 2019 at 10:43

manu sharma

1401 silver badge11 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Sabakakado Over a year ago

Thank you!! Do you know how can I make it invisible with second press?

manu sharma Over a year ago

I have edited the code. Just change the JS function to toggle between show and hide. You can up-vote the answer if you found it helpful :)

Prashant Pimpale · Accepted Answer · 2019-04-09 05:03:54Z

0

change in js, just remove the disabled attribute:

document.getElementById('<%=txtSearch.ClientID%>').removeAttribute("disabled");

edited Apr 9, 2019 at 5:03

Prashant Pimpale

10.7k10 gold badges52 silver badges88 bronze badges

answered Apr 8, 2019 at 10:04

Razmik Ghookas

1185 bronze badges

Collectives™ on Stack Overflow

Enabling asp.net txtbox from button OnClientClick js function

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related