• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1154
  • Last Modified:

Change style of CFSELECT within a CFFORM (format='FLASH') using CFIF

I am trying to change the style of the values within a CFSELECT based on certain criteria of that record in the query.  

ID             Location                        BU
1             Harrisburg                   B,M,W
2              Orlando                       B
3              Austin                          B,W
4              Atlanta                          M
5              Miami                           M,W

Based on the example table above, if the Business Unit is M, then I want that location to show up in the CFSELECT as Blue...the rest, show in Black.      

With the code that I have below, my flash form just doesn't load.  I don't get any CF errors, the form just doesn't load.  
<!---- this is the cfform ---->

<cfform format="flash" 
	name="myFORM"
	action=""
	method="POST"
	skin="haloOrange">
<cfformgroup type="vdividedbox" id="DetailsBox02">	
<cfselect 
NAME="selLoc"
query="get_Locations"
display="Location"
value="ID"
multiple="yes"
size="11"
CLASS="tiny"
style="<cfif ListFind(#get_Locations.BU#, 'M')>color:blue;<cfelse>color:black;</cfif>"
width="233" 
label="Location(s):"
tooltip="To select multiple locations, hold down the Ctrl button and click the name">
</cfselect>
</cfformgroup>
</cfform>

Open in new window

0
Lee R Liddick Jr
Asked:
Lee R Liddick Jr
  • 5
  • 3
3 Solutions
 
gdemariaCommented:
You need to take out the query attributes and do it inside a loop so you have control over each option tag...


<cfselect 
NAME="selLoc"
multiple="yes"
size="11"
CLASS="tiny"
style="<cfif ListFind(#get_Locations.BU#, 'M')>color:blue;<cfelse>color:black;</cfif>"
width="233" 
label="Location(s):"
>

<cfoutput query="get_Locations">
  <cfset myStyle="color:black;"> 
 <cfif listFind(getLocations.bu,"M")>
   <cfset myStyle="color:blue;"> 
 </cfif>
 <option style="#myStyle#" value="#getLocations.ID#"> #getLocations.Location# </option>
</cfoutput>
</cfselect>

Open in new window

0
 
Lee R Liddick JrReporting AnalystAuthor Commented:
Okay, the flash form is appearing now, but my style doesn't change in the CFSELECT.  This is what I now have.
<cfselect NAME="selLoc"
  multiple="yes"
  size="11"
  CLASS="tiny"
  width="233" 
  label="Locations(s):"
  tooltip="To select multiple locations, hold down the Ctrl button and click the name">
<cfoutput>
<cfloop query="get_locations">

  <cfset myStyle="color:black;"> 
 <cfif listFind(getLocations.bu,"M")>
   <cfset myStyle="color:blue;"> 
 </cfif>
 <option style="#myStyle#" value="#get_locations.ID#">#get_locations.location#</option>
</cfloop>
</cfoutput>
</cfselect>

Open in new window

0
 
_agx_Commented:
<option style="#myStyle#" value="#get_locations.ID#">

I don't think that works for flash forms, only html.

I know how to set the bgColor for list <options> but no the "text" color unfortunately :)
0
Cloud Class® Course: CompTIA Cloud+

The CompTIA Cloud+ Basic training course will teach you about cloud concepts and models, data storage, networking, and network infrastructure.

 
Lee R Liddick JrReporting AnalystAuthor Commented:
That's not good...
0
 
Lee R Liddick JrReporting AnalystAuthor Commented:
Okay, since I apparently am not able to style the text color within the flash form, I am just adding an '*' at the end of my value to designate it.  Thanks for the help...
<cfselect NAME="selLoc"
  multiple="yes"
  size="11"
  CLASS="tiny"
  width="233" 
  label="Locations(s):"
  tooltip="To select multiple locations, hold down the Ctrl button and click the name">
<cfoutput>
<cfloop query="get_locations">
<option style="#myStyle#" value="#get_locations.ID#">#get_locations.location#<cfif ListFind(#get_locations.BU#, 'M')>*</cfif></option>
</cfloop>
</cfoutput>
</cfselect>

Open in new window

0
 
_agx_Commented:

Okay, since I apparently am not able to style the text color within the flash form


Btw: I'm specifically talking about styling list <options> *separately*.  If you just want to style the whole list, that's doable.
0
 
Lee R Liddick JrReporting AnalystAuthor Commented:
And I don't want to style the entire list...I only want to style specific values of the query.
0
 
_agx_Commented:
Ok, that's what I thought.  Styling the list is supported, but not the individual <option>'s afaik.  

Hacking flash forms is a pain if you're not a flex/a.s. guru. (I'm not).  There's a hack for changing the bgColor. But I'll be darned if I can figure out the one for text color..
0
 
Lee R Liddick JrReporting AnalystAuthor Commented:
Since it's not really working the way I wanted, I modified my code to make it work visually by using an '*' instead of a color change.  I provided points to you both for your assistance.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Cloud Class® Course: Microsoft Azure 2017

Azure has a changed a lot since it was originally introduce by adding new services and features. Do you know everything you need to about Azure? This course will teach you about the Azure App Service, monitoring and application insights, DevOps, and Team Services.

  • 5
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now