Using CFDiv to bind text from form field to a div or span.
ColdFusion 8 just makes so many tasks easier. Yesterday I was looking into doing something fun for a little project. I wanted to type into a text field, and have it immediately show that text into a formated span tag somewhere else on the page.
With CFDiv and bind its as easy as this:
<cfinput name="mytextfield" type="text">
</cfform>
<h1>show the span</h1>
<cfdiv bind="{mytextfield@keyup}" ID="mySpan" tagName="span" style="background-color:##dddddd; border: 1px solid ##000000; color:red; height:20"/>
The key part here is the bind="{mytextfield@keyup}". This binds the content of the cfdiv tag (in this case a span tag) with the content of the mytextfield input.
If you just left it as bind="{mytextfield}" it would also work, but only update the span when you have left the text field (submit, click elsewhere, etc) as the default is the change event. By specifying @keyup you are telling it to bind for every event of your keys going up, which effectively lets the bind trigger in real time what you are typing and show it in the span.
This would be useful for helping preview how a page/template/profile would look before having them save it.
This isn't rocket science to do without ColdFusion 8, but it is certainly more work.
Like this entry? Subscribe to my blog.


Comments (moderation on)