Thursday, July 31, 2014

Genealogy View(family tree) in ASP.NET C# with database

In my previous post I shown how to find no of nodes in left and right of a binary tree. Now in this article I will show you how to design the binary tree in ASP.NET  C#. We had retrieve the data from database in the previous post. I remain the database structure same in this example as previous.

Database structure :

-------------------------------------------------------
Id(int) | Parent_Id (int) | Placement (NVarChar(10))
-------------------------------------------------------
1          0                        -
2          1                        Left
3          1                        Right
4          2                        Left
5          2                        Right
-------------------------------------------------------


CREATE TABLE [dbo].[tblBinaryUsers](
    [tid_no] [nvarchar](50) NULL,
    [placement] [nchar](10) NULL,
    [parent_no] [nvarchar](50) NULL,
    [First_name] [nvarchar](50) NULL,
    [enroll_time] [nvarchar](50) NULL
)  


And insert into the table 

INSERT [dbo].[tblBinaryUsers] ([tid_no], [placement], [parent_no], [First_name], [enroll_time]) VALUES (N'100001', N'', NULL, N'Arkadeep De', N'6/7/2014')

INSERT [dbo].[tblBinaryUsers] ([tid_no], [placement], [parent_no], [First_name], [enroll_time]) VALUES (N'100002', N'Left', N'100001', N'Pradeep Das', N'8/7/2014')


INSERT [dbo].[tblBinaryUsers] ([tid_no], [placement], [parent_no], [First_name], [enroll_time]) VALUES (N'100003', N'Right', N'100001', N'Mekesh Nayak', N'9/7/2014')


I added two more fields with this structure. First_Name (nvarchar(255)) and Enroll_Time  (nvarchar(20)). 

First decide how many levels you want to show in the binary tree. Then design according to that Laval. Here I have done with 4 levels. 

So design the html first and then write the coding. I also added a search facility in this project to find the ID with a DropDownList. 
 Your design will be some thing like this.

 
As the code is little bit long I am not giving these here. But don't worry here is the link where you can download the full source code.

Your output will be like this.
Download the full source code here.



14 comments:

  1. This Project Very useful. Long days i searching to this model project. So, Please give me another model genealogy

    ReplyDelete
  2. great share.. i am looking for this code.. thanks you very much... like to share this article on my blog www.dotnetspan.com

    ReplyDelete
  3. Hi can you please help me how to understand genealogy tree in the beginning of your tutorial?

    ReplyDelete
  4. Hey this download link is not working please give me this code i really want it

    ReplyDelete
  5. Hello..
    I'm doing project on Multi Level Marketing and I got stuck at graphical representation of genealogy tree.
    I found your post on this blog which can help me out but I'm unable to download source code.
    Can u please mail me this source code at sutar.pratik@gmail.com

    Thanks in advance...!!!

    ReplyDelete
  6. Gostaria muito de baixar, porém:

    Box - https://app.box.com/s/g0yy9kba25yo0wbvg7yx:
    O usuário que hospeda este conteúdo está fora da largura de banda.

    "Se este é o seu arquivo, atualize para adicionar mais créditos de largura de banda à sua conta. Ligue para Vendas +1 650 329 1210 para obter mais informações."
    https://app.box.com/index.php?rm=box_download_shared_file&shared_name=g0yy9kba25yo0wbvg7yx&file_id=f_19524896743

    ReplyDelete
  7. Can't download your source code

    ReplyDelete
  8. Hello Sir, You have inserted parent_no manually in your database. How parent Id will be auto increment.

    ReplyDelete
  9. Sir, How to get all the data ? And you have inserted manually in database. I want it as to insert from server

    ReplyDelete

Popular Posts

Pageviews