AJAX not populating dropdown in ColdFusion

[wmhintz]

Hello geniuses,

I have inherited a ColdFusion application which uses four lines of AJAX in order to populate a drop-down based upon the selection made in a previous drop-down. The first drop-down is a list of car "makes", for example: Ford, Chevrolet, etc. The second drop-down is to be populated with "models" based upon the selected "make".
However, the AJAX code appears to be no-longer working as the "models" drop-down is not being populated. We recently had to move the code to a new server, and it seems like, from that point forward, the AJAX is not populating the "models" drop-down.
Here is the code:

<SCRIPT LANGUAGE="JavaScript" SRC="prototype.js"></script>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">

function doIt(){
makename = document.addvehicle.MAKE.value;
var url = 'https://fisnet.wvu.edu/secure/_listmodels.cfm';
var pars = 'make='+makename+'&edit=0';
var myAjax = new Ajax.Updater('models', url, { method: 'get', parameters: pars });
}

</SCRIPT>

Now, one change which had to be made was to update the URL variable from being only HTTP to HTTPS because this application is now behind that level of security. Other than that, the code is exactly the same now as it used to be.
One more thing, this code works differently based on the browser used. To explain, while the code is no-longer populating the drop-down, in FireFox it makes the "models" drop-down disappear completely, as though it's trying to update it, but something is failing. In IE 9 the drop-down remains, it just does not get populated. For IE 8 and Chrome there is a JavaScript error earlier in the application which prevents it from working, so I don't know how this AJAX code works in those browsers.

I do not know AJAX or JavaScript, I have never worked with them before, I am a ColdFusion developer with intermediate skill. I hope to be able to follow along with any suggestions or comments, I will try my best to do so. Please let me know if I can provide you with any additional information.
Thank you very much,
Jim

[paulkd]

You have two drop downs. Are they both populated via ajax or just the models drop down?

[wmhintz]

Hi paulkd,

Thank you for taking the time to ask a question and for trying to help.

The first drop down, the "makes" drop down, is populated by a regular SQL query using ColdFusion.

The second drop down, the "models" drop down, is also populated by a "regular" SQL query using ColdFusion, but my inexpertise says it uses AJAX to update it based upon what is selected in that first drop down. In the ColdFusion code, the Doit() function is called in the OnChange event of the "makes" drop down.

What I think is supposed to happen, is when the "makes" drop down is updated, or changed, the DoIt() function is supposed to run. DoIt() is supposed to use that URL in the AJAX code in order to call the ColdFusion code on a separate page which runs the SQL query selecting values from the database based upon what was selected in the "makes" drop down. Then, somehow, the AJAX code replaces the existing "models" drop down, which is empty, with a new drop down that is full of values based on what was selected in the "makes" drop down.

I know this all sounds immensely complicated, and my apologies if I'm making it worse. Somehow this code was working in the past, we have values in the database of selected models, but now that's not working because the drop down either does not populate, or disappears completely.

Thanks again,
Jim

[paulkd]

Hi Jim,

There's no real mystery to ajax. It is simply a GET or POST to a standard cfml file, the response of which is then processed/acted on by JavaScript.

First thing to confirm is whether the url that the ajax is calling is working. You should be able to create a url yourself, my guess is it would look something like:-

https://fisnet.wvu.edu/secure/_listmodels.cfm?make=ford&edit=0

I've tried but I get timed out - your site may be behind some security.

[wmhintz]

Hello again paulkd,

Thank you again for helping me with this situation.

You nailed the URL right on the head, very well done! The only thing which needed to be changed was, for some reason, the "F" needed to be capitalized from "ford" to "Ford". I don't know why that would be, either, you'd think it'd be happy with either. Anyway, https://fisnet.wvu.edu/secure/_listmodels.cfm?make=Ford&edit=0 works for me, I get a dropdown full of Ford models.

However, and maybe this is huge and a deal-breaker/game-changer, I had to log into our FISNET application first in order for this to happen. I don't know what to think about that. The AJAX I am trying to fix is already inside of this FISNET application, I've already had to log into it to use it, so I'm assuming that the login success carries over. Wait, I think I can test that. Let me log into FISNET and then call the URL of https://fisnet.wvu.edu/secure/_listmodels.cfm?make=Ford&edit=0 .

OK, that worked, it didn't ask me to login. Here's another possiblily, and my sincere apologies for thinking and typing out-loud, I'm working on this in a development environment with a different URL. Maybe the production URL, which is what https://fisnet.wvu.edu/secure/_listmodels.cfm?make=Ford&edit=0 is, won't work in development. Let me change the code to point to the development URL and see if that has any effect.

HOLY EXPLATIVES THAT WORKED! The drop-down worked!!! Let me check one more thing to see if this is legitimate or not.

Yeah...that didn't work...but, I don't think it was supposed to. Bear with me: the URL was only HTTP, not HTTPS. FISNET is now behing HTTPS, thus HTTP doesn't exist anymore, so it shouldn't work, right?

I think you've figured it out! I think what's happening is that, because I'm not logged into FISNET on the production side which is using HTTPS, that the AJAX is actually working but being stopped by the login...it's not returning data because it never gets to that point.

Paulkd, you may be the smartest human on the planet! Thank you so much for leading me out of the dark and shining some amazingly bright light on this problem! I will work with our Operations people to set up the code and environments to work together: dev code needs to point to a dev URL, and production code needs to point to a production URL. Fantastic.

Have a great Friday and weekend!
Jim

[paulkd]

Thank you and good luck with your application. :D