Problem with enabling and disabling button control based on the asp.net check box check

Question

Hi friends i have a button control which has to be enabled based on my asp.net checkbox check,but when run the code i am facing the problem my button is still disabled even after i perform a checkbox check .is their any property i have set in code behind to acccess the check event.

I am using the following code in my application This is my javascript file

<script type="text/javascript">
                    function theChecker() {
                        var checkboxId = '<%=  SpEligible.ClientID %>';
                        alert(checkboxId);
                        if (checkboxId.checked == true)
                             {
                            document.getElementById("SplistButton").disabled = false;
                             }
                             else
                              {
                            document.getElementById("SplistButton").disabled = true;
                              }
                            }
</script>

This is my code for the checkbox and button is

<asp:CheckBox ID="SpEligible" runat="server" Text="SpEligible" class="cBox"   />
   <asp:Button ID="SplistButton" runat="server" OnClientClick=" return ShowInsertForm()"    Enabled="false"/>

This is my aspx.cs file where i am calling the javascript

SpEligible.Attributes.Add("onclick", "theChecker()");

JMichelB · Accepted Answer · 2011-08-08 15:13:10Z

I can see two major errors in your code :

1- In your <script> tag, you did realize that your Checkbox wouldn't have the same ID once in the page, but you didn't made that check. Also, as Ken Pespisa mentioned, the ID you took is only a string, therefore, it doesn't know any checked property. Here is the code I would write :

<script type="text/javascript">
    function theChecker() {
        var checkboxId = '<%=  SpEligible.ClientID %>';
        alert(checkboxId);
        if (document.getElementById(checkboxId).checked == true)
        {
            document.getElementById("<%=  SplistButton.ClientID %>").disabled = false;
        }
        else
        {
            document.getElementById("<%=  SplistButton.ClientID %>").disabled = true;
        }
    }
</script>

2- In your .cs page, you don't seem to use any namespace. You may have hide some code, so I'll just say be sure to have namspaces and be sure to use this line inside a function, maybe the page load event function.

Ken Pespisa · Accepted Answer · 2011-08-08 15:03:06Z

You need to change the javascript code to:

<script type="text/javascript">
                    function theChecker() {
                        var checkboxId = document.getElementById('<%=  SpEligible.ClientID %>');
                        alert(checkboxId);
                        if (checkboxId.checked == true)
                             {
                            document.getElementById("SplistButton").disabled = false;
                             }
                             else
                              {
                            document.getElementById("SplistButton").disabled = true;
                              }
                            }
</script>

You were checking the checked property of a string constant. You need to get the control itself using document.getElementById which has checked property. I'd also rename "checkboxId" to "checkbox"

Nikki9696 · Accepted Answer · 2011-08-08 15:05:24Z

-1

Change document.getElementById("SplistButton")

to

document.getElementById(checkboxId)

answered Aug 8, 2011 at 15:05

Nikki9696

6,3681 gold badge32 silver badges24 bronze badges

1 Comment

Ken Pespisa Over a year ago

That would disable / enable the checkbox. The goal is to enable the button.

Collectives™ on Stack Overflow

Problem with enabling and disabling button control based on the asp.net check box check

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related