RE: jQuery Sortable list not working in CFWINDOW
This is exactly what I was looking for! Works great! Thank you! :)
-Original Message-
From: Azadi Saryev [mailto:az...@sabai-dee.com]
Sent: Thursday, November 19, 2009 7:50 PM
To: cf-talk
Subject: Re: jQuery Sortable list not working in CFWINDOW
try this:
1) create a js function in your main page (the one that opens a cfwindow):
script type=text/javascript
createSortables = function() {
// users available and assigned lists:
$(ul#sListAvailable, ul#sListAssigned).sortabl e({
connectWith: ul.userList,
placeHolder: ul.userList,
update: function() {
...
}
});
}
/script
2) remove your current $(document).ready(...) block (completely if it is in
the page loaded in cfwindow, or just the part of it that creates the
sortable lists if it is in the main page and also has other functions used
by your main page)
3) in the page that loads inside cfwindow add this line as last line before
the closing /body tag:
cfset ajaxonload('createSortables')
Azadi Saryev
On 20/11/2009 06:34, Joshua Rowe wrote:
Hello!
I have a page where a user can select other users to assign to a project.
The user drags and drops a user from a list on the left side into another
list on the right side. This is all handled using an unordered list and
jQuery's sortable() function. This works great by itself, but I am wanting
to put this into a cfwindow. I have attached the code below.
If I wrap this code into a cfwindow tag, it works. However, when I drop
the code in a file somewhere and set the source attribute in the cfwindow
tag to point to that file, it doesn't work. It also doesn't work if I use
the ColdFusion.Window.create() function. Any thoughts?
script type=text/javascript src=scripts/jQuery.js/script
script type=text/javascript
src=scripts/jQuery_MenuDragDrop.js/script
script type=text/javascript
$(document).ready(function() {
// users available and assigned lists:
$(ul#sListAvailable, ul#sListAssigned).sortable({
connectWith: ul.userList,
placeHolder: ul.userList,
update: function() {
...
}
});
});
/script
labelAssign Users:/label
bAvailable Users:/bbr
ul class=userList id=sListAvailable
cfoutput query=qryAccounts
li class=userList id=#iLoginID##sNameFirst#
#sNameLast#/li
/cfoutput
/ul
bAssigned Users:/bbr
ul class=userList id=sListAssigned/ul
~|
Want to reach the ColdFusion community with something they want? Let them know
on the House of Fusion mailing lists
Archive:
http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328580
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
jQuery Sortable list not working in CFWINDOW
Hello!
I have a page where a user can select other users to assign to a project. The
user drags and drops a user from a list on the left side into another list on
the right side. This is all handled using an unordered list and jQuery's
sortable() function. This works great by itself, but I am wanting to put this
into a cfwindow. I have attached the code below.
If I wrap this code into a cfwindow tag, it works. However, when I drop the
code in a file somewhere and set the source attribute in the cfwindow tag to
point to that file, it doesn't work. It also doesn't work if I use the
ColdFusion.Window.create() function. Any thoughts?
script type=text/javascript src=scripts/jQuery.js/script
script type=text/javascript src=scripts/jQuery_MenuDragDrop.js/script
script type=text/javascript
$(document).ready(function() {
// users available and assigned lists:
$(ul#sListAvailable, ul#sListAssigned).sortable({
connectWith: ul.userList,
placeHolder: ul.userList,
update: function() {
...
}
});
});
/script
labelAssign Users:/label
bAvailable Users:/bbr
ul class=userList id=sListAvailable
cfoutput query=qryAccounts
li class=userList id=#iLoginID##sNameFirst#
#sNameLast#/li
/cfoutput
/ul
bAssigned Users:/bbr
ul class=userList id=sListAssigned/ul
~|
Want to reach the ColdFusion community with something they want? Let them know
on the House of Fusion mailing lists
Archive:
http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328539
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
Re: jQuery Sortable list not working in CFWINDOW
Try this:
function sortLists(el){
var mylist = $(el);
var listitems = mylist.children('li').get();
listitems.sort(function(a, b){
var compA = $(a).text().toUpperCase();
var compB = $(b).text().toUpperCase();
return (compA compB) ? -1 : (compA compB) ? 1 : 0;
});
$.each(listitems, function(idx, itm) {mylist.append(itm); });
}
Just pass it a UL id and do it either after the drop or on page load.
~|
Want to reach the ColdFusion community with something they want? Let them know
on the House of Fusion mailing lists
Archive:
http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328556
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
Re: jQuery Sortable list not working in CFWINDOW
Here is an example. It does not feature drag/drop but it works like a charm. http://tonybentley.com/projects/sortedlist.cfm?download=true ~| Want to reach the ColdFusion community with something they want? Let them know on the House of Fusion mailing lists Archive: http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328557 Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
Re: jQuery Sortable list not working in CFWINDOW
try this:
1) create a js function in your main page (the one that opens a cfwindow):
script type=text/javascript
createSortables = function() {
// users available and assigned lists:
$(ul#sListAvailable, ul#sListAssigned).sortabl
e({
connectWith: ul.userList,
placeHolder: ul.userList,
update: function() {
...
}
});
}
/script
2) remove your current $(document).ready(...) block (completely if it is
in the page loaded in cfwindow, or just the part of it that creates the
sortable lists if it is in the main page and also has other functions
used by your main page)
3) in the page that loads inside cfwindow add this line as last line
before the closing /body tag:
cfset ajaxonload('createSortables')
Azadi Saryev
On 20/11/2009 06:34, Joshua Rowe wrote:
Hello!
I have a page where a user can select other users to assign to a project.
The user drags and drops a user from a list on the left side into another
list on the right side. This is all handled using an unordered list and
jQuery's sortable() function. This works great by itself, but I am wanting
to put this into a cfwindow. I have attached the code below.
If I wrap this code into a cfwindow tag, it works. However, when I drop the
code in a file somewhere and set the source attribute in the cfwindow tag
to point to that file, it doesn't work. It also doesn't work if I use the
ColdFusion.Window.create() function. Any thoughts?
script type=text/javascript src=scripts/jQuery.js/script
script type=text/javascript src=scripts/jQuery_MenuDragDrop.js/script
script type=text/javascript
$(document).ready(function() {
// users available and assigned lists:
$(ul#sListAvailable, ul#sListAssigned).sortable({
connectWith: ul.userList,
placeHolder: ul.userList,
update: function() {
...
}
});
});
/script
labelAssign Users:/label
bAvailable Users:/bbr
ul class=userList id=sListAvailable
cfoutput query=qryAccounts
li class=userList id=#iLoginID##sNameFirst#
#sNameLast#/li
/cfoutput
/ul
bAssigned Users:/bbr
ul class=userList id=sListAssigned/ul
~|
Want to reach the ColdFusion community with something they want? Let them know
on the House of Fusion mailing lists
Archive:
http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:328562
Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
