how to create different boxes like calender in jsf

Asked May 30 '14 at 19:51

Active May 30 '14 at 20:36

Viewed 181 times

I have website where I want to see todays calender with appointments have for the doctor.

What I want to create is somewhat like below.

However instead of days, it will be minutes and all timings would be coming from database.

Let's say I have timing from 8:00 AM to 4:00 PM each with interval of 30 minutes.

What I want is like below structure using JSF.

Any idea how can I do this?

I know how to use datatables & get all this data in arraylist. For me issue in how can I design using HTML and CSS.

Note: All those squares will be buttons as I can edit those appointments also or I can make booking for that appointment too.

Edit 1

What I could do is use h:dataTable and bring the data from the array list... but for me the problem is on same button showing the name and button... is that possible?

Let's say I want in below way.

---------------
|  Time       |
|             |
|  Name       |
---------------

Box I can make as button, but how can I write Name and Time over same box?

edited May 30 '14 at 20:36

asked May 30 '14 at 19:51

user3692652

@ChristianGollhardt : see my updated question... I can make boxes using button, however for me the concern is writing time and name over button... how can i do that? – user3692652 May 30 '14 at 20:37
@user3692652 We don't want to see what you could do, but what you have done! – Alexandre Lavoie May 30 '14 at 20:40
I believe Primefaces has something like this, if you don't want to recreate the wheel @user3692652 – Josef E. May 30 '14 at 20:42
@JosefE. : could you please share link for the same? – user3692652 May 30 '14 at 22:33
@AlexandreLavoie : As I stated, I have created dataTables where I have buttons... now concern for me is how can I write Time and Name over button? – user3692652 May 30 '14 at 22:35
1

@user3692652 You didn't show any code from what you've done... here is the link for the PrimeFaces solution : http://www.primefaces.org/showcase/ui/data/schedule.xhtml – Alexandre Lavoie May 30 '14 at 23:20
@user3692652 Alexandre beat me to it :P – Josef E. May 31 '14 at 00:20

how to create different boxes like calender in jsf

Edit 1

0 Answers0