Making a calendar/planner with drag/drop functionality?!
Making a calendar/planner with drag/drop functionality?!
Making a calendar/planner with drag/drop functionality?!
Making a calendar/planner with drag/drop functionality?!
Making a calendar/planner with drag/drop functionality?!
Making a calendar/planner with drag/drop functionality?! Making a calendar/planner with drag/drop functionality?! Making a calendar/planner with drag/drop functionality?! Making a calendar/planner with drag/drop functionality?! Making a calendar/planner with drag/drop functionality?! Making a calendar/planner with drag/drop functionality?! Making a calendar/planner with drag/drop functionality?! Making a calendar/planner with drag/drop functionality?!
Making a calendar/planner with drag/drop functionality?! Making a calendar/planner with drag/drop functionality?!
Making a calendar/planner with drag/drop functionality?!
Go Back  Xtreme Visual Basic Talk > > > Making a calendar/planner with drag/drop functionality?!


Reply
 
Thread Tools Display Modes
  #1  
Old 06-17-2008, 07:07 AM
mcdonnc2004's Avatar
mcdonnc2004 mcdonnc2004 is offline
Junior Contributor
 
Join Date: Dec 2003
Location: Liverpool, UK
Posts: 276
Default Making a calendar/planner with drag/drop functionality?!


Hey all,

I need a bit of advice regarding a web app I am working on. Specifically the planner page. The purpose of the page at the moment is to show a list of the drivers down the side of the calendar and the days at the top of it. I have attached a JPEG of how it looks at the moment.

All it is made up of is an ASP.NET Table control and is populated by the following code:

Code:
Dim MyConnectionDriver As SqlConnection Dim MyDataAdapterDriver As SqlDataAdapter Dim MyDataTableDriver As New DataTable Dim MyDataRowDriver As DataRow Dim strSQLDriver As String = "SELECT ....." MyConnectionDriver = New SqlConnection( _ ConfigurationManager.ConnectionStrings("podConnectionString").ConnectionString) MyConnectionDriver.Open() MyDataAdapterDriver = New SqlDataAdapter(strSQLDriver, MyConnectionDriver) MyDataAdapterDriver.Fill(MyDataTableDriver) MyConnectionDriver.Close() Dim r As New TableRow() Dim cellBlank As New TableCell() Dim cellMon As New TableCell() Dim cellTue As New TableCell() Dim cellWed As New TableCell() Dim cellThu As New TableCell() Dim cellFri As New TableCell() Dim cellSat As New TableCell() Dim cellSun As New TableCell() Dim DriverNameCell As New TableCell() cellBlank.CssClass = "DriverPlannerCell" r.Cells.Add(cellBlank) cellMon.Text = "Monday<br /><span style='font-size: 8pt;font-style: italic'>" & GetDateForDayOfWeek(Date.Today, 0) & _ "</span></td>" cellMon.CssClass = "DayPlannerCell" r.Cells.Add(cellMon) cellTue.Text = "Tuesday<br /><span style='font-size: 8pt;font-style: italic'>" & GetDateForDayOfWeek(Date.Today, 1) & _ "</span></td>" cellTue.CssClass = "DayPlannerCell" r.Cells.Add(cellTue) cellWed.Text = "Wednesday<br /><span style='font-size: 8pt;font-style: italic'>" & GetDateForDayOfWeek(Date.Today, 2) & _ "</span></td>" cellWed.CssClass = "DayPlannerCell" r.Cells.Add(cellWed) cellThu.Text = "Thursday<br /><span style='font-size: 8pt;font-style: italic'>" & GetDateForDayOfWeek(Date.Today, 3) & _ "</span></td>" cellThu.CssClass = "DayPlannerCell" r.Cells.Add(cellThu) cellFri.Text = "Friday<br /><span style='font-size: 8pt;font-style: italic'>" & GetDateForDayOfWeek(Date.Today, 4) & _ "</span></td>" cellFri.CssClass = "DayPlannerCell" r.Cells.Add(cellFri) cellSat.Text = "Saturday<br /><span style='font-size: 8pt;font-style: italic'>" & GetDateForDayOfWeek(Date.Today, 5) & _ "</span></td>" cellSat.CssClass = "DayPlannerCell" r.Cells.Add(cellSat) cellSun.Text = "Sunday<br /><span style='font-size: 8pt;font-style: italic'>" & GetDateForDayOfWeek(Date.Today, 6) & _ "</span></td>" cellSun.CssClass = "DayPlannerCell" r.Cells.Add(cellSun) DriverCal.Rows.Add(r) For Each MyDataRowDriver In MyDataTableDriver.Rows DriverNameCell = New TableCell() r = New TableRow() cellMon = New TableCell() cellTue = New TableCell() cellWed = New TableCell() cellThu = New TableCell() cellFri = New TableCell() cellSat = New TableCell() cellSun = New TableCell() DriverNameCell.Text = "<a href='../Driver/DriverOverview.aspx?driverid=" & MyDataRowDriver.Item(1) & _ "'>" & MyDataRowDriver.Item(0) & "</a>" DriverNameCell.CssClass = "DriverNamePlannerCell" r.Cells.Add(DriverNameCell) cellMon.Text = GetDataForDay(GetStartOfWeek(Date.Today, Request.QueryString("datevar")), 0, MyDataRowDriver.Item(0)) cellMon.CssClass = "DriverPlannerJobsCell" r.Cells.Add(cellMon) cellTue.Text = GetDataForDay(GetStartOfWeek(Date.Today, Request.QueryString("datevar")), 1, MyDataRowDriver.Item(0)) cellTue.CssClass = "DriverPlannerJobsCell" r.Cells.Add(cellTue) cellWed.Text = GetDataForDay(GetStartOfWeek(Date.Today, Request.QueryString("datevar")), 2, MyDataRowDriver.Item(0)) cellWed.CssClass = "DriverPlannerJobsCell" r.Cells.Add(cellWed) cellThu.Text = GetDataForDay(GetStartOfWeek(Date.Today, Request.QueryString("datevar")), 3, MyDataRowDriver.Item(0)) cellThu.CssClass = "DriverPlannerJobsCell" r.Cells.Add(cellThu) cellFri.Text = GetDataForDay(GetStartOfWeek(Date.Today, Request.QueryString("datevar")), 4, MyDataRowDriver.Item(0)) cellFri.CssClass = "DriverPlannerJobsCell" r.Cells.Add(cellFri) cellSat.Text = GetDataForDay(GetStartOfWeek(Date.Today, Request.QueryString("datevar")), 5, MyDataRowDriver.Item(0)) cellSat.CssClass = "DriverPlannerJobsCell" r.Cells.Add(cellSat) cellSun.Text = GetDataForDay(GetStartOfWeek(Date.Today, Request.QueryString("datevar")), 6, MyDataRowDriver.Item(0)) cellSun.CssClass = "DriverPlannerJobsCell" r.Cells.Add(cellSun) DriverCal.Rows.Add(r) Next

I have been asked if it could incorporate drag and drop functionality, i.e. so they could drag a job from one day to another or from one driver to another. Obviously the way I have coded it, this functionality would not be possible without changes but I am at a loss of where to go from here! Could I still use the table control but modify how the jobs are generated? The way I see it, if I use the table control I won't be able to detect where the data has been dropped or if it would even be possible to do with a basic table.

Any help on this would be appreciated, I'm stumped!
Attached Images
File Type: jpg calendar.jpg (68.7 KB, 3 views)
Reply With Quote
  #2  
Old 06-17-2008, 08:16 AM
lebb's Avatar
lebbMaking a calendar/planner with drag/drop functionality?! lebb is offline
Disillusioned Code Poet

Retired Moderator
* Guru *
 
Join Date: Apr 2002
Location: Tennessee, USA
Posts: 12,808
Default

I'll preface this by mentioning that I haven't done this before. However, if you have the AJAX Control Toolkit (if not, you can download it from Microsoft's website), you might have a look at the DragPanelExtender or ReorderList controls. They probably don't do exactly what you need out of the box, but the toolkit includes source code, so it would probably be a good starting point for the functionality you are looking for.
__________________
Laura

Ita erat quando hic adveni.
Reply With Quote
  #3  
Old 06-18-2008, 02:57 AM
mcdonnc2004's Avatar
mcdonnc2004 mcdonnc2004 is offline
Junior Contributor
 
Join Date: Dec 2003
Location: Liverpool, UK
Posts: 276
Default

Hi lebb,

Thanks for the suggestion but I already have the AJAX toolkit installed and using many of the components. The problem with the DragPanelExtender is that its really just a floating div that you can move freely around the page. I can't see any functionality in that for achieving my needs. I may look at the reorder control again though.

I'm guessing I really need some kind of customisable GridView control, or make my own and inherit from the standard GridView control (although I've always been unsure on creating custom controls and how the inheriting works)!

Thanks.
Reply With Quote
Reply


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off

Forum Jump

Advertisement:





Free Publications
The ASP.NET 2.0 Anthology
101 Essential Tips, Tricks & Hacks - Free 156 Page Preview. Learn the most practical features and best approaches for ASP.NET.
subscribe
Programmers Heaven C# School Book -Free 338 Page eBook
The Programmers Heaven C# School book covers the .NET framework and the C# language.
subscribe
Build Your Own ASP.NET 3.5 Web Site Using C# & VB, 3rd Edition - Free 219 Page Preview!
This comprehensive step-by-step guide will help get your database-driven ASP.NET web site up and running in no time..
subscribe
Making a calendar/planner with drag/drop functionality?!
Making a calendar/planner with drag/drop functionality?!
Making a calendar/planner with drag/drop functionality?! Making a calendar/planner with drag/drop functionality?!
Making a calendar/planner with drag/drop functionality?!
Making a calendar/planner with drag/drop functionality?!
Making a calendar/planner with drag/drop functionality?! Making a calendar/planner with drag/drop functionality?! Making a calendar/planner with drag/drop functionality?! Making a calendar/planner with drag/drop functionality?! Making a calendar/planner with drag/drop functionality?! Making a calendar/planner with drag/drop functionality?! Making a calendar/planner with drag/drop functionality?!
Making a calendar/planner with drag/drop functionality?!
Making a calendar/planner with drag/drop functionality?!
 
Making a calendar/planner with drag/drop functionality?!
Making a calendar/planner with drag/drop functionality?!
 
-->