Solved

Coldfusion & Javascript framework - which one?

Posted on 2011-09-13
5
336 Views
Last Modified: 2012-05-12
Hi Experts,

I have a question about javascript and coldfusion architecture. I have Coldfusion 9 running on my server and I'm getting ready to add some really cool UI features like drag and drop to it. Essentially, there will be two containers. ContainerA has all the sports activities like 100m, 200m, relay, football, baseball, softball, etc. Container B has several containers within it. These will be schoolA, schoolB, schoolC and so on.

The user should be able to drag each of the sports activities and drop them into whichever school that they wish to. My 2 choices are ext.js and jQuery. Which is the better solution for this kind of interface, why and are there any plugins/modules that are already built to do this, maybe with a lil modification I could customize to my needs?
0
Comment
Question by:roger_v
  • 2
  • 2
5 Comments
 
LVL 15

Expert Comment

by:Tomarse111
ID: 36529757
Well, CF comes with ext built in, but it does tend to be bit "bloatware" and you have to include everything when just trying to make a small UI.

It come down to personal preference really as both have extensive drag n drop modules / components. I would personally recommend jQuery, simply because I have found it to be easiest to use from a beginners point of view. You can also customise it a lot easier than the native libraries.

Some exmaple of jQuery drag and drop are:

http://jqueryui.com/demos/draggable/
http://jqueryui.com/demos/droppable/

or maybe even the sortable

http://jqueryui.com/demos/sortable/

Hope that helps

:)
0
 
LVL 1

Author Comment

by:roger_v
ID: 36529930
@Tomarse111:

Thanks for that! Question: I need to save all those actions on the backend, into a sql server database. Can I do that as well? Would it be part of an ajax database call/transaction?

P.S. I'm not a big fan of the ext.js that is shipped with CF9 - I use it just for displaying a couple of tabs and thats it.
0
 
LVL 15

Accepted Solution

by:
Tomarse111 earned 500 total points
ID: 36530036
Yep, you can do that using .serialize() on your element (gets the order of items or the items that have been dropped) and then simply firing off an AJAX request to a remote CFC method. All very easy to accomplish using the jQuery libraries.

:)
0
 
LVL 1

Author Comment

by:roger_v
ID: 36530493
One final question: If I understand correctly, the series of steps for me to implement this are:

1. Build a custom jQuery download (with all the plugins and widgets that I need)

2. Intro to jQuery UI

3. Customizing jQuery UI to my needs

4. If needed, have custom themes

Is that the right order? And also, any special tips while familiarizing myself with the jQuery UI? Any & all tips and tricks are well appreciated!
0
 
LVL 9

Expert Comment

by:digicidal
ID: 36531912
Depending on your level of familiarity you can find several books on using jQuery (there are a few for extJS as well but I've found fewer of them and most are severely outdated).  The online documentation for both implementation and API models are pretty extensive and well thought out so you shouldn't have to dig too far for tips/techniques to help with your coding.

0

Featured Post

3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

Question has a verified solution.

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

Recently while working on a project I got a very annoying cfdocument has no body error message. I had never seen this error before. So I checked the code. The code was pretty simple; it was Just showing me the cfdocumnt tag and inside that tag a …
This article will show, step by step, how to integrate R code into a R Sweave document
Learn the basics of strings in Python: declaration, operations, indices, and slicing. Strings are declared with quotations; for example: s = "string": Strings are immutable.: Strings may be concatenated or multiplied using the addition and multiplic…
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.

867 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

Need Help in Real-Time?

Connect with top rated Experts

23 Experts available now in Live!

Get 1:1 Help Now