Using jsPDF, currently attempting to do the following:
Define downloadPDF function
Generate PDF document with "Hello world" string
Download PDF document
Declare a button with an onclick that calls downloadPDF()
<html>
<head>
<title>Page Title</title>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="//mrrio.github.io/jsPDF/dist/jspdf.debug.js"></script>
</head>
<body>
<script>
function downloadPDF() {
var doc = new jsPDF('p', 'in', 'letter');
doc.text('Hello world', 10, 10);
doc.save('myPDF');
}
</script>
<button onclick="downloadPDF()" class="button">Run Code</button>
</body>
</html>
But the PDF document turns out to be empty.
Any ideas ?
What are the arguments that you're passing to the jsPDF constructor supposed to do? Removing them worked for me:
var doc = new jsPDF();
Working example: http://output.jsbin.com/kaxafuwiri
Related
I'm trying to read MIME text with http://emailjs.org/ but I get the javascript error 'MimeParser is not defined'
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="js/vendor/emailjs/emailjs-mime-codec.js"></script>
<script src="js/vendor/emailjs/emailjs-addressparser.js"></script>
<script src="js/vendor/emailjs/emailjs-mime-parser.js"></script>
</head>
<body>
</body>
<script>
$(function(){
var p = new MimeParser();
});
</script>
The JavaScript files are loading properly.
What am I doing wrong? Thanks.
Try
var parser = new this['emailjs-mime-parser'];
You are missing one java script emailjs-stringencoding.js
Try to include in below order
emailjs-addressparser.js
emailjs-stringencoding.js
emailjs-mime-codec.js
emailjs-mime-parser.js
jquery.min.js
You can create an object using below syntax
var parser = new this['emailjs-mime-parser'];
I'm trying to use a plugin called mark.js (https://markjs.io/). From my perspective I'm doing everything they say to, but the Chrome console keeps returning the error:
My html code is as follows:
<!doctype html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/mark.js/7.0.0/mark.min.js"></script>
<script src="highlighter.js"></script>
</head>
<body>
<p>hello i am rob</p>
</body>
</html>
My javascript code, in a file called "highlighter.js", is as follows:
var context = document.querySelector(".context");
var instance = new Mark(context);
instance.mark("rob");
A screenshot from the plugin website:
I don't know what I'm doing wrong. Thanks for the help!
You have to have a class name of .context in order for it to recognise that as the context.
var context = document.querySelector(".context"); // <p> tag class name
var instance = new Mark(context);
instance.mark("rob");
<script src="https://cdnjs.cloudflare.com/ajax/libs/mark.js/7.0.0/mark.min.js"></script>
<!-- notice the class="context" on the paragraph tag -->
<p class="context">hello i am rob</p>
https://jsfiddle.net/e6yzpton/
To mark the entire document you could do something like this:
var context = document.querySelector("body");
var instance = new Mark(context);
var paragraph = document.getElementsByTagName("p")[0].innerHTML;
instance.mark(paragraph);
<script src="https://cdnjs.cloudflare.com/ajax/libs/mark.js/7.0.0/mark.min.js"></script>
<body>
<p>and it was all yellow</p>
</body>
https://jsfiddle.net/e6yzpton/2/
I have two examples using setTimeout(). This one works:
<html>
<head>
<script type='text/javascript' src='https://www.google.com/jsapi'></script>
<script type="text/javascript">
google.load('visualization','1',{packages:['table']});
function start() {
setTimeout(ShowClipboardContent, 2000);
}
function ShowClipboardContent() {
var data = new google.visualization.DataTable(window.clipboardData.getData('Text'));
var table = new google.visualization.Table(document.getElementById('div'));
table.draw(data,{showRowNumber: true});
}
</script>
</head>
<body>
<button onclick='start();'>Show text data in clipboard</button>
<div id='div'></div>
</body>
</html>
But this doesn't:
<!DOCTYPE html>
<html>
<head>
<script type='text/javascript' src='https://www.google.com/jsapi'></script>
<script type='text/javascript'>
google.load('visualization','1',{packages:['table']});
</script>
<script type='text/javascript'>
//runs powershell and copies output onto clipboard
function powershell(t) {
//object that will execute powershell
var run = new ActiveXObject("Shell.Application");
//breaks the list of servers into array
var servers = t.textarea.value.split('\n');
//script that powershell will run
var script = 'some powershell command';
//path to powershell.exe
var program = 'C:\\Windows\\system32\\WindowsPowerShell\\v1.0\\powershell.exe';
//putting it all together
run.ShellExecute(program,script,'','open','1');
setTimeout(drawTable, 10000);
}
//draws data table using data from clipboard
function drawTable() {
var data = new google.visualization.DataTable(window.clipboardData.getData('Text'));
var table = new google.visualization.Table(document.getElementById('table'));
table.draw(data, {showRowNumber: true});
}
</script>
</head>
<body>
<div id='form'>
<form>
Enter name(s):<br />
<textarea id='textarea' style='width:20%; height:500px;'></textarea><br />
<button onclick='powershell(this.form)'>Query</button>
</form>
</div>
<div id='table'></div>
</body>
</html>
Just to reiterate: the problem is that setTimeout() won't work on the second code but works on the first one and I would like to know why because I see no difference.
try to add a
console.log(drawTable);
just before your timeout. if it returns 'function', it'a good, your timeout will be ok. if not return anything, your activeX script should break the code
Im trying to parse an xml string in IE based on the following example: http://dean.edwards.name/weblog/2006/04/easy-xml/
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(function(){
var xml = document.createElement("xml");
xml.src = '<test><node1>Test</node1></test>';
document.body.appendChild(xml);
var xmlDocument = xml.XMLDocument;
document.body.removeChild(xml);
});
</script>
</head>
<body>
</body>
</html>
Fiddle
However, its not working. I get no errors, but nothing is happening.
Is there any way to generate an XML file on the client side in IE based on a valid xml string? Is activeX the only option?
Thanks in advance
A variant I have working is not to create an xml object, but create a wrapper div instead:
<script type="text/javascript">
$(function(){
var div, xmlDocument;
div = document.createElement('div');
div.innerHTML = '<xml><test><node1>Test</node1></test></xml>';
document.body.appendChild(div);
xmlDocument = div.firstChild.XMLDocument;
document.body.removeChild(div);
});
</script>
ActiveX is certainly one option. The code would be something like:
var xml = '<test><node1>Test</node1></test>';
var xmlDoc = new window.ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async = "false";
xmlDoc.loadXML(xml);
alert(xmlDoc.documentElement.nodeName);
I'm trying to use Knockout js in a simple web application.
Here's my dummy javascript code:
function MainViewModel() {
this.myText = ko.observable('Hello world');
}
var MainViewModelInstance = new MainViewModel();
ko.applyBindings(MainViewModelInstance);
But when I run the index.html, the debug console says "ko.applyBindings is not a function"!
Help!
Thanks
You have not included the link to the knockout.js library in your source code or the link is wrong. Fix this and it will work.
<script src="/scripts/knockout-2.0.0.js" type="text/javascript"></script>
Where the /scripts directory is the location on the server where knockoutjs resides.
EDIT
Here is an example of your code that works.
<html>
<head>
<script src="knockout-2.0.0.js" type="text/javascript"></script>
</head>
<body>
<script type="text/javascript">
function MainViewModel() {
this.myText = ko.observable('Hello world');
}
var MainViewModelInstance = new MainViewModel();
ko.applyBindings(MainViewModelInstance);
</script>
</body>
</html>