priniting a pdf genrated from php from a iframe using js - javascript

I have this code
<!DOCTYPE HTML>
<head>
<meta http-equiv="content-type" content="text/html" />
<meta name="author" content="lolkittens" />
<title>Untitled 2</title>
</head>
<body>
<p>Don't forget to print your document!</p>
<iframe src="genpdf.php" id="pdfDocument"></iframe>
<script>
function printPage() { print(); }
function printIframe(id)
{
var iframe = document.frames ? document.frames[id] : document.getElementById(id);
var ifWin = iframe.contentWindow || iframe;
iframe.focus();
ifWin.printPage();
return false;
}
printIframe('pdfDocument');
</script>
</body>
</html>
courtesy Open Printer Dialog for PDF file Automatically
However i keep getting this error ...
TypeError: ifWin.printPage is not a function
not too sure what i am doing wrong and how it can be solved (problem in FF and chrome) ..
thanks in advance.

Yes You need to put printPage function inside Iframe but there is one more way you can call print method of the window object of iframe directly without the need of printPage() like
ifWin.print();
instead of
ifWin.printPage();

Related

Firefox not executing JavaScript files that were loaded dynamically

I'm trying to load two scripts that were functionally deferred on account of their type attributes being non-standard i.e. text/javascript/defer. Doing this causes the parser to ignore them so I want to reload them using JavaScript.
My HTML is as below:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>No Title</title>
<meta name="keywords" content="">
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript/defer" src="assets/js/test3.js"></script>
<script type="text/javascript/defer" src="assets/js/test4.js"></script>
<script type="text/javascript" src="assets/js/jquery.js"></script>
<script>
$(document).ready(function(){
var defer_js_collection_obj = $("[type='text/javascript/defer']"),
el_head_rq_obj = $('head'),
el_head_obj = el_head_rq_obj[0]
;
if(defer_js_collection_obj.length > 0)
{
//Reload JavaScript
defer_js_collection_obj.each(function() {
var file_src_outer_html_str = this.outerHTML;
var file_src_res_arr = file_src_outer_html_str.match("src *\= *[\"\']{1}(.*?)[\"\']{1}");
var file_src_str = file_src_res_arr[1];
var fileref = document.createElement('script');
fileref.setAttribute("type", "text/javascript");
fileref.setAttribute("src", file_src_str);
document.getElementsByTagName("head")[0].appendChild(fileref);
});
//Unload JavaScript with defer tag
for(var j = defer_js_collection_obj.length-1; j >= 0; j--)
{
defer_js_collection_obj[j].parentNode.removeChild(defer_js_collection_obj[j]);
}
}
});
</script>
</head>
<body>
<div>Load Deferred JavaScript</div>
</body>
</html>
jquery.js is version 1.11.2. test3.js and test4.js reference the javascript files I want to load, and they contain console.log('test3.js is loaded'); and console.log('test4.js is loaded'); respectively.
The issue I'm having is that this script works virtually everywhere else except on Firefox. I'm on a Mac OS X 10.10.5 using Firefox 46.0.1, and I don't see the console.log message when I load the script.
How can I fix this?
It might be a mime type issue. Do you happen to see any message in the console stating "not well-formed"? In any case, this seemed to work for me and I agree that your code did not work in FF when I first tried it.
$(document).ready(function(){
console.log("main");
var $body = $($("body")[0]);
var $scripts = $("[type='text/javascript/defer']");
$scripts.each(function(){
var scriptTag = document.createElement("script");
scriptTag.setAttribute("type", "text/javascript");
scriptTag.setAttribute("src", $(this).attr("src"));
$body.append(scriptTag);
});
});
Try to append your script at the end of body, so instead do:
document.getElementsByTagName("body")[0].appendChild(fileref);

Pop-up based on location (Specifically the UK)

I have a very internationalised website, however I need to produce a pop-up specifically for our UK customers.
What I require is:
On page load: Is the user from the UK?
If yes then show div.
Else
Div remains hidden.
You can do this using freegeoip.
Since you mentioned that you want to use plain JavaScript (not jQuery), you should use JSONP to get the country:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset=utf-8>
<title>UK localisation</title>
</head>
<body>
<div id="myDiv" style="display:none">
<h1>Kittens</h1>
</div>
<script>
function toggleDiv(content) {
console.log(content.country_code);
if(content.country_code === 'GB') //Or GBR, or UK, I'm not sure.
{
document.getElementById('myDiv').style.display = "inline";
}
else
{
alert("You are not from UK, you are from " + content.country_code);
document.getElementById('myDiv').style.display = "none";
}
}
window.onload = function()
{
// create script element
var script = document.createElement('script');
// passing src with callback name
script.src = 'http://freegeoip.net/json/?callback=toggleDiv';
// insert script to document and load content
document.body.appendChild(script);
}
</script>
</body>
</html>

CamanJS image manipulation, strange error

i'm using CamanJS to do some images manipulation with javascript, and I have two similar really simple scripts, the first works well, the second not (and this is the script i need working).
This is the first working:
<!DOCTYPE html>
<html lang="en">
<head>
<title>CamanJS Testing Playground</title>
<script type="text/javascript" src="caman.full.min.js"></script>
</head>
<body>
<button onclick="filtraPhoto();">MODIFICA</button><br />
<img id="smallImage" />
<script>
var immagine;
var smallImage = document.getElementById('smallImage');
smallImage.src = "test1_600.jpg";
immagine = Caman("#smallImage", function () {});
function filtraPhoto() {
immagine.brightness(10).contrast(500).render(function () {
alert("Done!");
});
}
</script>
</body>
</html>
This is the second not working, it return in firebug the error: TypeError: this.c.pixelData is undefined
<!DOCTYPE html>
<html lang="en">
<head>
<title>CamanJS Testing Playground</title>
<script type="text/javascript" src="caman.full.min.js"></script>
<script>
var immagine;
function carica()
{
var smallImage = document.getElementById('smallImage');
smallImage.src = "test1_600.jpg";
immagine = Caman("#smallImage", function () {});
}
function filtraPhoto() {
immagine.brightness(10).contrast(500).render(function () {
alert("Done!");
});
}
</script>
</head>
<body>
<button onclick="carica();">carica immagine</button><br />
<button onclick="filtraPhoto();">MODIFICA</button><br />
<img id="smallImage" />
</body>
</html>
Any help please?
It runs just fine in both Firefox and Chrome for me. In my limited experience, this.c.pixelData typically comes when your conversion to a CamanInstance was not successfully created.
This can be because of many things, but one that isn't expected is that CamanJS won't let you use the same html identifier (class or id) for more than one object, even if you've swapped them out. So if you're running the two scripts above on the same page, it will cause errors.
Sorry, without being able to reproduce your error, it's hard to help more than that.

Android: Issue in Calling JavaScript Function

JavaScript Function
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width; user-scalable=0;" />
<title>My HTML</title>
</head>
<body>
<h1>MyHTML</h1>
<p id="mytext">Hello!</p>
function callFromActivity(msg){
alert("Hello! I am an alert box!");
document.getElementById("mytext").innerHTML = msg;
}
</script>
</body>
</html>
Android Code
myWebView.loadUrl("file:///android_asset/mypage.html");
String msgToSend = "message";
myWebView.loadUrl("javascript:callFromActivity(\"" + msgToSend
+ "\")");
on Button Clicked event java script function call correctly. but i am not able to call java script function without button click.
Your javascript is wrong formatted. You should put it in such tags
<script type="text/javascript">
//your JS
</script>
So, your code will looks like that
<script type="text/javascript">
function callFromActivity(msg){
alert("Hello! I am an alert box!");
document.getElementById("mytext").innerHTML = msg;
}
</script>
try this ,
String msgToSend = "message";
String js = "msg = "+msgToSend+";"
+"function callFromActivity(msg){"
+"alert('Hello! I am an alert box!');"
+"document.getElementById('mytext').innerHTML = msg;";
view.loadUrl("javascript:(function(){" + js + "})()");

"Access is denied" error in IE6

This code is giving me error on line 10 in IE6. That is, var ref = ...;
What is the error here?
<html>
<head>
<title>JavaScript Popup Example 3</title>
</head>
<SCRIPT language="JavaScript1.2">
function MyClass()
{
this.OpenWindow = function()
{
var ref = window.open ("http://www.google.com", "mywindow", "location=1,status=1,scrollbars=1,width=100,height=100");
ref.moveTo(0,0);
}
}
</SCRIPT>
<body onload="javascript: new MyClass().OpenWindow()">
<H1>JavaScript Popup Example 3</H1>
</body>
</html>
The message:
A run-time error has occurred.
Do you wish to debug?
Line:10
Error: Access is denied
When you open a window with a page from a different domain, you don't get a reference to the window back. The ref variable is null.
If you want to move the window, you have to open it without a page, move it, then load the page in it:
var r = window.open ('', 'mywindow', 'location=1,status=1,scrollbars=1,width=100,height=100');
r.moveTo(0,0);
r.location.href = 'http://www.google.com';
the problem is here - ref.moveTo(0,0); - on most security settings this action is unavailable
also, javascript: on onload just creates a label "javascript"
<html>
<head>
<title>JavaScript Popup Example 3</title>
</head>
<SCRIPT language="JavaScript">
function MyClass()
{
this.OpenWindow = function()
{
var ref = window.open("http://www.google.com", "mywindow", "location=1,status=1,scrollbars=1,width=100,height=100");
ref.moveTo(0,0);
}
}
</SCRIPT>
<body onload="new MyClass().OpenWindow()">
<H1>JavaScript Popup Example 3</H1>
</body>
</html>

Categories

Resources