This page shows you the code used to generate the form on the Pre-Loaded CSS/JS demo page. 

<head>
 <!--- 
  Here we are pre-loading all of our CSS files
  --->
 <link href="/demos/assets/css/demostyles.css" type="text/css" rel="stylesheet" media="all" />
 <link href="/commonassets/css/uni-form.css" type="text/css" rel="stylesheet" media="all" />
 <link href="/commonassets/css/datepick/jquery.datepick.css" rel="stylesheet" media="all" />
 <link href="/commonassets/css/jquery.timeentry.css" rel="stylesheet" media="all" />
 <!--[if lte ie 8]><link href="/commonassets/css/uni-form-ie.css" type="text/css" rel="stylesheet" media="all" /><![endif]-->
</head>
<div class="cfUniForm-form-container">
 <!--- 
  The opening tag demonstrates optional attributes to do the following:
   1) tell cfUniForm **NOT** to load any CSS or JavaScript files
   2) tell cfUniForm to go ahead and configure the following UI components:
    a) Date
    b) Time
    c) Mask
    d) Validation
   3) provide a variable name that cfUniForm will return our JavaScript
    configuration to us in.
  --->
 <uform:form action="#cgi.script_name#"
    id="myDemoForm"
    submitValue=" Add Task "
    loadDefaultCSS="false"
    loadDefaultJS="false"
    configValidation="true"
    configDateUI="true"
    configTimeUI="true"
    configMaskUI="true"
    jsConfigVar="myJSconfig">
  
  <uform:fieldset legend="Task Details">
   <uform:field label="Task Name" 
      name="task" 
      isRequired="true" 
      type="text" 
      value="#form.task#" 
      hint="Enter a name to remember your task by (e.g. Pick up laundry)" />
   
   <uform:field label="Start Date"
      name="startDate"
      isRequired="true"
      type="date"
      value="#startDate#" />
   
   <uform:field label="Start Time"
      name="startTime"
      isRequired="true"
      type="time"
      value="#form.startTime#" />
   
   <uform:field label="End Date"
      name="endDate"
      isRequired="true"
      type="date"
      value="#endDate#" />
   
   <uform:field label="End Time"
      name="endTime"
      isRequired="true"
      type="time"
      value="#endTime#" />
   
   <uform:field label="Zip / Postal Code"
      name="zip"
      isRequired="true"
      type="text"
      value="#form.zip#"
      mask="99999?-9999" />
   
   <uform:field label="Detailed Description"
      name="description"
      isRequired="true"
      type="textarea"
      value="#form.description#"
      hint="Enter a detailed description of the task (e.g. directions to the cleaners)." />
  </uform:fieldset>
 </uform:form>
</div>
<!--- 
 Here we are pre-loading all of our JavaScript files.
 --->
<script type="text/javascript" src="/commonassets/scripts/jQuery/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="/commonassets/scripts/jQuery/forms/jquery.validate-1.6.0.min.js"></script>
<script type="text/javascript" src="/commonassets/scripts/jQuery/forms/jquery.datepick-3.7.5.min.js"></script>
<script type="text/javascript" src="/commonassets/scripts/jQuery/forms/jquery.timeentry-1.4.6.min.js"></script>
<script type="text/javascript" src="/commonassets/scripts/jQuery/forms/jquery.maskedinput-1.2.2.min.js"></script>
<script type="text/javascript" src="/commonassets/scripts/jQuery/forms/jquery.prettyComments-1.4.pack.js"></script>
<script type="text/javascript" src="/commonassets/scripts/jQuery/forms/uni-form.jquery.js"></script>
<!--- 
 Here we are outputing the JavaScript configuration string returned by cfUniForm.
 --->
<cfoutput>#myJSconfig#</cfoutput>