CODEWITHSUNDEEP
javascriptasp.netcheckbox
mahesh
mahesh

Reputation: 3217

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

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()");

Upvotes: 0

Views: 1074

Answers (3)

JMichelB
JMichelB

Reputation: 475

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.

Upvotes: 1

Nikki9696
Nikki9696

Reputation: 6348

Change document.getElementById("SplistButton")

to

document.getElementById(checkboxId)

Upvotes: -1

Ken Pespisa
Ken Pespisa

Reputation: 22266

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"

Upvotes: 1

Related Questions