Using CF8 Ajax features to solve the 'pick one of thousands' issue (2)
A few days ago I posted a blog entry discussing a method to allow someone to browse thousands of records within a form. The blog entry made use of ColdFusion 8 built-in Ajax technology. I promised a jQuery version and I finally got around to it. (Reminder - I'm still rather new to jQuery so this code does not represent best practice. Well, probably not. If it does, I'm unexpectedly brilliant.)
Ratings added to CFLib
This morning I pushed up ratings to CFLib. CFLib used to have ratings some time ago, so this is actually an old feature coming back. I used the same jQuery plugin that SlideSix uses (http://php.scripts.psu.edu/rja171/widgets/rating.php). To be honest, I really don't like this plugin. Turning off the cancel was a pain in the rear. I would have used the Spry rating widget instead, but I really wanted to give jQuery ratings a try. At the end of the day though it works, so I'll leave it be. One nice thing about it though - I can pass it a rating value of X.2 and it rounds it down to X starts. Pass it X.5 and it correctly shows a half star.
Later this week I'll be adding a right hand list of the top rated UDFs.
Oh, and in case folks are curious, I did not add any protection from multiple voting. I originally used code that stored your rankings in a session variable. I turned that off during testing and didn't bother re-enabling it. I figure it someone is so bored they want to cheat their UDF up, more power to em. ;)
Using CF8 Ajax features to solve the 'pick one of thousands' issue
Let me apologize for the title. I tried like heck but I couldn't find a better title for the issue I'm talking about. Personally I blame the apple pie. Let me describe the problem and how I used ColdFusion 8 Ajax features to solve it. If folks have a better title for the blog entry, I'll be sure to use it in the Spry/jQuery and maybe Ext versions I have planned.
Ok, so what in the heck am I talking about? Imagine a simple form that represents an entity in your database. For example, one project at RIAForge (Yes, it's still up). Projects have many different fields, most of which are simple text based fields like name and description. Some fields are pointers to other database tables. Projects can exist in categories so my form has an HTML select field for choosing related categories. Projects also have owners and this is where my main problem comes in. RIAForge currently has over 4,500 users. If I want to build a 'typical' way to edit the owner for a project I'd have a select drop down with 4,500 options. That probably would work since most of us have cable modems, but it's going to be a bit insane to actually use. That's why I actually don't change owners at RIAForge. I don't think anyone has ever asked and I realized early on that this would be a problem. So what could I do if I actually did want to let people change owners for a project?
Ask a Jedi: Removing Pagination from CFGRID
Nathan asks:
I am recently getting into CF8 and Ajax features and for doing so building a small application to add items to a cart. I have it setup currently that items are in a select box and a cfgrid shows some item information of the item selected. Since, at a time only one item can be selected, I want to remove the pagination that comes by default with cfgrid. I am able to do that if I get a result query and use the cfgrid with a query attribute, but if I go for a dynamic bind, the pagination controls are present.
Spry Tip - Paged Datasets, Filters, and Row Numbering
A reader wrote in asking an interesting question. He was using a Spry PagedView (a nice way to present a 'paged' interface to data loaded in via Ajax) and ran into an issue when trying to display the row number. When he used {ds_RowNumberPlus1}, the row was relative to the page. So on page 2, he saw 1 instead of 11. I read over the docs a bit and nothing seemed like it would work. I then created the following demo to help me test this.
Early Christmas related excuse to test a jQuery Plugin
Warning, this post is nothing more than a) a chance to show off a new picture of the kids (or as I call them, the North American branch of the South Korean Army) and b) quickly test a jQuery Lightbox plugin (which may be found here):
I think it works rather nicely. I tried jQuery Lightbox Plugin (balupton edition) earlier but ran into issues trying to get it to run in a non-default file location setup.
Ask the Jedi: Counting characters and lines with Spry
Barbara asks:
Ray, we are almost finished with a card site and we recently added the spry widget for text area to count the characters however, we need one more piece because we also need to account for carriage returns which is a database element. I looked through the JavaScript widget and it is obviously issing however was wondering if you knew of any way to account for it.
Ah, interesting question there. For folks who may not remember, Spry has a textarea widget that allows for some fun validation rules. I discussed this in an earlier blog entry (holy smokes - that blog entry was extactly one year ago today!) which you may want to read over, but the basic problem is that while Spry makes it easy to count the characters, there is no built in support for line numbering. I played with this a bit and came up with the following.
ColdFusion.navigate works with non-CF generated UI items
Scott just pinged me with an interesting question - can you use ColdFusion.navigate with a "normal" div or does it only work with items generated by ColdFusion 8 (cfdiv, cfwindow, cfpod, etc)? We both tested and discovered that - yes - you certainly can use it with a "vanilla" div - but you must get ColdFusion to preload the proper JavaScript files. Consider this simple demo:
<cfajaximport />
<script>
function doit() {
ColdFusion.navigate('test3.cfm','booger')
}
</script>
<a href="javaScript:doit()">load the booger</a><br />
<div id="booger"></div>
Starting from the bottom up - the div, booger, is our container. I have a test link above it that runs the doit function. doit() then simply uses ColdFusion.navigate. If you just use that portion of the file, though, you will get a client-side JavaScript error saying that ColdFusion doesn't exist. You need to tell ColdFusion to load the the Ajax libraries. This can be done with a simple, empty cfajaximport tag.
Not sure how useful this is, but if you don't have Spry or jQuery loaded and need a simple and fast way to load data via Ajax, this would work well.
Ask a Jedi: Mixing ColdFusion 8 binding with jQuery
Josh asks:
I have been trying to do this for a little while and haven't found any good answers online. Is there any way that you know of to use jQuery to prepend an option to the top of a cfselect that has a bind=some cfc?
I haven't done a lot of mixing of ColdFusion 8 and jQuery, but let's see what we can do with this. First, let's start with the code he tried to use:
Ask a Jedi: Simple ColdFusion 8 Ajax Pagination
Omer asks:
I am looking for a way to navigate videos without refreshing the page. Currently I have pagination on the page and I only show 10 videos at a time. I only want portion of page to change when user select a different page number. I want to explore cfdiv and any other coldFusion 8 functions to accomplish this task. Thanks for your help in this regard.
This is pretty similar to how I used to do pagination on ColdFusionBloggers.org. That site now is mostly jQuery based, but here is a simple demo of how it could be done using just what ColdFusion 8 provides.