Web App - Dashboard Type GUI - Interface

Question

I'm looking to create a dashboard type gui for a web application. I'm looking for the user to be able to drag and drop different elements (probably either image buttons, anchor tags, or maybe just divs) to different (defined) places and be able to save their setup (in a cookie or on the server). I'm working with c# in the .Net 2.0 framework. I've tried using mootools but their recent update has left their drag/drop capabilities un-useful for me. I'm looking for a bit of direction because I know there is something out there that is just what I'm looking for so I wont have to build from scratch.

Thanks.

Answer 1

I prefer using jQuery for AJAXy stuff like that. It also has a lot of very good plugins that make writing client-side code very easy.

Here is the plugin page specifically for Drag-n-Drop.

http://plugins.jquery.com/project/Plugins/category/45

Ajax callback are also very easy so saving the setup should be fairly easy as well.

Answer 2

I used the Microsoft ASP.Net Ajax and AjaxControlToolkit to do something like this. They have a ResizeableControl and a DragPanel. I used these, then hosted an IFrame inside the panel to display the content.

Worked pretty well.

---

This site:

http://www.asp.net/learn/videos/default.aspx?tabid=63#ajax

Has lots of tutorial videos that show you how to get started using the controls.

Answer 3

You might want to look at DropThings on Codeplex.

Answer 4

I have been looking at this kind of functionality myself recently and have decided on using jQuery with the help of jQuery UI. I came across a large amount of information that also suggested Yahoo UI (YUI), I had already started learning jQuery due to the AJAX support that it offers, so I stuck with it.

jQuery UI Site
jQuery UI Documentation
Example of a drag and drop screen layout with jQuery UI
Introduction to jQuery UI

If you decide to use the YUI javascript library, here is a link to a vast amount of videos to help get you started.

http://developer.yahoo.com/yui/theater/

Answer 5

If you still want to give MooTools a second chance, I'd recommend taking a look at Mocha UI.

Answer 6

Some alternatives may be;

1. You can use ExtJS. If you have seperate aspx pages you can display them in Tabs or panels.
2. You can use Webpart Framework. If your users work only in IE and use SQL Server this is fine.
3. Also there is one more professional alternative. Dynamic Dashboards.
4. You can implement your solution if you like using IFrames.