Sunday, July 15, 2012

Tree View Checkbox JQuery Selection

Adding JQuery Hierachical Selection

Asp.Net TreeView control is a useful control when hierarchical data representation is required in an .aspx page. The Treeview control inherently supports enabling of checkboxes for node level selection. I came a across a problem where I needed a solution for the following, 1. Checking a node should cause all its child nodes to be selected. 2. Checking a node should cause all its parent nodes to be selected. In order to this it was just a matter of adding a few lines of JQuery to the aspx page. Thanks to JQuery’s wealth of convenient methods it resulted in a few lines. Listed below is the javascript code for your reference.

You can download the DEMO solution from here.

Comments

1 comment:

  1. Jquery is an advanced programming language. Treeview is a best approach to show large amount of data in hierarchical fashion. Compare to Server-side treeview client-side treeview helps to improve performance of a web application. How it is if after fetch data from the server will render those data using client script. There are various of languages using which we can create treeview. Lets talk about JavaScript. JavaScript is a client side language. To create a treeview using JavaScript we required to write more them 100 lines of code. The same treeview can achieved easily with less line of codes using JQuery. Look at this example http://jharaphula.com/jquery-treeview-example-using-html-ul-li-elements

    ReplyDelete

About Me

I am a software developer with over 7+ years of experience, particularly interested in distributed enterprise application development where my focus is on development with the usage of .Net, Java and any other technology that fascinate me.