Jquery tree-view plugin works inconsistently in IE 7 and above
Hi,
We have used C# and MVC 2.0 to populate a treview control using the following:
1.jquery.tree.checkbox.js, a plugin which loads the nodes of the tree-view.
the above tree-view control works fine in Firefox,Chrome but works inconsistently in IE 7 and above versions.
we have used two trees. One is to list un-assigned entities and another one for assigned ones. We are performing the assignment and un-assignment using two HTML buttons.
Code Sample:
1.jquery plugin code:
<script>
(function ($) {
$.extend($.tree.plugins, {
"checkbox": {
defaults: {
three_state: true
},
get_checked: function (t) {
if (!t) t = $.tree.focused();
//return t.container.find("a.checked").parent();
return t.container.find("a.checked, a.undetermined").parent();
},
get_undeterminded: function (t) {
if (!t) t = $.tree.focused();
return t.container.find("a.undetermined").parent();
},
get_unchecked: function (t) {
if (!t) t = $.tree.focused();
return t.container.find("a:not(.checked, .undetermined)").parent();
},
check: function (n) {
if (!n) return false;
var t = $.tree.reference(n);
n = t.get_node(n);
if (n.children("a").hasClass("checked")) return true;
var opts = $.extend(true, {}, $.tree.plugins.checkbox.defaults, t.settings.plugins.checkbox);
if (opts.three_state) {
n.find("li").andSelf().children("a").removeClass("unchecked undetermined").addClass("checked");
n.parents("li").each(function () {
if ($(this).children("ul").find("a:not(.checked):eq(0)").size() > 0) {
$(this).parents("li").andSelf().children("a").removeClass("unchecked checked").addClass("undetermined");
return false;
}
else $(this).children("a").removeClass("unchecked undetermined").addClass("checked");
});
}
else n.children("a").removeClass("unchecked").addClass("checked");
return true;
},
uncheck: function (n) {
if (!n) return false;
var t = $.tree.reference(n);
n = t.get_node(n);
if (n.children("a").hasClass("unchecked")) return true;
var opts = $.extend(true, {}, $.tree.plugins.checkbox.defaults, t.settings.plugins.checkbox);
if (opts.three_state) {
n.find("li").andSelf().children("a").removeClass("checked undetermined").addClass("unchecked");
n.parents("li").each(function () {
if ($(this).find("a.checked, a.undetermined").size() - 1 > 0) {
$(this).parents("li").andSelf().children("a").removeClass("unchecked checked").addClass("undetermined");
return false;
}
else $(this).children("a").removeClass("checked undetermined").addClass("unchecked");
});
}
else n.children("a").removeClass("checked").addClass("unchecked");
return true;
},
toggle: function (n) {
if (!n) return false;
var t = $.tree.reference(n);
n = t.get_node(n);
if (n.children("a").hasClass("checked")) $.tree.plugins.checkbox.uncheck(n);
else $.tree.plugins.checkbox.check(n);
},
callbacks: {
onchange: function (n, t) {
$.tree.plugins.checkbox.toggle(n);
}
}
}
});
})(jQuery);
</script>
2. controller code
public JsonResult Fetch_ApplicationModuleList()
{
try
{
List<Models.AssignApplication>[] App_Details = new List<AssignApplication>[2];
A_obj.Cmp_Id = Convert.ToInt64(Session["Company_Id"].ToString());
App_Details = A_obj.FetchApplicationModuleList(A_obj);
Session["AppAssign_List"] = App_Details;
JsTreeModel[] app_tree = new JsTreeModel[100];
string CompanyId = Session["Company_Id"].ToString();
var appname_list = (from app_name in App_Details[0] select new { app_name.CA_App_name, app_name.MA_Appl_ID }).Distinct().ToList();
for (int app = 0; app < appname_list.Count(); app++)
{
var mainmodule = (from app_name in App_Details[0] where app_name.MA_Appl_ID == Int32.Parse(appname_list[app].MA_Appl_ID.ToString()) select new { app_name.MA_Mainmenu, app_name.MA_Mainmenuid }).Distinct().ToList();
JsTreeModel[] tree = new JsTreeModel[100];
for (int maincount = 0; maincount < mainmodule.Count(); maincount++)//mainmodule count
{
var submainmodule = (from app_name in App_Details[0] where app_name.MA_Mainmenuid == mainmodule[maincount].MA_Mainmenuid && app_name.MA_Submainmenu != "" select new { app_name.MA_Submainmenu, app_name.MA_Submainmenuid }).Distinct().ToList();
JsTreeModel[] child1 = new JsTreeModel[100];
for (int submaincount = 0; submaincount < submainmodule.Count; submaincount++)//submainmodule count
{
var submodule = (from app_name in App_Details[0] where app_name.MA_Submainmenuid == submainmodule[submaincount].MA_Submainmenuid && app_name.MA_Submenu != "" select new { app_name.MA_Submenu, app_name.MA_Submenuid, app_name.MA_id }).Distinct().ToList();
JsTreeModel[] child2 = new JsTreeModel[100];
for (int subcount = 0; subcount < submodule.Count(); subcount++)//submodule count
{
if (submodule[subcount].MA_Submenu != "")
{
child2[subcount] = new JsTreeModel { data = submodule[subcount].MA_Submenu, attributes = new JsTreeAttribute { id = Convert.ToString(submodule[subcount].MA_id) + "mod" } };
}
}
if (submodule.Count() == 0)
{
var submainmodule_1 = (from app_name in App_Details[0] where app_name.MA_Submainmenuid == submainmodule[submaincount].MA_Submainmenuid && app_name.MA_Mainmenuid == mainmodule[maincount].MA_Mainmenuid select new { app_name.MA_Submainmenu, app_name.MA_Submainmenuid, app_name.MA_id }).Distinct().ToList();
child1[submaincount] = new JsTreeModel
{
data = submainmodule[submaincount].MA_Submainmenu,
attributes = new JsTreeAttribute { id = Convert.ToString(submainmodule_1[0].MA_id) + "mod" },
children = child2
};
}
else
{
child1[submaincount] = new JsTreeModel
{
data = submainmodule[submaincount].MA_Submainmenu,
attributes = new JsTreeAttribute { id = "2" },
children = child2
};
}
}
if (submainmodule.Count() == 0)
{
var mainmodule_1 = (from app_name in App_Details[0] where app_name.MA_Mainmenuid == mainmodule[maincount].MA_Mainmenuid select new { app_name.MA_Mainmenu, app_name.MA_Mainmenuid, app_name.MA_id }).Distinct().ToList();
var treetemp = new JsTreeModel
{
data = mainmodule[maincount].MA_Mainmenu,
attributes = new JsTreeAttribute { id = Convert.ToString(mainmodule_1[0].MA_id) + "mod" },
children = child1
};
tree[maincount] = treetemp;
}
else
{
var treetemp = new JsTreeModel
{
data = mainmodule[maincount].MA_Mainmenu,
attributes = new JsTreeAttribute { id = "1" },
children = child1
};
tree[maincount] = treetemp;
}
}//mainmodule
app_tree[app] = new JsTreeModel
{
data = appname_list[app].CA_App_name,
attributes = new JsTreeAttribute { id = Convert.ToString(appname_list[app].MA_Appl_ID) + "app" },
children = tree
};
}//appname
return Json(app_tree);
}
catch (Exception ee)
{//added to implement the error log
err.errorlogging(ee.ToString());
throw;
}
}
public class JsTreeModel
{
public string data;
public JsTreeAttribute attributes;
public JsTreeModel[] children;
}
3.jquery function call on click of buttons
function load_tree() {
//this function is to load unassigned entities
$("#demoTree").tree({ // demotree is the <div> tag where in we load the treeview control
ui: {
theme_name: "checkbox"
},
data: {
type: "json",
opts: {
method: "POST",
url: "/CustomerFunctionality/Fetch_ApplicationModuleList"
}
},
plugins: {
checkbox: {}
},
callback: {
onload: function (tree) {
$('li[selected=true]').each(function () {
$.tree.plugins.checkbox.check(this);
});
}
}
});
//this function is to load assigned entities
$("#demoTree1").tree({ // demotree1 i sthe <div> tag where in we load the treeview control
ui: {
theme_name: "checkbox"
},
data: {
type: "json",
opts: {
method: "POST",
url: "/CustomerFunctionality/Fetch_Assign"
}
},
plugins: {
checkbox: {}
},
callback: {
onload: function (tree) {
$('li[selected=true]').each(function () {
$.tree.plugins.checkbox.check(this);
});
}
}
});
}