Enjoy yourself,and don't care about others' thinking!
----TiGERTiAN

隨筆-348 評論-598 文章-0 trackbacks-0

jQuery操作JSF中的Checkbox樹

下面的代碼是，當選中父節點，則子節點全選；選中任意一個子節點，則選中父節點

jQuery.noConflict();//與JSF搭配需要這句話，不然會有沖突

jQuery(document).ready(function() {

// Add click event listener to each checkbox in the tree page

// Note! Using this simple selector assumes that there are no other

// checkboxes on the page, if there are other checkboxes then

// selector should be changed

jQuery(":checkbox").click(function(){

updateChildren(this);

updateParent(this);

});

</script>

function updateChildren(currentCheckBox)

{

// Get state of current checkbox (true or false)

var state = currentCheckBox.checked;

// Get parent TABLE, where current checkbox is places

var parentTables = jQuery(currentCheckBox).parents("table");

var parentTable = parentTables[0];

// Get DIV where child nodes with checkboxes are situated

// See http://docs.jquery.com/Traversing/ to get better uderstanding of

// parents() and next()

var childDivs = jQuery(parentTable).next("div");

if( childDivs.length > 0 )

{

var childDiv = childDivs[0];

// Iterate over all child nodes checkboxes and set same state as the

// current checkbox state

jQuery(childDiv).contents().find(":checkbox").each(function() {

this.checked = state;

});

}

//更新父節點的方法，如果子節點全部選中則父節點選中，如果子節點中有一個選中，則父節點也選中

function updateParent(currentCheckbox) {

var parentDivs = jQuery(currentCheckbox).parents("div");

var parentDiv = parentDivs[0];

var hasSelected = false;

jQuery(parentDiv).contents().find(":checkbox").each(function() {

if(this.checked) {

hasSelected = true;

}

});

var parentTables = jQuery(parentDiv).prev("table");

if(parentTables.length > 0)

{

var parentTable = parentTables[0];

var parentCheckboxes = jQuery(parentTable).find(":checkbox");

var parentCheckbox = parentCheckboxes[0];

parentCheckbox.checked = hasSelected ;

}

下面的代碼是，當選中父節點，則子節點全選；選中所有子節點，則選中父節點

jQuery.noConflict();//與JSF搭配需要這句話，不然會有沖突

jQuery(document).ready(function() {

// Add click event listener to each checkbox in the tree page

// Note! Using this simple selector assumes that there are no other

// checkboxes on the page, if there are other checkboxes then

// selector should be changed

jQuery(":checkbox").click(function(){

updateChildren(this);

updateParent(this);

});

</script>

function updateChildren(currentCheckBox)

{

// Get state of current checkbox (true or false)

var state = currentCheckBox.checked;

// Get parent TABLE, where current checkbox is places

var parentTables = jQuery(currentCheckBox).parents("table");

var parentTable = parentTables[0];

// Get DIV where child nodes with checkboxes are situated

// See http://docs.jquery.com/Traversing/ to get better uderstanding of

// parents() and next()

var childDivs = jQuery(parentTable).next("div");

if( childDivs.length > 0 )

{

var childDiv = childDivs[0];

// Iterate over all child nodes checkboxes and set same state as the

// current checkbox state

jQuery(childDiv).contents().find(":checkbox").each(function() {

this.checked = state;

});

}

//更新父節點的方法，如果子節點全部選中則父節點選中，如果子節點中有一個未選中，則父節點也未選中

function updateParent(currentCheckbox) {

var parentDivs = jQuery(currentCheckbox).parents("div");

var parentDiv = parentDivs[0];

var hasSelected = true;

jQuery(parentDiv).contents().find(":checkbox").each(function() {

if(!this.checked) {

hasSelected = false;

}

});

var parentTables = jQuery(parentDiv).prev("table");

if(parentTables.length > 0)

{

var parentTable = parentTables[0];

var parentCheckboxes = jQuery(parentTable).find(":checkbox");

var parentCheckbox = parentCheckboxes[0];

parentCheckbox.checked = hasSelected ;

}

---------------------------------------------------------
專注移動開發
Android, Windows Mobile, iPhone, J2ME, BlackBerry, Symbian

posted on 2009-12-27 22:52 TiGERTiAN 閱讀(2765) 評論(0) 編輯收藏所屬分類: Java 、JSF

新用戶注冊刷新評論列表


只有注冊用戶登錄后才能發表評論。




網站導航: 博客園 IT新聞 Chat2DB C++博客博問管理
相關文章: OSGi and Hadoop and Node.js javacc工具小記 MyEclipse 6.5新序列號，到2013年 OtaNotifier.java Java中無符號整數 C#的BinaryWriter和Java的DataInputStream之間的數據相互轉換在Mac下面下載Android源代碼 [轉]Java通過XML Schema校驗XML [轉]JAVA上加密算法的實現用例 LG GW880(Ophone)開啟ADB調試模式