"Cannot read property of innerhtml null " issue
file, html, javascript, jquery
Solution
In the tmpl.js file it's looking for an ID here:
tmpl.load = function (id) {
return document.getElementById(id).innerHTML;
};
If it's returning NULL, that means you're not defining the variable "id" anywhere...
Unless I'm much mistaken, you don't need the templates-stuff (tmpl.js) for the basic fileupload script to work though; according to the developers, it's optional: https://github.com/blueimp/jQuery-File-Upload
Problem
I'm using the jQueryFileUpload. I have html that looks like: ``` <input name='memoir[image]' type='file' data-url='memoirs/create' multiple="true" class='fileupload' /> <ul class='list'> </ul> ``` and my jQuery: ``` $('.fileupload').fileupload({ dataType: 'json', add: function (e, data) { var tpl = $('<li class="working"><div class="bar" style="width: 0%"></div><input type="text" value="0" data-width="48" data-height="48"'+ ' data-fgColor="#0788a5" data-readOnly="1" data-bgColor="#3e4043" /><p></p><span></span></li>'); tpl.find('p').text(data.files[0].name); data.context = tpl.appendTo($(this).next($(".list"))); types = /(\.|\/)(gif|jpe?g|png)$/i; file = data.files[0]; if (types.test(file.type) || types.test(file.name)) { alert("Added and validated"); data.context = $(tmpl("template-upload", file)); $('.fileupload').append(data.context); data.submit(); } else { alert("#{file.name} is not a gif, jpeg, or png image file"); } }, progress: function (e, data) { if (data.context) { alert("In progress"); progress = parseInt(data.loaded / data.total * 100, 10); data.context.find('.bar').css('width', progress + '%'); if(progress == 100){ data.context.removeClass('working'); } } } }); ``` Right now, I'm getting the error: ``` Uncaught TypeError: Cannot read property 'innerHTML' of null ``` in the tmpl.js that comes with jQuery File Upload. It says the error is on the line where the progress function starts? Thanks for all help!