I have been trying for days to get the credit forms (anyone of them!) to auto detect credit card type. I found some scripts that work fine until i try to add them to the credit card templates. Then the scripts disappear or don't show up in the template. The css and anything else I add to the templates show up in the source or if I look at the in Chrome "Inspect" but not any scripts.So I tried adding them to parts of the page above and below the credit card templates but can't get that to work either. How can I get the scripts to show up in the templates and why don't they appear there? Is it a built in security feature?
What you are experiencing is the fact that the HTML is being injected via an XMLHttpRequest. The embedded scripts are being eval()'d as part of the resulting response. You will not see them in the DOM. (I don't recall the technical explanation for this, but google is your friend)
Without actually seeing your code, I cannot comment why your code is not available/working. As per the given link, it is possible your scope is wrong?
You can add a
debugger statement in your script, and keep the chrome developer console open. If all is working, you should end up on a breakpoint in your eval()'d code.
<checkout_onepage_index translate="label"> <reference name="head"> <action method="addItem"><type>skin_js</type><name>js/your_file.js</name></action> </reference> </checkout_onepage_index>
This will load your script when checkout is loaded.
Another alternative, is to inject the given sript into the HEAD, via embedded code in your .phtml.
This will do the job:
The code above will inject your scripts file load into the HEAD when teh .phtml loads
Also check your console for ANY js errors. A leading error, from something else on teh page will most likely block further loading/eval action of the embedded code.
Hope that helps.