Dynamically change style properties in Coldfusion

Posted on 2006-05-19
Last Modified: 2013-12-24
Is there a way to dynamically change a style property in CF?

For example the following code sample has a form with a select input that toggles a second select input to display or hide via Javascript.

Once the form is submitted, I'd like the 2nd select to display based on what it's state was before the form was submitted.

Something like <select name="mySelect2" style="display:<cfif"display:inline;">inline<cfelse>none</cfif>;">
Please let me know if I'm way off base and should extend the Javascript somehow to get the desired result (not a clue how to do that!).

Code Sample:
<title>Code Demo</title>
<script language="JavaScript" type="text/javascript">
      function toggle(i){
            if(i.form.mySelect1.value == 2){
         = "inline"
            else {



<div style="margin-top:25%;margin-left:25%;">
<form name="frm" action="Demo.cfm" method="post">
            <select name="mySelect1"onchange="toggle(this);">
                  <option value="1" selected="selected">One</option>
                  <option value="2">Two</option>
                  <option value="3">Three</option>
            <select name="mySelect2" style="display:none;">
                  <option value="1" selected="selected">One</option>
                  <option value="2">Two</option>
                  <option value="3">Three</option>
            <br /><br />
            <input name="" type="submit" />

Question by:rmosher315
    LVL 15

    Accepted Solution

    You should be able to do something like that only instead of checking the style of mySelect2 with the cfif you would want to check the value of myselect1 being equal to 2.  

    Something like this.  

    <select name="mySelect2" style="display:<cfif Form.mySelect1 = 2>inline<cfelse>none</cfif>;">
    LVL 15

    Expert Comment

    doh, make sure you use "EQ" and not "="

    <cfif Form.mySelect1 EQ 2>

    Author Comment

    Y'know... some things are just TOO obvious.  Thanks Tim, it works like a charm!  The points are yours.
    LVL 15

    Expert Comment

    thanks, glad I could help.  

    Featured Post

    How to improve team productivity

    Quip adds documents, spreadsheets, and tasklists to your Slack experience
    - Elevate ideas to Quip docs
    - Share Quip docs in Slack
    - Get notified of changes to your docs
    - Available on iOS/Android/Desktop/Web
    - Online/Offline

    Join & Write a Comment

    Suggested Solutions

    Now that Expression Web 4.0 ( is free if you buy or have the full version of Expression Web 3.0, now is the best time to  migrate from FrontPage to Expression Web (http://www.frontpage-to-exp…
    Article by: kevp75
    Hey folks, 'bout time for me to come around with a little tip. Thanks to IIS 7.5 Extensions and Microsoft (well... really Windows 8, and IIS 8 I guess...), we can now prime our Application Pools, when IIS starts. Now, though it would be nice t…
    The purpose of this video is to demonstrate how to create a Printer Friendly PDF on a WordPress Page. This will be demonstrated using a Windows 8 PC. Tools Used are Photoshop, Awesome Screenshot” Google Chrome Extension, and Log…
    The purpose of this video is to demonstrate how to add AdSense Ads to a WordPress Website, and how to set up WordPress to automatically place Ads in Sidebars. This will be demonstrated using a Windows 8 PC. Log into your AdSense account. : Cli…

    755 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    23 Experts available now in Live!

    Get 1:1 Help Now