Jquery / Handlebars error message - Uncaught TypeError: Object [object Object] has no method 'match'
ajax, handlebars.js, javascript, jquery, mysql
Solution
This happens if you try to compile a template from a jquery element object instead of from a string. For example
<script id="my-template-script" type="text/template">...</script>
and then
var my_template = Handlebars.compile( $("#my-template-script") ); // WRONG
You might expect this to blow up right away, but it doesn't. Instead it should be
var my_template = Handlebars.compile( $("#my-template-script").html() );
Problem
i am working on a little learning project and have run into an issue that i cant work out. I get the following error message on google chromes dev console :- ``` Uncaught TypeError: Object [object Object] has no method 'match' lexer.nexthandlebars-1.0.0.beta.6.js:364 lexhandlebars-1.0.0.beta.6.js:392 lexhandlebars-1.0.0.beta.6.js:214 parsehandlebars-1.0.0.beta.6.js:227 Handlebars.parsehandlebars-1.0.0.beta.6.js:507 compilehandlebars-1.0.0.beta.6.js:1472 (anonymous function)handlebars-1.0.0.beta.6.js:1481 (anonymous function)scripts.js:103 jQuery.Callbacks.firejquery.js:1046 jQuery.Callbacks.self.fireWithjquery.js:1164 donejquery.js:7399 jQuery.ajaxTransport.send.callback ``` Now this shows up at an error with the following code in the handlebars scrips ``` match = this._input.match(this.rules[rules[i]]); Uncaught TypeError: Object [object Object] has no method 'match' ``` So what i take from this is that there must be an issue with my code and not the handlebar code even though it is in beta. Here is the section of code that kicked it all off. ``` displayJobInfo: function( e ) { var self = Actors; self.config.jobInfo.slideUp( 300 ); var jobnum = $(this).data( 'job_id' ); $.ajax({ data: { job_id: jobnum } }).then(function( results ) { self.config.jobInfo.html( self.config.JobInfoTemplate( { jobs: results, job_id: jobnum }) ).slideDown(300); }); console.log($(this).data( 'job_id' )); e.preventDefault(); } ``` I have spent hours trying to work this one out myself and have got almost the same section of code working in another part of my site. Little bit of background - i am using php to pull a database from mysql and then to query the database based on as users input and jquery to overlay the fields back onto the page.