JC asks:
Have you had any success placing focus on a text field inside a cflayoutarea? Is this possible or am I chasing a red herring?
I had not tried this before, but it wasn't too hard. First consider a simple CFLAYOUT page:
<cflayout type="border"><cflayoutarea position="left" align="center" size="400" collapsible="true" title="Menu"> <p> Menu 1 </p> <p> Menu 2 </p> <p> Menu 3 </p> </cflayoutarea>
<cflayoutarea position="center"> <p> <form id="someform"> <input type="text" name="username" id="username"> </form> </p> </cflayoutarea>
</cflayout>
Notice I've placed a form inside the main layout box. I want to run code to set focus when the page loads, and ColdFusion provides a function for this - ajaxOnLoad():
<cfset ajaxOnLoad("setfocus")>The code for setfocus is no different than any other JavaScript code to set focus:
<script> function setfocus() { var myfield = document.getElementById("username"); myfield.focus(); } </script>The only thing to watch out for is that ajaxOnLoad is a bit picky. It requires your JS function to be inside <HEAD> tags. So a complete example would be:
<html> <head> <script> function setfocus() { var myfield = document.getElementById("username"); myfield.focus(); } </script> </head><body> <cflayout type="border">
<cflayoutarea position="left" align="center" size="400" collapsible="true" title="Menu"> <p> Menu 1 </p> <p> Menu 2 </p> <p> Menu 3 </p> </cflayoutarea>
<cflayoutarea position="center"> <p> <form id="someform"> <input type="text" name="username" id="username"> </form> </p> </cflayoutarea>
</cflayout>
<cfset ajaxOnLoad("setfocus")>
</body> </html>