Tuesday, 17 September 2013

Convert Scanning For className JavaScript block to use jQuery

Convert Scanning For className JavaScript block to use jQuery

I have a small block I wanted to convert to using jQuery for a couple of
different purposes, but mainly to reverse engineer how it works to imporve
my jQuery skills. I tried taking a go at it, but could not figure out all
of the conversions.
The following Javascript block iterated through the checkboxes rendered in
an ASP.NET TreeView control client-side and scan for checkboxes with a
className=disabledTreeviewNode (this equivilent functionality cannot be
achieved purely server side).
function DisableCheckBoxes(treeviewClientID) {
var treeView = document.getElementById(treeviewClientID);
if (treeView) {
//Get all the checkboxes which are 'inputs' in the treeview
var childCheckBoxes = treeView.getElementsByTagName("input");
//Iterate through the checkboxes and disable any checkbox that has
a className="disabledTreeviewNode"
for (var i = 0; i < childCheckBoxes.length; i++) {
var textSpan =
childCheckBoxes[i].parentNode.getElementsByTagName("span")[0];
if (textSpan != null && textSpan.firstChild)
if (textSpan.className == "disabledTreeviewNode" ||
textSpan.firstChild.className == "disabledTreeviewNode")
childCheckBoxes[i].disabled = true;
}
}
}
I tried changing the following:
var treeView = document.getElementById(treeviewClientID);
to
var treeView = $('#' + treeviewClientID);
However then I could no longer call getElementsByTagName. I tried to use
the jQuery equivilent of .find but then the code started to behave
differently and I was a bit lost.
Can anyone assist on converting this small block to use jQuery? Comments
are welcome as to if this is worthwhile or even if there is a better way.

No comments:

Post a Comment