want to show pack of 3 user at a time using jquery

Question

Hi,

I have mutiple user's in sql server table like 10 or so on ,

Requirement: i want to show user with group of 3 user , suppose

user

1. A,
2. B,
3. C
4. D
5. E
6. F
7. E

i want to show it using jquery on div like

A
B
C

---
C
D
E

--
F

note: number of user may changed , based on data. currently 7 and in future it may be 13 or 20 etc.. .

it means group of three user to show it using Div with jquery

or as per db table , output would be like

Qasim
Amir Bay
Mubashir

-------
Sabeen
Nadia
Rana Aslam

-------
Farahan

i want to design output would be like this ( above )
attached is table picture to be showed

Thanks

Answer 1

Hi @Mohammad Qasim ,

I just made an example for your reference as below, which

• Add data in a javascript object
• Use datatable to render the data
• Use datatable drawcallback function to group the rows

More details, you can refer to below demo.

 <div>  
            <table id="example" class="display" style="width: 100%"></table>  
 </div>  
          

You can add data using javascript for testing.
For example, "var dt" equals to
[
{
"id": "1",
"EmployeeName": "Tiger Nixon",
"Designation": "Manager",
"Department": "IT"
},
{
"id": "2",
"EmployeeName": "Garrett Winters",
"Designation": "Head",
"Department": "Account"
},
{
"id": "3",
"EmployeeName": "Ashton Cox",
"Designation": "CIO",
"Department": "Admin"
},
{
"id": "4",
"EmployeeName": "Cedric Kelly",
"Designation": "Director IT",
"Department": "IT"
},
{
"id": "5",
"EmployeeName": "Airi Satou",
"Designation": "CEO",
"Department": "Admin"
},
{
"id": "6",
"EmployeeName": "Bradley Greer",
"Designation": "Engineer",
"Department": "IT"
}];

And the JS codes are as this:

Result:

Best regards,
Sean

---

If the answer is helpful, please click "Accept Answer" and upvote it.

Note: Please follow the steps in our  documentation  to enable e-mail notifications if you want to receive the related email notification for this thread.