Handlebars is not defined
Solution 1
You are not loading in Handlebars (or your name-table script). You currently have the following markup:
<script type='text/javascript' rel='js/handlebars-v4.0.5.js'></script>
<script type='text/javascript' rel='js/name-table.js'></script>
You should be using the src attribute instead of the rel attribute for script tags.
<script type='text/javascript' src='js/handlebars-v4.0.5.js'></script>
<script type='text/javascript' src='js/name-table.js'></script>
The Mozilla documentation does not specify the rel attribute as a valid script tag attribute.
Solution 2
Include this line:
<script src="https://twitter.github.io/typeahead.js/js/handlebars.js"></script>
You are done. Thanks.
Steverino
Updated on July 09, 2022Comments
-
Steverino almost 2 years
I am new at JS and never tried Handlebars before. I'm trying a very bare-bones example from a tutorial. I have downloaded
handlebars-v4.0.5.js
from the Handlebars website and included it in my page, as follows, along with a template I precompiled,name-table.js
. I'm trying my god damned hardest to complete this tutorial but I can't, because when I run the following code, I getReferenceError: Handlebars is not defined
which I can't for the life of me understand, if the file I downloaded from Handebars' own site is in any way valid.<html> <head> <meta charset='UTF-8'> <title>Test Page!</title> <script type='text/javascript'> function init() { document.getElementById('button').addEventListener('click', buttonClick, false); } function buttonClick() { var injection = Handlebars.templates['name-table']; document.getElementById('button').innerHTML = injection; console.log('hello, world.'); } window.addEventListener('load', init, false); </script> </head> <body> <button id='button'>Button</button> <div id='content'></div> <script type='text/javascript' rel='js/handlebars-v4.0.5.js'></script> <script type='text/javascript' rel='js/name-table.js'></script> </body> </html>
Edit: The answer I marked solved the problem. Another error appears in this code, and I want to let anyone reading this know that
var injection
as defined in this code is a function, not a string as I had thought. This code will work ifrel
is changed tosrc
as in the answer given, and if we usedocument.getElementById('button').innerHTML = injection();
(note the parens).