Autosuggest icon

Forum|Forum|17 years ago
November 19, 2008
7 replies
2878 views

Can anyone give me tips on how to change the default autosuggest loading icon to a custom icon? I have a custom icon and would like to serve it locally from my Web site rather than change it in the CFIDE\scripts\ajax\resources\cf\images\ folder. I tried serving the autosuggest.js file locally (in my site on IIS) but my input fields quit working and the icon links were broken. Any help or pointers to instructions would be appreciated.

This topic has been closed for replies.

C

cflingoAuthor

Inspiring

This appears to be the way to do it without mucking about in the CF8 CFIDE folder which is what I was after. Thanks to all who replied. I'm referencing the link that Daverms provided!!!

BKBK

Community Expert

It's an attribute of the cfinput tag in CF8.

cfinput type="text" name="company" autosuggest="cfc:autosuggest.getCompany({cfautosuggestvalue})" id="company" onFocus="clearCompField();" size="40" maxlength="50" showautosuggestloadingicon="true" maxresultsdisplayed="15"

See showautosuggestloadingicon.

OK, thanks. Apparently, the Javascript function responsible for it is in the file \CFIDE\scripts\ajax\package\cfautosuggest.js. You will find the code for the image path near the beginning of the script. It consists of the two lines,

var staticgifpath=_cf_ajaxscriptsrc+"/resources/cf/images/static.gif";
var dynamicgifpath=_cf_ajaxscriptsrc+"/resources/cf/images/loading.gif";

It seems that Coldfusion toggles between the two images. I'm only guessing; you should take a look. This is a system script, so make a backup before you go poking it.

D

Daverms

Inspiring

You can generate the loading icon at,

http://www.ajaxload.info/

C

cflingoAuthor

Inspiring

Understood but how do you serve the custom icon without changing the default icon that CF8 uses? I know you can customize the CSS file by creating an ajax/resources/cf/cf.css directory in your Web site on IIS. There must be a way to do the same with the icon too without altering anything in the CFIDE folder.

D

Daverms

Inspiring

See "Eric Pfleckl" 's comment in this thread!...

http://www.houseoffusion.com/groups/cf-talk/thread.cfm/threadid:54067

HTH

BKBK

Community Expert

Could you post an example of code that shows the icon?

C

cflingoAuthor

Inspiring

It's an attribute of the cfinput tag in CF8.

cfinput type="text" name="company" autosuggest="cfc:autosuggest.getCompany({cfautosuggestvalue})" id="company" onFocus="clearCompField();" size="40" maxlength="50" showautosuggestloadingicon="true" maxresultsdisplayed="15"

See showautosuggestloadingicon.

D

Daverms

Inspiring

Hi,

You can replace the custom loading icon by replacing the "loading.gif" image in
cfide/scripts/ajax/resources/cf/images with any image you wish.

HTH

BKBK

Community Expert

I've been looking for a clue in the following example. Does it show the icon you're referring to?

<cfform>
<div style="float: left"> Name(Anna, John, Peter?): </div>
<cfinput name="userName" type="text" autosuggest="Anna, John, Peter">
</cfform>

I

icarus013

Inspiring

No icon appears for me with this code. Just blue background suggestion choice. It would be nice to change the suggestion background color to something softer on the eyes than bright blue.