I'm sure this is a combination of a cold plus a lack of sleep, but I'm stuck.
The code couldn't be much simpler:
$.get('template.tpl', function(tpl) {
$.getJSON('json/data2.json', function(data) {
var html = Mustache.render(tpl, data);
$('#output').html(html);
});
});
Tadaa. If I toss a Console.Log(html) on the line after it's declared, it outputs correctly... but for the life of me I can't solve why it's not placing the text into #output like it should. A free-standing $('#output').html("foo"); outside of fething template.tpl works no problem.
Help?
Solved
Solved, thanks to a question from asgoth. Had the code right - had script tags surrounding the template in my .tpl file. They weren't needed any more, since the template was being pushed directly to Mustache... but were being written to the HTML, meaning I couldn't see the result.
I'm going for a nap.
I haven't use Mustache before, but shouldn't you use compile?
var html = Mustache.compile(tpl)(data);
Related
I'm trying to override document.write so i will be able to take the raw html parse it make some manipulations on the code and return the call.
My entire process is async so it's needless to say that when document.write is called if the page has finished loading the document.write will erase the entire document, so i can't recall document.write.
I've searched and found many discussions about that but almost every one of them is very very old so i can't find any good answer.
my code for now is very basic:
const prevDocWrite = document.write;
document.write = function(str,patched) {
if(patched){
prevDocWrite.call(this, str);
}else{
Dom_Parser(str, context).then(newStr => {
prevDocWrite.call(this, newStr);
})};
};
I have added the "patched" part because i'm also calling document.write on my code so i call it like that document.write("str",true) and it will call the original document.write immediately.
I would really appreciate any help or ideas how to make this happen (other projects for reference will be great)
BTW i saw a lot of implementation using innerHtml but that's screwing up the <script> tags:(
Thanks a LOT
I know this is a very basic, very newb question, but i cant seem to make it work.
I have 2 different javascript documents, one named movies and the other named calculator.
I would like to call calculator.js function, and put it inside my code in movies.js so that it would display it's result inside.
My code in movies.js is like this:
function formatState (movies) {
if (!movies.id) { return movies.text; }
var $movies = $(
'<span><!--CALL JS. FUNCTION HERE--> ' + movies.text + '</span>'
);
return $movies;
};
my calculator.js
function calculate_price(value) {
//some data
}
at the end display result would be something like: 39.99€ star wars
Any help is appreciated!
This isn't as basic of a question as you might think, because JS doesn't really have a clear pattern for this.
Check out the answer to this question.
Javascript does not support the concept of "includes" or "imports". If you want to do something like this you either:
Reference both .js files in your HTML page - the order in which they are loaded is important.
Use another library to help you with dynamic loading a Javascript file before executing any code. Require.js is an alternative. jQuery has a way to allow you to do this, but you will introduce another dependency...
More details here: How do I include a JavaScript file in another JavaScript file?
I have a 17000 line page with lots of HTML/JavaScript/jQuery and it's always frustrating when I make a typo and there's no clue when the page loads into the browser what the problem is. It just - doesn't do anything. Consider the patch of code below, for example, where the third line terminates with a ' instead of a ; .
$(document).on('click', 'input#answer_chkbx', function(e) {
if(e.target.checked){
x$ = g.currentElement$.find('.cellContent')'
g.currentElement$.addClass('answerBox')
.css('background-color','tansparent')
.height(25)
.width(150);
}
});
There should be something that runs through the code and finds that immediately.
Is there a way to check for things like this?
Thanks
You might consider a tool such as JSLint or JSHint.
For offline coding you can use Netbeans IDE or Dreamweaver
Im noob in ruby and i coding a simple rakefile ...
one of my task remove from javascript files the "console" lines, what do you thing about the current snippet?
def self.remove_debug()
FileList[File.join(DIST_DIR, '**/console-nodebug.js')].each do |file_name|
puts "file: #{file_name}"
content = File.read(file_name).gsub(/console\..*?;/m, "// console removed")
File.open(file_name, 'wb') { |file| file.write(content) }
end
end
its fine?? i need to change something?
i test the code and all goes fine, but ... im looking for good practices ...
thks!
I would recommend having a debug variable and have ruby initialize that variable (I really don't know much about ruby, I leave this to you, I guess something like injecting it in the html file). And then in you js file you may do like this:
if (debug) {
console.log("I'm debugging! Yay!! XD");
}
In my humble opinion this is better than modifying the file.
Hope it helped, good luck!
==EDIT==
If it's a minified file that you need to shrink I would suggest replacing your regex bu "/* console removed */" instead of "// console removed", just in case that there is some more code after that line.
Other than that I think you will be ok. Is it working?
My problem is that I'm using the CKEditor 3.4 plugin for jQuery, and it's giving me an error in IE 7+8 when executing a $(selector).val(html) call on the editor:
The error:
'this.$.innerHTML' is null or not an object
...which when run in the debugger, points to this line of code in the huge CKEditor.js:
getHtml:function(){var i=this.$.innerHTML;return c?i.replace(/<\?[^>]*>/g,''):i;}
...which translates to this in the source:
getHtml : function()
{
var retval = this.$.innerHTML;
// Strip <?xml:namespace> tags in IE. (#3341).
return CKEDITOR.env.ie ? retval.replace( /<\?[^>]*>/g, '' ) : retval;
},
My offending code (stripped down, but still giving the error):
var editor_data = $("textarea#body").val();
$("textarea#body").val(editor_data);
... and the textarea code for posterity:
<textarea name="body" rows="15" cols="50" class="wysiwyg" id="body"></textarea>
I've tried reproducing in jsFiddle in IE8, but the strange thing is that it works as intended there. I'd love to also provide a working sample but I unfortunately cannot for reasons outside my control.
I've also tried this fix, and it cleared up the error issue, but after that setData did not work as intended and just overwrote the editor contents with nothing. I'll admit this problem+fix is a bit over my head...: http://dev.ckeditor.com/ticket/4566
(Sorry, long post :S) I've also tried to use the direct JavaScript API into CKEditor (abandoning the jQuery integration) and it threw the same error.
Anyone have anything they'd like me to try to fix this issue, or have any hunches of what it might be? It would be much appreciated!
Personally I'm not a fan of the existing answer that consists of modifying the source code because as soon as you update ckEditor, then you have to remember to modify the source yet again. I was having the same problem as the original poster and found a fix that is considered a hack, but totally usable. Simply, a Try/Catch made it all nice and happy in IE8. Now to test in IE7. The other bonus of this fix is that you're not left with blank data when it fails but that you get actual content you were trying to retrieve.
var editor = $('textarea.editor').ckeditorGet();
var vPageContent = "";
try{
vPageContent = editor.getData();//function call fails here
} catch(err){
vPageContent = editor.getData();//but will work here
}
May not be the best solution but take a look at this:
http://dev.ckeditor.com/ticket/4566
It claims that replacing
getHtml:function(){var i=this.$.innerHTML;return c?i.replace(/<\?[^>]*>/g,''):i;},
with
getHtml:function(){return (this.$) ? this.$.innerHTML : "";},
will solve the problem.
I'm not claiming this is the correct answer but I had the same problem today and (for now) it seems to work.
be careful with extra comma. IE does not like exra commas. You can check your code for extra comma with json lint