Enabling Disabling button asp .net - using javascript

Question

Currently in my application I am having a button and a text box. The user types something in the textbox and then presses the button. What I want is that:

The search button should should stay disabled when the page loads for the first time. I can achieve that by setting it to disabled in the code behind file.

Now I want it to remain disabled when the user types upto 2 characters. The moment the user types third character the button should get enabled automatically.

The important thing is that it has to be done without asp .net AJAX since this website will be run from old mobile phones. So only pretty basic javascript or jquery is supported.

Any help will be appreciated.

Thanks

Varun

cillierscharl · Accepted Answer · 2011-10-03 14:13:40Z

4

in order to use the document.getElementById in asp.net and not have to use the full name, you should let asp.net provide it. Instead of: document.getElementById("ctl00_ctl00_phContent_phPageContent_btnSearch")

Try:

document.getElementById('<%= btnName.ClientID %>')

Where btnName is the asp:Button Id. The <%= code will generate the actual button id, fully qualified, so you don't have to worry about things changing with the hard coded id.

edited Oct 3, 2011 at 14:13

cillierscharl

7,1053 gold badges31 silver badges46 bronze badges

answered Oct 3, 2011 at 13:59

Joel WZ

1008 bronze badges

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

1 Comment

Lorgarn Over a year ago

How come the expression is alwas the literal String in my case? I never get the actual value...

Decker97 · Accepted Answer · 2011-09-29 20:32:49Z

3

I got this to work with a HTML text box, I don't think you can do it with a asp.net text box:

<head>
    <script type="text/javascript">
        function TextChange() {
            var t = document.getElementById("Text1");
            var b = document.getElementById("Button1");
            if (t.value.length > 2) {
                b.disabled = false;
            }
            else {
                b.disabled = true; 
            }


        }

    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <input id="Text1" type="text"  onkeyup="TextChange();" />
        <asp:Button ID="Button1"   runat="server" Text="Button" Enabled="False" />
    </div>
    </form>
</body>

answered Sep 29, 2011 at 20:32

Decker97

1,65310 silver badges11 bronze badges

1 Comment

Varun Sharma Over a year ago

Hi, thanks for your help but i got it to work using pure javascript for normal forms. But since my textbox and button are inside asp .net contentplaceholder I am unable to get it ID of the button which I want to use it at the runtime. I am forced to write like this: document.getElementById("ctl00_ctl00_phContent_phPageContent_btnSearch").disable‌d = false; instead of document.getElementById("btnSearch").disabled = false;

kand · Accepted Answer · 2011-09-29 20:35:02Z

1

If you're using jQuery, use

$(<selector>).val().length

to get the size, then you can set the button's disabled attribute with

$(<button selector>).attr('disabled',false).

answered Sep 29, 2011 at 20:35

kand

2,3487 gold badges32 silver badges44 bronze badges

2 Comments

Varun Sharma Over a year ago

Hi, thanks for your help but i got it to work using pure javascript for normal forms. But since my textbox and button are inside asp .net contentplaceholder I am unable to get it ID of the button which I want to use it at the runtime. I am forced to write like this: document.getElementById("ctl00_ctl00_phContent_phPageContent_btnSearch").disabled = false; instead of document.getElementById("btnSearch").disabled = false;

kand Over a year ago

Oooh I see what the real issue is now. You can access the id of a control by inserting some code behind code in your asp by using: <% = btnSearch.ClientID %> given your button is named btnSearch in the code behind. So, you could do this with jQuery: $("<% = btnSearch.ClientID %>") to get the jQuery object of your button, or you could do this with pure js: document.getElementById("<% = btnSearch.ClientID %>")

Collectives™ on Stack Overflow

Enabling Disabling button asp .net - using javascript

3 Answers 3

1 Comment

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related