Using JavaScript scripts cannot directly change the solution for the Enable property of a CheckBox control in asp.net _javascript tips

Source: Internet
Author: User

I have a little problem with my work today, as follows: When I set the checkbox's enable value to false in the background page, I used the script (chk.disabled = false) in the front page, and cannot change the value of disabled to false, the code is as follows.

Foreground code:

 
 

Background code:

  protected void Page_Load (object sender, EventArgs e)
  {
    this.chkBlog.Enabled = false;
  }

Why is this happening, let's look at the HTML source code, as follows:

<span disabled= "Disabled" >
<input id= "Chkblog" type= "checkbox" Name= "Chkblog" disabled= "disabled"/>
<label for= "Chkblog" >http://owen-zhang.cnblogs.com</label>
</span>

The original CheckBox control when the Enable property is False, the output into HTML becomes a set of controls (element) rather than one of the controls we expect.

Programme I:

In the code above, although we changed the disabled property of the Chkblog control to false, the disabled property of the Chkblog control's parent node (<span>) is disabled. This has a priority problem, usually the parent node priority is greater than the child node, so we want to change the parent node disabled value, the above client script code to do a little bit of modification, as follows:

<script type= "Text/javascript" >
    function foo () {
      var chk = document.getElementById ("<%= Chkblog.clientid%> ");
      if (chk.disabled) {
        chk.parentNode.disabled = false;
        chk.disabled = false;
      }
      else {
        chk.parentNode.disabled = true;
        Chk.disabled = true;
      }
    }
  </script>

Only add the code highlighted above.

Programme II:

Using scenario one, you must add an additional statement that changes the disabled attribute of the parent node, which is more troublesome when you want to modify it, and does not conform to the usual code logic and has redundant code. Is there any other way to be more concise? Yes, we just need to modify the background code as follows:

  protected void Page_Load (object sender, EventArgs e)
  {
    this.chkBlog.InputAttributes.Add ("Disabled", " Disabled ");
  }

That is, instead of changing the checkbox's Enable property, we change the HTML content of the checkbox output to the client by setting the property in Inputattributes, as follows:

<input id= "Chkblog" type= "checkbox" Name= "Chkblog" disabled= "disabled"/> <label for= "Chkblog" >http
://owen-zhang.cnblogs.com</label>

Previously "redundant" parent node, not now.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.