Skip to main content

Posts

Showing posts with the label cfinput

How to use typeahead for autosuggest of Text Box in ColdFusion

CFinput - typeahead for autosuggest in input type text AutosuggestTypeahead.cfm <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>cfinput type text: how to use typeahead for autosuggest in input type text</title> </head> <body> <h2 style="color:Crimson; font-style:italic">cfinput type text example: how to use typeahead</h2> <hr width="500" align="left" color="OrangeRed" /> <br /> <cfif IsDefined("Form.SubmitCountry")> <cfoutput> <h3 style="color:DeepPink;"> Your Country is: #Form.Country# </h3> </cfoutput> </cfif> <cfform name="InputTypeTextAutosuggestTest" method="post" format="html"> <table border="1" cellpadding="5...
Read more

How to change month names of a date field in ColdFusion

Introduction Adobe ColdFusion offers a powerful web development framework, and one of its useful features is the ability to customize form elements like date fields. This tutorial example demonstrates how to modify month names in a date input field using ColdFusion’s <cfinput> tag with the type="datefield" attribute. The goal is to provide a user-friendly form for submitting a joining date, where the names of the months can be customized to fit specific needs, such as formatting preferences or localization requirements. In this guide, we’ll walk through how this example code works and highlight key ColdFusion features, such as using the <cfinput> tag, customizing month names, validating the date input, and dynamically displaying the selected date. Understanding the Structure The code begins by defining a simple HTML structure with a <head> section for metadata and a <body> section where the main content of the page is displayed. Within the <bod...
Read more

How to use validateAt onserver in input type text in ColdFusion

cfinput - validateAt onserver in input type text cfinputValidateAtOnServer.cfm <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>cfinput: how to use validateAt onserver in input type text in coldfusion</title> </head> <body> <h2 style="color:SaddleBrown; font-style:italic">cfinput example: how to use validateAt onserver</h2> <hr width="475" align="left" color="RosyBrown" /> <br /> <cfif IsDefined("Form.SubmitAge")> <cfoutput> <h3 style="color:OrangeRed;"> Your age is: #Form.Age# </h3> </cfoutput> </cfif> <cfform name="InputTypeTextValidateAtTest" method="post" format="html"> <table border="1" cellpadding="5" cellspac...
Read more

How to validate maximum length of a Text Box in ColdFusion

cfinput - use maxLength in input type text cfinputTypeTextMaxLength.cfm <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>cfinput type text: how to use maxLength in input type text in coldfusion</title> </head> <body> <h2 style="color:SaddleBrown; font-style:italic">cfinput type text example: how to use maxLength</h2> <hr width="475" align="left" color="RosyBrown" /> <br /> <cfif IsDefined("Form.SubmitFlower")> <cfoutput> <h3 style="color:DeepPink;"> Your favorite flower is: : #Form.Flower# </h3> </cfoutput> </cfif> <cfform name="InputTypeTextMaxlengthTest" method="post" format="html"> <table border="1" cellpadding="5...
Read more

How to use Submit Button in ColdFusion

CFinput - input type submit cfinputTypeSubmit.cfm <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>cfinput type submit: how to use input type submit in coldfusion</title> </head> <body> <h2 style="color:SaddleBrown; font-style:italic">cfinput type submit example: how to use</h2> <hr width="425" align="left" color="RosyBrown" /> <br /> <cfif IsDefined("Form.SubmitColor")> <cfoutput> <h3 style="color:OrangeRed;"> Your favorite color is: : #Form.Color# </h3> </cfoutput> </cfif> <cfform name="InputTypeSubmitTest" method="post" format="html"> <table border="1" cellpadding="5" cellspacing="0" bordercolor="O...
Read more

How to style/design a text box in ColdFusion

cfinput - style input type text cfinputTypeTextStyle.cfm <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>cfinput type text: how to style input type text in coldfusion</title> </head> <body> <h2 style="color:SaddleBrown; font-style:italic">cfinput type text example: how to style</h2> <hr width="425" align="left" color="CadetBlue" /> <br /> <cfif IsDefined("Form.SubmitCity")> <cfoutput> <h3 style="color:OrangeRed;"> Your city is: : #Form.City# </h3> </cfoutput> </cfif> <cfform name="InputTypeTextStyleTest" method="post" format="html"> <table border="1" cellpadding="5" cellspacing="0" bordercolor="Orang...
Read more

ColdFusion CFinput - autosuggest in input type text

cfinput - autosuggest in input type text cfinputTypeTextAutoSuggest.cfm <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>cfinput type text: how to create and use autosuggest in input type text</title> </head> <body> <h2 style="color:SaddleBrown; font-style:italic">cfinput type text example: how to use autosuggest</h2> <hr width="500" align="left" color="SaddleBrown" /> <br /> <cfif IsDefined("Form.SubmitCountry")> <cfoutput> <h3 style="color:OrangeRed;"> Your Country is: : #Form.Country# </h3> </cfoutput> </cfif> <cfform name="InputTypeTextValidateTest" method="post" format="html"> <table border="1" cellpadding="5" ...
Read more

How to use Radio Button in ColdFusion

cfinput - input type radio cfinputTypeRadio.cfm <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>cfinput type radio: how to use input type radio in coldfusion</title> </head> <body> <h2 style="color:SaddleBrown; font-style:italic">cfinput type radio example: how to use</h2> <hr width="425" align="left" color="Gray" /> <br /> <cfif IsDefined("Form.SubmitMemberStatus") and IsDefined("Form.member")> <cfoutput> <h3 style="color:OrangeRed;"> Member: #Form.member# </h3> </cfoutput> </cfif> <cfform name="InputTypeRadioTest" method="post" format="html"> <table border="1" cellpadding="5" cellspacing="0...
Read more

How to validate Date of a Date Field in ColdFusion

cfinput - validate input type datefield cfinputTypeDateFieldValidate.cfm <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>cfinput type datefield: how to validate input type datefield in coldfusion</title> </head> <body> <h2 style="color:Crimson; font-style:italic">cfinput type datefield example: how to validate</h2> <hr width="475" align="left" color="Crimson" /> <br /> <cfif IsDefined("Form.SubmitMeetingDate")> <cfoutput> <h3 style="color:Crimson;"> Next meeting date is: : #DateFormat(Form.DateChooser)# </h3> </cfoutput> </cfif> <cfform name="InputTypedateFieldValidation" method="post" format="html"> <table border="1" cellpa...
Read more

How to change day names of a Date Field in ColdFusion

cfinput - daynames in input type datefield cfinputTypeDateFieldDayNames.cfm <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>cfinput type datefield: how to use daynames in input type datefield</title> </head> <body> <h2 style="color:Crimson; font-style:italic">cfinput type datefield example: how to use daynames attribute</h2> <hr width="600" align="left" color="Crimson" /> <br /> <cfif IsDefined("Form.SubmitDate")> <cfoutput> <h3 style="color:OrangeRed;"> Your Joining date is: : #DateFormat(Form.DateChooser)# </h3> </cfoutput> </cfif> <cfform name="InputTypedateFieldTest" method="post" format="html"> <table border="1" cellpad...
Read more

How to use CheckBox in ColdFusion

Introduction In this tutorial, we will explore how to implement checkboxes using Adobe ColdFusion's <cfinput> tag within a form. Checkboxes are essential in web forms, allowing users to select one or multiple options. In ColdFusion, handling checkboxes efficiently is important for building dynamic, interactive forms. This guide will take you through a simple yet illustrative example to demonstrate how to work with checkboxes, capture user input, and process it using ColdFusion. The example showcases a form where users can select their favorite colors from a list of options, using checkboxes to make multiple selections. When the form is submitted, the selected color values are processed and displayed back to the user, providing immediate feedback. ColdFusion Form Structure The core of this example is the <cfform> tag, which is used to create a form that can handle various types of input, including checkboxes. The form has a method set to POST , meaning the user’s input...
Read more

How to design/style a submit Button in ColdFusion

cfinput - style input type button cfinputTypeButtonStyle.cfm <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>cfinput type button: how to style input type button in coldfusion</title> </head> <body> <h2 style="color:SaddleBrown; font-style:italic">cfinput type button example: how to style</h2> <hr width="425" align="left" color="RosyBrown" /> <br /> <cfwindow name="BeeWindow" title="Bee Image Viewer" initshow="false" width="375" height="400"> <img src="Images/Bee2.jpg"/> </cfwindow> <cfform name="InputTypeButtonStyleTest" method="post" format="html"> <table border="1" cellpadding="5" cellspacing="0...
Read more

How to use Button in ColdFusion

Introduction Buttons play a crucial role in web development, enabling user interaction to trigger various actions like submitting forms, displaying messages, or manipulating content dynamically. In Adobe ColdFusion, the <cfinput> tag offers a simple yet powerful way to create buttons and other input elements with built-in functionality. This tutorial demonstrates how to use the cfinput tag to create a button that interacts with a pop-up window (a ColdFusion cfwindow ), providing an elegant and interactive experience for the user. By the end of this article, you'll understand how ColdFusion buttons can interact with dynamic content and JavaScript to enhance the usability of web pages. Setting the Foundation: The HTML Structure The example begins by setting up a basic HTML structure, including necessary headers and meta tags. It utilizes standard HTML to define the webpage layout, including a title, header, and an introduction to the button functionality. A heading ( <h2...
Read more