Solved

How do I create a nested accordian with draggable content in jquery?

Posted on 2015-01-30
2
268 Views
Last Modified: 2015-02-03
Hi all,

I am trying to create a dynamic menu type structure in jQuery.
The idea is to have a nested accordion type structure where each 'group' can be dragged around within the structure.
When it is 'dropped', it's new parent info should be sent using Ajax
Each group should be expandable and collapsible.

Each item within these 'groups' can also be dragged around the structure.
When dropped, the items new group should be sent using Ajax.

There seems to be lots of examples around on the web dealing with either nested accordions or draggable content, but I cannot find anything showing how to use them in combination.

The data that will be used to populate this structure is in two arrays:
Group Array which contains an ID, Group Title and it's parent id (no parent = -1).
Entry Array which contains various properties and the group ID to which it belongs.

If anyone knows the best way to do this I would very much appreciate it.

Many thanks,

James
0
Comment
Question by:jatkin
2 Comments
 
LVL 53

Accepted Solution

by:
COBOLdinosaur earned 500 total points
ID: 40580104
>>> but I cannot find anything showing how to use them in combination.

That should be sending you a message.  What you want to do is very complex.  I doubt you are going to find anything off the shelf that meets those requirements.  So you have two options write it yourself (perhaps by modifying a plugin from the web that does part of the job) or if you lack the skills to work at the complex level required, hire a professional developer with good jquery skills to write it for you.

Cd&
0
 
LVL 4

Author Closing Comment

by:jatkin
ID: 40585670
That is exactly what I have done previously and it works fairly well.
With the amount of jQuery out there now (and there are some stunning examples), I thought that maybe there was a more polished version around to achieve my goals.
I guess for the moment I can live with what I have and perhaps look into doing something more dramatic further down the line.
Thanks for the input though.
0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

This article discusses four methods for overlaying images in a container on a web page
Find out what you should include to make the best professional email signature for your organization.
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…
The viewer will learn how to dynamically set the form action using jQuery.

777 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question