Saturday 4 August 2012

ColdFusion Local Scope

The following code demonstrates the problem...
Output: GONE

As you can see, function2 overwrites the data variable that we are trying to use in function1. By adding the var keyword to our variable declarations we ensure that the variable is local to that function and cannot be accessed outside of it, meaning that even if the same variable name is used outside of the function it wont be overwritten.
Output: Hello world

The problem may seem pretty obvious here in this example but in a much bigger application it could cause a lot of problems. Perhaps someone else wrote function2, it may do something completely unrelated to your data variable and it almost certainly wouldn't be coded right bellow function1 like it is in this example.

Running into a problem like this could take a while to figure out if you're not looking out for it so remember, ALWAYS var scope your function variables!

Sunday 26 February 2012

JQuery Autocomplete Using ColdFusion CFCs

I recently had to create a form text field that used jQuery autocomplete on a ColdFusion website and I thought it was pretty cool the way it worked so I thought I would share. Here it is in action...


This form can be broken into 3 fairly simple parts: The basic HTML that displays the form, the CFC that queries the database and the jQuery that ties it all together. Let's start off by looking at the form code...
Nothing to see here really, just an input text field and a submit button that doesn't do anything yet. Next up is the CFC we use to query the database...

The queryNames function is fairly similar to any other function you might write to query a database except it limits the amount of rows returned to 10. If you don't do this your autocomplete list will come out too long and could possibly take a while to load if you have a lot of rows in your table.

And finally we bring the two together with jQuery...

Here we use Ajax to call the queryNames method in our cfc, passing in the current value of the text field, then jQuery uses the response to populate the autocomplete widget. Pretty cool, huh?

Hope this helped!