>> GreenByte.info By Nick Tong (quiksilv) | Supported by: TalkWebSolutions.co.uk

Passing URL variables into an iFrame

I've been using iFrames in a few pages recently and one of the things that I've needed to do is pass the parent URL variables into the iFrame window. Thanks to a chat I was having with Mick Balaban this is the solution i've used.

[More]


AJAX - Length Required issue with POST

I've been having an issue in Firefox using AJAX where I've been getting this error/response

<h1>Length Required</h1>

After trying several things (trimming, "cfcontent reset" etc) I really couldn't figure out what was going on, and Mr Google didn't help out that much either. Eventually, after more playing, I found a solution - now this may not be the best solution but it works:

[More]


Trimming strings with Javascript

Here is a quick code snippet showing how you can trim strings in javascript:

[More]


Spry $ dollar sign

I've been coming up with a few issues lately with some code not working due to the dollar key ($) not being defined in some of my Javascript code.

For those that don't know, Spry has a shortcut for

document.getDocumentById('id');

and this is the dollar key ($).

The reason for this error is due to the fact that i'm using two AJAX frameworks and there is a clash.

The easy way to solve this issue is to use:

[More]

Banner rotation via Ajax

After viewing a great post from http://www.phpied.com/ajax-banner-rotation/ I've created the back end script in coldfusion. You'll have to download the JS from the post above, as I feel the post is worth a read. The backend code is:

<cfset request.banner = structNew() />
<cfset request.banner[1] = "<p>FREE Delivery</p>" />
<cfset request.banner[2] = "<img src='/images/banner1.gif'/>" />
<cfset request.banner[3] = "<p>Best offers on the net</p>" />
<cfset request.banner[4] = "<p>Visit <a href='http://succor.co.uk'>http://succor.co.uk</a></p>" />
<cfxml variable="request.XMLData"><?xml version="1.0" encoding="ISO-8859-1"?>
   <banner>
      <content><![CDATA[<cfoutput>#request.banner[randrange(1,4)]#</cfoutput>]]></content>
    <reload>11000</reload>
</banner>
</cfxml>
<cfsetting showdebugoutput="no" />
<cfcontent type="application/xml; charset=UTF-8" reset="yes"><cfoutput>#request.xmlData#</cfoutput>

Be sure to change the JS code on line 60 to ajax-banner.cfm then include this code on your page:

<script type="text/javascript" src="http://<cfoutput>#request.siteName#</cfoutput>/javascript/ajax-banner.js"></script>
div id="ajax-banner">Loading...</div>
The XML struct can contain images etc but no JS.

Enjoy.

JSON and CFCs

I've just been playing around with getting SPRY to use JSON datasets. It's worth checking out Ray Camdens posts on how he updated lighthousepro to use JSON. One issue I had though was, I call my JSON data via a CFC which causes SPRY to have issues.

Could not convert undefined or null to object Backtrace

Check out this post form more information: http://www.houseoffusion.com/groups/cf-talk/thread.cfm/threadid:52382

The solution appears to be that you can update your spry files where it does the http request like this

var strTest = http.responseText; strTest = strTest.replace(/(<\/?META[^>]*>)/gi,'');

This then helps solve the meta tag issue.

It's worth noting that CF8 will help you resolve this issue as it lets you specify a return format.

Thanks to Scott for this solution.

SPRY and jQuery load sequence

I've been using spry for a little while now and I like it's ease of use, that said I needed some auto complete functionality and since spry 1.5 isn't out or supported I decided to use jQuery.

I needed to load in 3 JS files:

SpryData.js
jquery.js
autocomplete.js (http://www.pengoworks.com/workshop/jquery/autocomplete.htm)

The auto complete JavaScript calls a function in jquery called

[More]

Restore default input value with javascript onblur

I need to be quite strict on the space I'm using with a form, so I need to put the search term in the text box as apposed to a label. This is fine, but what annoys me when I find form like this is that one has to delete the value in the text box when you click on it. Well this is easy to fix just add a this.value='' to the onfocus event:

Search for:
<input type="text" name="keyword" id="keyword" value="Keyword" onfocus="this.value='';" />

The problem is that if you don't change any text and click away from the text area, it is left blank. This can cause some issues for screen readers as well as making the screen a little confusing.

A way to fix this is to restore the original value when the user blurs of the text box:

Search for:
<input type="text" name="keyword" id="keyword" value="Keyword" onfocus="this.value='';" onblur="if(this.value==''){this.value='Keyword'};" />

To take this one step further, one can make sure that the text box value is only made blank if the default value is current:

Search for:
<input type="text" name="keyword" id="keyword" value="Keyword" onfocus="if(this.value=='Keyword'){this.value=''};" onblur="if(this.value==''){this.value='Keyword'};" />

Free 10-Week AJAX Course

I just found out from Regnard on dZone that:

Sang Shin, Java evangelist extraordinaire, is holding an online training course from his website Javapassion.com. In 10 weeks, you will get to know the nitty-gritty of AJAX, popular frameworks like Dojo and the Google Web Toolkit and AJAX integration with web applications.

Visit http://www.javapassion.com/ajaxcodecamp/ for more information.

Although we've already missed the first few weeks there is still:

# JavaServer Faces and AJAX Integration (Oct. 13th, 2006)

# jMaki (Oct. 27th, 2006)

# Web Application Frameworks and AJAX (Nov. 3rd, 2006)

# CSS (Nov. 17th, 2006)

# JavaScript Best Practices (Nov. 24th, 2006)

# AJAX Design Patterns and Best Practices (Dec. 8th, 2006) - this is the end of the course

# Prototype

This sounds great - anyone here going to take it up?

a web developers cheat sheet list

Here is a list of some great cheat sheets. Last updated 15/04/2007.

If you know of any please add them to the comments below. Lets help each other out.

Web Dev Cheat Sheets

Databases / SQL Cheat Sheets

Language Cheat Sheets

Javascript

Version Control Cheat Sheets

Framework Cheat Sheets

Other cheetsheets

Commercially Printed CheatSheets

Apollo

Please do add more to the comments and I will update... need to get more cheat sheets for frameworks!

More Entries

BlogCFC was created by Raymond Camden. This blog is running version 5.5.1.