PDA

View Full Version : دستیابی به فرزندان در ساختار درختی



sara333
پنج شنبه 01 دی 1390, 10:31 صبح
سلام
یه سوالی داشتم اگر راهنمایی کنید ممنون میشم
من یه ساختار درختی رو با استفاده از توابع بازگشتی ( php ) پیاده سازی کردم و در هر شاخه یه چکباکس گذاشتم و قراره که اگر مثلا یه چکباکس در سرشاخه رو تیک زدم تمام فرزنداش تا پایین تیک بخورن . حالا مشکلم با jQuery هست .من از همچین کدی استفاده کردم :

$('input:checkbox[name='+id+']').nextAll().css('background-color', 'red');


و وقتی اجراش میکنم کاملا درست عمل میکنه و شاخه های درختم تا پایین دارای بکگراند قرمز میشن ولی وقتی میخوام این مورد رو روی چک خوردن یا نخوردن چکباکس ها اعمال کنم نمیشه .من زیاد jQuery بلد نیستم میتونید راهنمایی کنید ؟


$('input:checkbox[name='+id+']').nextAll().attr("checked",true);

mehdi.mousavi
پنج شنبه 01 دی 1390, 13:14 عصر
سلام.
براتون امکان داره کد HTML تولید شده توسط PHP رو اینجا قرار بدید؟ یه درخت با چند تا شاخه تا ببینم
دلیل عدم تغییر وضعیت Checkbox ها چیه. ضمنا بفرمایید از کدوم نسخه از jQuery استفاده می کنید.

موفق باشید.

Rejnev
پنج شنبه 01 دی 1390, 13:42 عصر
این رو هم تست کنید:

// Check #x
$("#x").attr('checked', 'checked');
// Uncheck #x
$("#x").removeAttr('checked');

sara333
پنج شنبه 01 دی 1390, 14:20 عصر
سلام بابت پیگیریتون ممنون
فکر میکنم ورژنش
jQuery JavaScript Library v1.4.2
باشه .
راستش من آمدن یه جورایی سر این کد هامو کلاه گذاشتم و id هر تگ checkbox تو هر شاخه رو به عنوان name تک checkboxام در شاخه زیریش قرار دادم .
بعد با استفاده از find :
$('#newPermissionValue').find('input:checkbox[name='+id+']').attr("checked",true);
میتونم یه سطح پایین تر رو ببینم و چکباکس های اون رو تیک بزنم و مشکلی ندارم ولی میخوام تا پایین ترین سطح این اتفاق بیوفته . مشکل من اینه که نمیتونم از
.nextAll()
استفاده کنم راستش از children() و parent() و parents() هم وقتی میخوام برای checkbox هام استفاده کنم هیچ اتفاقی نمیافته ولی دقیقا وقتی به جای attr از css استفاده میکنم جواب میده ! و اون css تا آخرین شاخه اعمال میشه !

mehdi.mousavi
جمعه 02 دی 1390, 01:13 صبح
سلام مجدد.
لطفا بخشی از کدهای HTML تولید شده رو اینجا قرار بدید (یه درخت با چند تا شاخه) تا من مشکل رو بررسی کنم.
اینطوری بدون دیدن کدهای HTML نمیدونم DOM شما چه ساختاری داره و نمی تونم کمکی کنم.

موفق باشید.

sara333
شنبه 03 دی 1390, 10:16 صبح
اینم کد html :



public function createTree($id)
{
$html .= "<ul id='$id'>";
$html .= "<li ><input type='checkbox' id='menu_" . $id . "' class='checkbox' onchange='setCheckValue(this.checked,this.id)' ><a href='#'>" . $this->language->translate("mainMenu", "Tree") . "</a>";
$html .= $this->createTreeBranch($id);
$html .= "</li></ul><script>$('#" . $id . "').treeview({collapsed:true});</script>";
return $html;
}
public function createTreeBranch($id)
{

$module = $this->permissionValue->getModule();
if (count($module) > 0 )
{
$html .= "<ul>";

for ($i = 0 ; $i < count($module); $i++)
{

$html .= "<li id='module_" . $module[$i][id] . "'><input type='checkbox' id='module_" . $module[$i][id] . "' class='checkbox' name='menu_".$id."' onchange='setCheckValue(this.checked,this.id)' ><a title='" . $module[$i][description]. "' href='#'>".$module[$i][name]."</a>";
$mainMenu = $this->permissionValue->getMainMenu($module[$i]['id']);
if (count($mainMenu) > 0 )
{
$html .= "<ul>";

for ($j = 0 ; $j < count($mainMenu); $j++)
{
$html .= "<li id='mainMenu_" . $mainMenu[$j][id] . "'><input type='checkbox' id='mainMenu_" . $mainMenu[$j][id] . "' class='checkbox' name='module_" . $module . "' onchange='setCheckValue(this.checked,this.id)' ><a title='".$mainMenu[$j][description]."' href='#' >".$mainMenu[$j][name]."</a>";
$subMenu = $this->permissionValue->getSubMenu($mainMenu[$j]['id']);
if (count($subMenu) > 0 )
{
$html .= "<ul>";
for ($k = 0 ; $k < count($subMenu); $k++)
{
$html .= "<li id='subMenu_" . $subMenu[$k][id] . "'><input type='checkbox' id='subMenu_" . $subMenu[$k][id] . "' class='checkbox' name='mainMenu_" . $mainMenu . "' onchange='setCheckValue(this.checked,this.id)' ><a title='".$subMenu[$k][description]."' href='#' >".$subMenu[$k][name]."</a>";
if($subMenu[$k]['id'] == '8' || $subMenu[$k]['id'] == '13')
{
$action = $this->permissionValue->getAction($subMenu[$k]['id']);
if (count($action) > 0 )
{
$html .= "<ul>";
for ($l = 0 ; $l < count($action); $l++)
$html .= "<li id='action_" . $action[$l][id] . "'><input type='checkbox' id='action_" . $action[$l][id] . "' class='checkbox' name='subMenu_" . $subMenu . "' onchange='setCheckValue(this.checked,this.id)' ><a title='".$action[$l][description]."' href='#' >".$action[$l][name]."</a>";

$html .= "</ul>";
}
}
}
$html .= "</ul>";
}
}
$html .= "</ul>";
}

}
$html .= "</ul>";
}

$html .= "</li>";

return $html;
}

alismith
دوشنبه 05 دی 1390, 23:41 عصر
سلام

کد رو اینجا گذاشتم تا شاید دوستان دیگری هم که نیاز به همچین ساختاری دارن بهشون کمکی کرده باشم

فقط کافیه به منو اصلی یک id بدی و اون رو در اختیار تابع قرار بدی

این تابع ای که نوشتم شامل 3 پارامتر هستش که می تونی به وسیله اون رنگ ایتم های اول منو و زیر ایتم ها و عنوان هر زیر منو رو مشخص کنی

ساختار html و روش استفاده از تابع و همچنین یک مثال کاربردی از برنامه به همراه یک فایل قرار میدم.

منو نمونه :


<ul id="menu1">

<li><input type="checkbox" />item1:
<ul>
<li><input type="checkbox"/>rooTitem1-submenu1-item1</li>
<li name="sm"><input type="checkbox"/>rooTitem1-submenu1-item2:
<ul>
<li><input type="checkbox"/>subItem1-submenu2-item1</li>
<li><input type="checkbox"/>subItem1-submenu2-item2</li>
</ul>
</li>
<li><input type="checkbox" />rooTitem1-submenu1-item3</li>
</ul>
</li>
<li><input type="checkbox" />item2:
<ul>
<li><input type="checkbox"/>rooTitem1-submenu1-item1</li>
<li><input type="checkbox"/>rooTitem1-submenu1-item2</li>
<li name="sm"><input type="checkbox"/>rooTitem1-submenu1-item3:
<ul>
<li><input type="checkbox"/>subItem1-submenu2-item1</li>
<li><input type="checkbox"/>subItem1-submenu2-item2</li>
<li name="sm"><input type="checkbox" />subItem1-submenu2-item3:
<ul>
<li><input type="checkbox"/>subItem1-submenu3-item1</li>
<li><input type="checkbox"/>subItem1-submenu3-item2</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li><input type="checkbox" />item3:
<ul>
<li><input type="checkbox"/>rooTitem1-submenu1-item1</li>
<li><input type="checkbox"/>rooTitem1-submenu1-item2</li>
</ul>
</li>
</ul>


اینجا گزینه های مهم و قابل توضیح یک انتخاب id برای منو اصلی و قرار دادن مقدار sm برای handler هر subMenu
نکته : قرار دادن مقدار sm برای هر زیر منو مطابق مثال بالا الزامی است.

فراخوانی تابع سازنده منو :

$("#menu1").TreeMenu({

ParentColor: '#000',
ChildColor: '#434343',
smHandlerColor: '#f00'

});

کاملا واضح هست و نیاز به توضیح نداره، شما id منو رو میدی به تابع و از طریق اون سه متغییر ، رنگ بخش های مختلف منو رو که قبلا گفتم، مشخص می کنید.

یک مثال کاربردی و عملی براتون قرار میدم :

79757

مطابق مثال و فایلی که قرار دادم، کافی هستش id منو خروجی از کدهای php رو به این تابع نسبت بدی

استفاده از این تابع برای منو هایی که زیر منو نامحدود دارن مناسب هست.



موفق باشید