PDA

View Full Version : سوال: ایجاد Tree view با ul و li به صورت داینامیک


javad3151
شنبه 22 آبان 1389, 18:43 عصر
سلام
یه منو دارم که با JQuery نوشته شده و دیتای داخل اون باید به صورت داینامیک از دیتابیس خونده بشه ، ساختار جدول دیتابیس:
MenuID
Title
ParentID
بنابراین هر منو میتونه بی نهایت زیر منو داشته باشه ، حالا در سطح برنامه چطور میشه دیتا رو از دیتابیس خوند و به صورت تگ های <ul> & <li> در صفحه نشون داد؟ که خروجی یه چیزی به این صورت باشه:



<ul class="menu">
<li><a href="#" class="parent"><span>Home</span></a>
<ul>
<li><a href="#" class="parent"><span>Sub Item 1</span></a>
<ul>
<li><a href="#" class="parent"><span>Sub Item 1.1</span></a>
<ul>
<li><a href="#"><span>Sub Item 1.1.1</span></a></li>
<li><a href="#"><span>Sub Item 1.1.2</span></a></li>
</ul>
</li>
<li><a href="#"><span>Sub Item 1.2</span></a></li>
<li><a href="#"><span>Sub Item 1.3</span></a></li>
<li><a href="#"><span>Sub Item 1.4</span></a></li>
<li><a href="#"><span>Sub Item 1.5</span></a></li>
<li><a href="#"><span>Sub Item 1.6</span></a></li>
<li><a href="#" class="parent"><span>Sub Item 1.7</span></a>
<ul>
<li><a href="#"><span>Sub Item 1.7.1</span></a></li>
<li><a href="#"><span>Sub Item 1.7.2</span></a></li>
</ul>
</li>
</ul>
</li>
<li><a href="#"><span>Sub Item 2</span></a></li>
<li><a href="#"><span>Sub Item 3</span></a></li>
</ul>
</li>
<li><a href="#" class="parent"><span>Product Info</span></a>
<ul>
<li><a href="#" class="parent"><span>Sub Item 1</span></a>
<ul>
<li><a href="#"><span>Sub Item 1.1</span></a></li>
<li><a href="#"><span>Sub Item 1.2</span></a></li>
</ul>
</li>
<li><a href="#" class="parent"><span>Sub Item 2</span></a>
<ul>
<li><a href="#"><span>Sub Item 2.1</span></a></li>
<li><a href="#"><span>Sub Item 2.2</span></a></li>
</ul>
</li>
<li><a href="#"><span>Sub Item 3</span></a></li>
<li><a href="#"><span>Sub Item 4</span></a></li>
<li><a href="#"><span>Sub Item 5</span></a></li>
<li><a href="#"><span>Sub Item 6</span></a></li>
<li><a href="#"><span>Sub Item 7</span></a></li>
</ul>
</li>
<li><a href="#"><span>Help</span></a></li>
<li class="last"><a href="#"><span>Contacts</span></a></li>
</ul>
Ahmadgolagha
یک شنبه 23 آبان 1389, 11:37 صبح
منم چند وقته دنبال همچین چیزی هستم

لود treeView به طور مستقیم از دیتابیس را اینجا می زارم

لینک زیر هم فکر کنم مفید باشه، اضافه کردن نود با کد جاوا اسکریپت و جی کوئری رو داره (شاید بشه ازش الهام گرفت)
http://www.dynamicdrive.com/dynamicindex1/treeview/index.htm

اگه وقت کردم خودم هم روش کار می کنم ولی دوستان هم لطف کنن یه راهنمایی بکنن

یه بزرگواری بگه الگوریتم چیدن شاخه و زیر شاخه توسط منو و درخت چطوری

فکر کنم تا حالا چندبار پرسیده شده و کسی جواب کاملی نداده، جسارت نباشه دوستان فقط امثال ممبرشیپ و موارد عمومی را اینجا مطرح می کنن، اگه سوال جدید باشه کسی به خودش زحمت نمی ده (منم باشم نمی دم) :لبخندساده:
javad3151
یک شنبه 23 آبان 1389, 19:25 عصر
دوست عزیز ممنون که زحمت کشیدید


لود treeView به طور مستقیم از دیتابیس را اینجا می زارم

من نمی خوام از کنترل های دات نت استفاده کنم، اتفاقا روی همین ساختار، از کنترل منوی دات نت استفاده کردم و بوسیله کنترل ساده XML Datasource & Menu خودش همه کار رو انجام داده ولی مشکل اینجاست که افکت نمیخوره



لینک زیر هم فکر کنم مفید باشه، اضافه کردن نود با کد جاوا اسکریپت و جی کوئری رو داره (شاید بشه ازش الهام گرفت)
http://www.dynamicdrive.com/dynamici...view/index.htm (http://www.dynamicdrive.com/dynamicindex1/treeview/index.htm)



من هم منوهای شبیه این -JQuery - دارم ولی مشکل توی ساخت محتوا است چون باید محتوی رو سمت سرور و با استفاده از اطلاعات دیتابیس - به صورت داینامیک -درست کنم
alonemm
یک شنبه 23 آبان 1389, 19:58 عصر
میتونید یک تگ اسکریپت ایجاد کنید و در بین کدها تون یک حلقه از اطلاعات جدول رو نمایش بدهید.
khorsandreza
یک شنبه 23 آبان 1389, 20:17 عصر
سلام
من یک نمونه تجربه کوچلو در مور Tree View و کاردیون کار کردم ببنید
http://www.barnamenevis.org/forum/showthread.php?t=247252
و
http://www.barnamenevis.org/forum/showthread.php?t=247216
ببنید به دردت می خورد؟
واین آخری هم دقیقا بروشی که گفتین نوشته شده
http://www.barnamenevis.org/forum/showthread.php?t=256542
در پست چهار و 12 نگاه کن شاید ..
موفق باشی
Ahmadgolagha
دوشنبه 24 آبان 1389, 11:52 صبح
من تونستم Tree view با ul و li به صورت داینامیک را ایجاد کنم
سورش رو گذاشتم
ولی مشکلی هست فعلا فقط دو سطحی است

دوستان یه یا علی دیگه بگن تمومه
برای خواندن اطلاعات و پرکردن درخت خود دات نت از یه تابع بازگشتی استفاده شده که خیلی تمیزه با چند خط کد انجام داده
ولی برای درخت ایجاد شده با ul , li , css , jquery از روش khorsandreza استفاده کردم که 2 حلقه تو در تو هست و کدهای html را رندر کردم
اگه این دو روش با هم ادغام بشه فکر کنم بحث درخت داینامیک چندسطحی تموم بشه



دوست عزیز ممنون که زحمت کشیدید
من هم منوهای شبیه این -JQuery - دارم ولی مشکل توی ساخت محتوا است چون باید محتوی رو سمت سرور و با استفاده از اطلاعات دیتابیس - به صورت داینامیک -درست کنم
وقتی اطلاعات را به صورت داینامیک از دیتابیس بخونی با ساخت تگ های html در کد هر کامپوننتی می تونی بسازی مثل این فایل جدید من



میتونید یک تگ اسکریپت ایجاد کنید و در بین کدها تون یک حلقه از اطلاعات جدول رو نمایش بدهید.

مشکلش همین حلقه هست که شما می گید،



سلام
من یک نمونه تجربه کوچلو در مور Tree View و کاردیون کار کردم ببنید
http://www.barnamenevis.org/forum/showthread.php?t=247252

دست شما درد نکنه از روی کدهای شما تونستم این کار را انجام بدم
javad3151
سه شنبه 25 آبان 1389, 12:03 عصر
ممنون از راهنمایی های همه
در تمام حالت هایی که دوستان پیشنهاد دادند یه مشکل جدید هم وجود داره : دیتا به صورت سورت شده نیست

خدارو شکر بالاخره کل پروژه انجام شد بدون محدودیت در تعداد ساب منو ها و در سطح دیتابیس(برای اینکه سرعت بالاتر باشه ) :



/****** Object: Table [dbo].[menu_t] Script Date: 11/16/2010 11:16:16 ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
CREATE TABLE [dbo].[menu_t](
[ServiceID] [int] IDENTITY(1,1) NOT NULL,
[ServiceName] [nvarchar](100) NULL,
[createdate] [smalldatetime] NOT NULL,
[service_order] [int] NULL,
[showdefault] [bit] NULL,
[ParentID] [int] NULL,
[Url] [nvarchar](50) NULL,
[Description] [nvarchar](150) NOT NULL,
CONSTRAINT [PK_menu_t] PRIMARY KEY CLUSTERED
(
[ServiceID] ASC
)WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]
) ON [PRIMARY]
GO
SET IDENTITY_INSERT [dbo].[menu_t] ON
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [Url], [Description]) VALUES (1, N'Home', '2010/2/2', NULL, 0, NULL, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [Url], [Description]) VALUES (2, N'Product', '2010/2/2', NULL, 0, NULL, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [Url], [Description]) VALUES (3, N'ContactUS', '2010/2/2', NULL, 0, NULL, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [Url], [Description]) VALUES (4, N'Library', '2010/2/2', NULL, 0, NULL, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [Url], [Description]) VALUES (5, N'Software', '2010/2/2', NULL, 0, 2, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [Url], [Description]) VALUES (6, N'Hardware', '2010/2/2', NULL, 0, 2, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [Url], [Description]) VALUES (7, N'asp.net', '2010/2/2', NULL, 0, 4, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [Url], [Description]) VALUES (8, N'sql server', '2010/2/2', NULL, 0, 4, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [Url], [Description]) VALUES (9, N'Video Cart', '2010/2/2', NULL, 0, 6, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [Url], [Description]) VALUES (10, N'MS Office2010', '2010/2/2', NULL, 0, 5, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [Url], [Description]) VALUES (11, N'AntiVirus', '2010/2/2', NULL, 0, 5, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [Url], [Description]) VALUES (12, N'Reporting service', '2010/2/2', NULL, 0, 8, NULL, N'')
SET IDENTITY_INSERT [dbo].[menu_t] OFF
/****** Object: UserDefinedFunction [dbo].[FN_MenuAddNode] Script Date: 11/16/2010 11:16:18 ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
--select distinct * from menu_t A
--left outer join menu_t B on a.ParentID =b.ParentID

CREATE function [dbo].[FN_MenuAddNode]
(@SID int)
RETURNS nvarchar(4000)
as
Begin

declare @MenuString nvarchar(4000)=''
declare @haveChild int=0

set @MenuString=(select ServiceName from menu_t where serviceid=@SID )
set @haveChild=(select COUNT(*) from menu_t where ParentID=@SID )

if @haveChild=0
begin
set @MenuString='<li>'+ @MenuString + '</li>'
end

if @haveChild>0 begin
set @MenuString='<li>'+ @MenuString + '<ul>'
declare @sid2 int
DECLARE contact_cursor2 CURSOR FOR

SELECT serviceid from menu_t where parentid=@sid

OPEN contact_cursor2
FETCH NEXT FROM contact_cursor2
INTO @sid2
WHILE @@FETCH_STATUS = 0
BEGIN
set @MenuString =@MenuString+dbo.FN_MenuAddNode(@sid2)
FETCH NEXT FROM contact_cursor2
INTO @sid2
END
set @MenuString= @MenuString + '</ul></li>'
CLOSE contact_cursor2
DEALLOCATE contact_cursor2
end
return @MenuString
end
GO
/****** Object: StoredProcedure [dbo].[sp_MenuGenerate] Script Date: 11/16/2010 11:16:18 ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
create proc [dbo].[sp_MenuGenerate]
as
declare @MenuStringFinal nvarchar(max)=''
declare @sid3 int
DECLARE CurSor01 CURSOR FOR
SELECT serviceid from menu_t where parentid is null

OPEN CurSor01
FETCH NEXT FROM CurSor01
INTO @sid3
WHILE @@FETCH_STATUS = 0
BEGIN
set @MenuStringFinal =@MenuStringFinal+dbo.FN_MenuAddNode(@sid3)
FETCH NEXT FROM CurSor01
INTO @sid3
END

CLOSE CurSor01
DEALLOCATE CurSor01
select @MenuStringFinal
GO
/****** Object: Default [DF__menu_t__createda__0F975522] Script Date: 11/16/2010 11:16:16 ******/
ALTER TABLE [dbo].[menu_t] ADD DEFAULT (getdate()) FOR [createdate]
GO
/****** Object: Default [DF__menu_t__showdefa__108B795B] Script Date: 11/16/2010 11:16:16 ******/
ALTER TABLE [dbo].[menu_t] ADD DEFAULT ((0)) FOR [showdefault]
GO
/****** Object: Default [DF__menu_t__Descript__117F9D94] Script Date: 11/16/2010 11:16:16 ******/
ALTER TABLE [dbo].[menu_t] ADD DEFAULT ('') FOR [Description]
GO
unishomal
چهارشنبه 26 آبان 1389, 13:29 عصر
ممنون از راهنمایی های همه
در تمام حالت هایی که دوستان پیشنهاد دادند یه مشکل جدید هم وجود داره : دیتا به صورت سورت شده نیست

خدارو شکر بالاخره کل پروژه انجام شد بدون محدودیت در تعداد ساب منو ها و در سطح دیتابیس(برای اینکه سرعت بالاتر باشه ) :



/****** Object: Table [dbo].[menu_t] Script Date: 11/16/2010 11:16:16 ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
CREATE TABLE [dbo].[menu_t](
[ServiceID] [int] IDENTITY(1,1) NOT NULL,
[ServiceName] [nvarchar](100) NULL,
[createdate] [smalldatetime] NOT NULL,
[service_order] [int] NULL,
[showdefault] [bit] NULL,
[ParentID] [int] NULL,
[url] [nvarchar](50) NULL,
[Description] [nvarchar](150) NOT NULL,
CONSTRAINT [PK_menu_t] PRIMARY KEY CLUSTERED
(
[ServiceID] ASC
)WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]
) ON [PRIMARY]
GO
SET IDENTITY_INSERT [dbo].[menu_t] ON
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [url], [Description]) VALUES (1, N'Home', '2010/2/2', NULL, 0, NULL, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [url], [Description]) VALUES (2, N'Product', '2010/2/2', NULL, 0, NULL, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [url], [Description]) VALUES (3, N'ContactUS', '2010/2/2', NULL, 0, NULL, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [url], [Description]) VALUES (4, N'Library', '2010/2/2', NULL, 0, NULL, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [url], [Description]) VALUES (5, N'Software', '2010/2/2', NULL, 0, 2, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [url], [Description]) VALUES (6, N'Hardware', '2010/2/2', NULL, 0, 2, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [url], [Description]) VALUES (7, N'ASP.NET', '2010/2/2', NULL, 0, 4, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [url], [Description]) VALUES (8, N'sql server', '2010/2/2', NULL, 0, 4, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [url], [Description]) VALUES (9, N'Video Cart', '2010/2/2', NULL, 0, 6, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [url], [Description]) VALUES (10, N'MS Office2010', '2010/2/2', NULL, 0, 5, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [url], [Description]) VALUES (11, N'AntiVirus', '2010/2/2', NULL, 0, 5, NULL, N'')
INSERT [dbo].[menu_t] ([ServiceID], [ServiceName], [createdate], [service_order], [showdefault], [ParentID], [url], [Description]) VALUES (12, N'Reporting service', '2010/2/2', NULL, 0, 8, NULL, N'')
SET IDENTITY_INSERT [dbo].[menu_t] OFF
/****** Object: UserDefinedFunction [dbo].[FN_MenuAddNode] Script Date: 11/16/2010 11:16:18 ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
--select distinct * from menu_t A
--left outer join menu_t B on a.ParentID =b.ParentID

CREATE function [dbo].[FN_MenuAddNode]
(@SID int)
RETURNS nvarchar(4000)
as
Begin

declare @MenuString nvarchar(4000)=''
declare @haveChild int=0

set @MenuString=(select ServiceName from menu_t where serviceid=@SID )
set @haveChild=(select COUNT(*) from menu_t where ParentID=@SID )

if @haveChild=0
begin
set @MenuString='<li>'+ @MenuString + '</li>'
end

if @haveChild>0 begin
set @MenuString='<li>'+ @MenuString + '<ul>'
declare @sid2 int
DECLARE contact_cursor2 CURSOR FOR

SELECT serviceid from menu_t where parentid=@sid

OPEN contact_cursor2
FETCH NEXT FROM contact_cursor2
INTO @sid2
WHILE @@FETCH_STATUS = 0
BEGIN
set @MenuString =@MenuString+dbo.FN_MenuAddNode(@sid2)
FETCH NEXT FROM contact_cursor2
INTO @sid2
END
set @MenuString= @MenuString + '</ul></li>'
CLOSE contact_cursor2
DEALLOCATE contact_cursor2
end
return @MenuString
end
GO
/****** Object: StoredProcedure [dbo].[sp_MenuGenerate] Script Date: 11/16/2010 11:16:18 ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
create proc [dbo].[sp_MenuGenerate]
as
declare @MenuStringFinal nvarchar(max)=''
declare @sid3 int
DECLARE CurSor01 CURSOR FOR
SELECT serviceid from menu_t where parentid is null

OPEN CurSor01
FETCH NEXT FROM CurSor01
INTO @sid3
WHILE @@FETCH_STATUS = 0
BEGIN
set @MenuStringFinal =@MenuStringFinal+dbo.FN_MenuAddNode(@sid3)
FETCH NEXT FROM CurSor01
INTO @sid3
END

CLOSE CurSor01
DEALLOCATE CurSor01
select @MenuStringFinal
GO
/****** Object: Default [DF__menu_t__createda__0F975522] Script Date: 11/16/2010 11:16:16 ******/
ALTER TABLE [dbo].[menu_t] ADD DEFAULT (getdate()) FOR [createdate]
GO
/****** Object: Default [DF__menu_t__showdefa__108B795B] Script Date: 11/16/2010 11:16:16 ******/
ALTER TABLE [dbo].[menu_t] ADD DEFAULT ((0)) FOR [showdefault]
GO
/****** Object: Default [DF__menu_t__Descript__117F9D94] Script Date: 11/16/2010 11:16:16 ******/
ALTER TABLE [dbo].[menu_t] ADD DEFAULT ('') FOR [Description]
GO




آقا امکانش هست تو قالب یه پروژه واسه استفاده همه آپلود کنی؟ممنون!