Skip to main content

Posts

Showing posts from June, 2009

ColdFusion CFDIV Bind: Show query data without page refresh

Introduction In Adobe ColdFusion, dynamic web applications can be easily built using server-side scripting. One powerful feature of ColdFusion is its ability to update parts of a webpage without refreshing the entire page, thanks to the use of AJAX-powered components like <cfdiv> . This example demonstrates how to use the <cfdiv> tag with the bind attribute to dynamically display query data based on user selection, without causing a full page refresh. This technique enhances user experience by making the interface more interactive and responsive. The tutorial involves two ColdFusion templates: cfdivBind.cfm and EmployeeDetails.cfm . The first template contains a form where users can select an employee, and the second template retrieves and displays the employee details based on the selection. This workflow showcases how ColdFusion can simplify AJAX functionality with minimal code, ensuring that server interactions are efficient and seamless. Overview of the Main Template...

ColdFusion CFTEXTAREA: Rich text area with basic toolbar

Introduction In this tutorial, we will explore how to use the cftextarea tag in Adobe ColdFusion to create a rich text area with a basic toolbar in a web form. ColdFusion's cftextarea is a versatile tag that allows developers to include text areas with rich text editing capabilities in their web applications, enhancing user input experience by providing them with a simple text formatting tool. This example demonstrates the creation of a form where users can submit their favorite colors, using a rich text-enabled textarea. We will break down the code step-by-step, explaining how the cftextarea tag works, how form submission is handled, and how ColdFusion outputs the data. By the end of this article, you will have a clear understanding of how to implement a similar functionality in your ColdFusion applications. Page Structure and Metadata The code begins with an HTML document structure that defines a simple page with proper encoding through the <meta> tag, setting UTF-8 as...

How to create simple text area in ColdFusion

Introduction In Adobe ColdFusion, building simple and interactive forms is made easy with built-in tags such as <cfform> and <cftextarea> . This tutorial demonstrates how to create a basic text area input form using these ColdFusion tags. The example focuses on capturing user input, specifically an address, and displaying it dynamically upon submission. This simple tutorial helps developers understand how to integrate basic ColdFusion form functionality into their web applications. The use of ColdFusion tags like <cftextarea> and <cfinput> streamlines form creation and provides additional validation and customization options, making it a powerful tool for web developers looking to enhance user experience with minimal effort. Understanding the Structure The example begins with a basic HTML structure where the title and metadata are set up using standard HTML tags. The body section contains the form components that are defined using ColdFusion's server-side...

ColdFusion: Create an authentication system using CFLOGIN, CFLOGINUSER and CFLOGOUT

Introduction In this tutorial, we will explore how to create a simple authentication system using Adobe ColdFusion's built-in tags like cflogin , cfloginuser , and cflogout . ColdFusion provides an easy and efficient way to manage user authentication by leveraging these tags, allowing developers to implement login and logout functionalities with minimal effort. In this article, we will break down a practical example that demonstrates how these tags work together to manage user sessions and protect content from unauthorized access. The provided example showcases a basic authentication system that checks the user’s credentials, logs them in if correct, and provides the option to log out. It also features a conditional display of protected content, which is only visible to authenticated users. Let’s walk through each part of this example to understand how ColdFusion handles user authentication. Handling User Login The core of the authentication system begins with a conditional block t...

How to disable date range of a Calendar in ColdFusion

cfcalendar - disable date range cfcalendarStartRangeEndRange.cfm <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>cfcalendar tag: how to disable date range (startRange, endrange) in calendar in coldfusion</title> </head> <body> <h2 style="color:OliveDrab; font-style:italic">cfcalendar tag example: how to use startrange, endrange attribute</h2> <hr width="625" align="left" color="Olive" /> <br /> <cfif IsDefined("Form.SubmitClassDate")> <cfoutput> <h3 style="color:DarkSeaGreen;"> Next Class Date Is: #DateFormat(Form.ClassDate)# </h3> </cfoutput> </cfif> <cfform name="CalendarStartRangeEndRangeTest" method="post" format="html"> <table bo...

How to change Calendar selected date in ColdFusion

cfcalendar - set change selected date cfcalendarSelectedDate.cfm <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>cfcalendar tag: how to set change selected date in calendar in coldfusion</title> </head> <body> <h2 style="color:Crimson; font-style:italic">cfcalendar tag example: how to use selecteddate attribute</h2> <hr width="575" align="left" color="Crimson" /> <br /> <cfif IsDefined("Form.SubmitConferenceDate")> <cfoutput> <h3 style="color:SaddleBrown;"> Next Conference Date Is: #DateFormat(Form.ConferenceDate)# </h3> </cfoutput> </cfif> <cfform name="CalendarSelectedDateTest" method="post" format="html"> <table border="1...

How to change calendar day names in ColdFusion

Introduction ColdFusion offers a variety of built-in tags that make web development easier by allowing developers to build dynamic features with minimal code. One such tag is <cfcalendar> , which provides a simple way to display a calendar control on a web page. This tutorial will guide you through how to customize the names of the days in a ColdFusion calendar using the daynames attribute. This example demonstrates how to change the default day names in the calendar control, allowing for greater flexibility and customization in your web applications. Overview of the Code Structure The example code presents a basic HTML structure combined with ColdFusion components to create an interactive calendar form. It allows users to select an arrival date and displays the selected date back to the user after submission. The main focus of this tutorial is the customization of the day names within the calendar, a feature that enhances user experience by allowing developers to modify the way...

How to use arguments scope as an array in ColdFusion

cfargument - arguments scope as an array cfargumentScopeAsArray.cfm <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>cfargument tag: how to use the arguments scope as an array in coldfusion</title> </head> <body> <h2 style="color:DodgerBlue; font-style:italic">cfargument tag example: using the arguments scope as an array</h2> <hr width="600" align="left" color="OrangeRed" /> <br /> <cffunction name="GetCenter" access="remote" returntype="query"> <cfargument name="Center_ID" type="numeric"> <cfquery name="qCenter" datasource="cfdocexamples"> SELECT Center_ID, Name, Address1 FROM CENTERS WHERE Center_ID= #arguments[1]# </cfquery> ...

CFcache - How to cache a web page in ColdFusion

CFcache - cache web page cfcache.cfm <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>cfcache tag: how to cache web page in coldfusion</title> </head> <body> <h2 style="color:SteelBlue; font-style:italic">cfcache tag example: how to cache web pages</h2> <hr width="450" align="left" color="SteelBlue" /> <br /> <cfcache timespan="#CreateTimeSpan(0,0,5,0)#"> <cfoutput> <h3 style="color:DeepPink"> This page create at #TimeFormat(Now())# and cache for 5 minutes. </h3> </cfoutput> </body> </html> More ColdFusion examples cfimage - change image height width programmatically cfimage - write an image to the browser cfajaximport - using ajax feature in coldfusion cfsilent ...

How to read a CSV file and return query object in ColdFusion

Introduction In ColdFusion development, handling and processing external data is an essential part of web application functionality. One common data format used for exchanging and storing information is the CSV (Comma-Separated Values) file. In this tutorial, we explore how to read a CSV file and return its data as a query object in ColdFusion. This approach is particularly useful when working with external data sources, such as employee records or other tabular data, that need to be displayed or manipulated within a ColdFusion application. In the example provided, we utilize the cfhttp tag to fetch the CSV file and convert it into a ColdFusion query object, making it easy to interact with and display the data. This method is efficient and straightforward, making it ideal for scenarios where you need to pull external CSV data dynamically. Using cfhttp to Fetch CSV Data The core of this tutorial revolves around the ColdFusion cfhttp tag, which is used to make HTTP requests to retriev...

How to use cfslider in ColdFusion

Introduction In ColdFusion, the cfslider tag provides an interactive way to work with range-based data, allowing developers to create a slider bar on a form. This tag is ideal for cases where users need to select a value within a range, such as adjusting brightness, setting volume, or—as in this example—rotating an image. In this tutorial, we’ll explore how to use the cfslider tag within an HTML form in ColdFusion to control the rotation of an image, offering a smooth, user-friendly interface for adjusting the rotation angle dynamically. The code demonstrates a practical implementation of cfslider , where users can slide to adjust an angle and view the image rotated to match their selection. This example highlights various attributes of cfslider that allow for customization, providing insights into integrating this feature seamlessly into a web application. Setting Up the Page and Slider Defaults To start, the code initializes the page structure with HTML and basic styling. A cfpara...

How to use CFsilent to suppress output in ColdFusion

Introduction ColdFusion is a powerful scripting language used for web development, known for its simplicity and flexibility. One of the useful features ColdFusion offers is the ability to control output using specific tags. In many cases, while executing server-side logic, developers want to suppress any unnecessary output to prevent cluttering the response sent to the browser. This is where the <cfsilent> tag becomes particularly helpful. In this article, we will explore how to use the <cfsilent> tag to suppress the output of certain operations in ColdFusion. This tag is especially useful when running background tasks such as database queries or other processing that does not need to send output directly to the browser. Let’s dive into an example to understand how this works in practice. What is the <cfsilent> Tag? The <cfsilent> tag is used in ColdFusion to suppress any output generated within its block. This means that any code that generates output, such...

ColdFusion CFsetting - How to use enablecfoutputonly attribute

CFsetting - enablecfoutputonly attribute cfsettingEnablecfoutputonly.cfm <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>cfsetting: how to use enablecfoutputonly attribute in cfsetting</title> </head> <body> <h2 style="color:DeepPink; font-style:italic">cfsetting tag example: how to use enablecfoutputonly attribute</h2> <hr width="600" align="left" color="OrangeRed" /> <br /> <cfset MyRandomNumber=RandRange(1,100)> <cfsetting enablecfoutputonly="no"> <h3 style="color:SeaGreen"> My random number: <cfoutput>#MyRandomNumber#</cfoutput> </h3> <cfsetting enablecfoutputonly="yes"> <h3 style="color:SeaGreen"> My random number: <cfoutput>#MyRandomNumber#...

How to use CFflush interval attribute in ColdFusion

CFflush - interval attribute cfflush.cfm <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>cfflush: how to use interval attribute with cfflush in coldfusion</title> </head> <body> <h2 style="color:DeepPink; font-style:italic">cfflush tag example: how to use cfflush</h2> <hr width="400" align="left" color="OrangeRed" /> <br /> <cfflush interval="1"> <cfoutput> <cfloop index="i" from=1 to="500000"> <cfif i EQ 100000 or i EQ 200000 or i EQ 300000 or i EQ 400000 or i EQ 500000> <h3 style="color:SeaGreen"> The loop current index is: #i# <br /> </h3> </cfif> </cfloop...

How to use cfajaximport to add ajax features in ColdFusion

Introduction In modern web development, incorporating dynamic functionality without refreshing the entire page is crucial for a seamless user experience. ColdFusion provides a built-in mechanism to handle such functionality with AJAX using the <cfajaximport> tag. This tutorial demonstrates how to use this tag effectively to add AJAX-based features in a ColdFusion application. Specifically, it focuses on dynamically creating and displaying content, such as an image, using a ColdFusion window with minimal client-side code. The example provided shows how to implement the ColdFusion <cfwindow> tag in combination with AJAX to open a pop-up window and display an image when a user clicks a hyperlink. By leveraging AJAX, this operation becomes smooth and interactive without reloading the entire page. Understanding the HTML Structure The foundation of the example begins with a simple HTML structure. The document is marked up with essential meta tags to set the character encoding a...

How to create a Captcha in ColdFusion

Introduction CAPTCHA (Completely Automated Public Turing test to tell Computers and Humans Apart) is a widely-used technique to ensure that a form is being submitted by a human rather than a bot. ColdFusion, with its powerful cfimage tag, provides a built-in way to create CAPTCHA images that can be embedded into your web forms. In this article, we will walk through an example of how to create and use a CAPTCHA in ColdFusion to protect your forms from automated spam submissions. This example demonstrates how to implement CAPTCHA in a simple newsletter subscription form. The goal is to prevent bots from subscribing by requiring the user to input a specific CAPTCHA code, along with their email address, before submitting the form. The tutorial covers the use of the cfimage tag to generate the CAPTCHA and basic form handling logic in ColdFusion. Form Setup and Design The form in this example is styled for clarity and simplicity, with distinct fields for email input and CAPTCHA validation....