I am using the prototype JavaScript library to read the contents of a text area (which is often the complete mark-up for another HTML page), create a new window and then set the new window content to be that same mark-up, like so:
var htmlContent = $("msHTML").value;
var win = window.open("preview.cfm", "Preview HTML", "left=20,top=20,width=500,height=500,toolbar=0,resizable=1,scrollbars=1");
win.document.write(htmlContent); //TODO - throwing an error in IE 7 - Error Invalid Argument
win.document.close();
This works just fine in Firefox but as mentioned in the comment, it's giving an Illegal Argument exception in IE7.
Can anyone help?
I couldn't find anything in the prototype library that might get around browser differences when setting document content. I know there might be another windowing library built on prototype that might work, but that seems like overkill for this issue I think.
Thanks in advance!
The 2nd parameter for
window.open(url, name, features);
"name" in IE, MUST NOT CONTAIN SPACES. (affects all versions of IE)
//works
window.open('page.html', 'mypage', '');
//FAILS in IE
window.open('page.html', 'my page', '');
Remove URL and Title from window.open() - it's a security related issue. You don't need to specify URL anyway since your overwriting window's content on the next line of your code.
This works:
var win = window.open('', '', 'left=20,top=20,' +
'width=500,height=500,toolbar=0,resizable=1,scrollbars=1');
win.document.write($("msHTML").value);
Related
I have a code that used to open a popup window in all browsers, but now chrome started opening a new tab instead.
Does anyone knows what did they change and how do I open a popup window now?
This is my code:
function openWindow(url, title) {
window.open(url, title, 'height=640,width=960,toolbar=no,menubar=no,scrollbars=no,location=no,status=no');
}
i think the problem is in the second argument. check this. name - The name of the window (Note: the name does not specify the title of the new window)
Could you try this code please?
function openWindow(url, title) {
var myWindow = window.open(url, title, "height=640,width=960,toolbar=no,menubar=no,scrollbars=no,location=no,status=no");
}
Working example: https://jsfiddle.net/C0dekid/go96uk5r/5/
This is working for me:
window.open('https://www.google.com', 'MyWindow1', "height=640,width=960,toolbar=no,menubar=no,scrollbars=no,location=no,status=no");
What is your Chrome version?
My version is 49.0.2623.87 m
Generally / ALSO...
This seems to happen whenever you pass an invalid comma delimited "settings string" as your 3rd (settings) param, i.e. window.open(url, window_title, settings).
So, check your spelling, look for errors, make sure you haven't specified (passed in) incorrect/incompatible options in that string.
It seems when this happens the window.open() call will just ignore the whole OPEN IN A NEW WINDOW concept, and just opens the specified URL (as best it can retrieve it) in a new/next tab.
I am aware of two ways of calling the "print" dialog of browser (I used the Search, of course):
document.print()
document.execCommand('print', false, null)
What is the difference between them? Support across browsers? Papers, docs or standards? Which is more correct thing to use?
Another question: what is the most straight way to print given part of a webpage? I know we can create new window or iframe to call any of two print methods above. Which one has less pitfalls?
I've tested different ways of printing part of webpage across browsers:
Chrome, Firefox, Opera (12 and new), IE11, 10, 9 and 8. I've tried to create new window, new iframe, or use existing iframe on the page. And then tried .print() and .execCommand('print').
Note: Keep in mind that .print() is called on window, and .execCommand() is called on document.
Code used for testing can be found here
Correct me if my testing code is wrong, I just wanted to find the clearest way to do the job. My conclusions:
Opera 12 can not print part of a webpage (?)
IEs don't print() iframes and windows, except current window.
Calling print() on documents inside iframes or created windows in IEs breaks the print() on current document. Be careful!
jQuery plugin printThis uses tricks for IE to do the job, and it just works. The only exception is Opera 12. By the way, this plugin uses print().
execCommand('print') works almost everywhere and with any approach (iframes, window). It's not supported by Firefox though.
execCommand() returns false if call was unsuccessful, so if you don't want to use plugins and magic tricks, create window or iframe, call execCommand('print') and if it returns false, call print().
One more thing:
Creating an iframe is tricky: you can't access its window or document directly (yes, you have ContentDocument property, which behaves differently across browsers). You should name it and then call window.frames[name] to get window object from that iframe. Do not try to call window.frames(id) - it will return the iframe.
That last method mentioned in the accepted answer, then, ends up looking like this:
iframe = document.getElementById('iframe-id');
var printed = iframe.contentWindow.document.execCommand('print', false, null);
if (!printed) window.print();
alternative:
try {
iframe = document.getElementById('iframe-id');
iframe.contentWindow.document.execCommand('print', false, null);
}
catch(e) {
window.print();
}
similar method used by printThis
if (document.queryCommandSupported("print")) {
$iframe[0].contentWindow.print();
$iframe[0].contentWindow.document.execCommand("print", false, null);
} else {
$iframe[0].contentWindow.focus();
$iframe[0].contentWindow.print();
}
You can use the combination of window.open and execComand (saveas
exemple:
<script type= "text/javascript">
function saveas() {
var oPrntWin = window.open("","_blank","width=1,height=1,left=1,top=1,menubar=yes,toolbar=yes,resizable=yes,location=no,scrollbars=yes");
oPrntWin.document.open();
oPrntWin.document.write(editeur.innerHTML);
oPrntWin .document.execCommand("SaveAs",true,"C:\\My Documents\\Saved Content.html");
oPrntWin.document.close();
}
</script>
editeur.html is a part of my document
you can do same for your frame
replace the writting in a new Window by the property "src" for the body
I found a bug on bestbuy.com in IE8 and I cannot seem to understand why it occurs. It also occurs in IE8 on sites such as comcast.com and raymourflanigan.com, but not on google.com or godaddy.com.
The following code throws a "Invalid procedure call or argument" error (specifically the last line is what throws the error):
var p = document.createElement("p");
var holder = Element.prototype.appendChild;
holder.apply(document.body, [p]);
This is very strange because I've tried it in other websites in IE8 and it works like a charm. I tried using .call instead of .apply, and even storing a reference to the original appendChild method to another variable on the Element prototype, but both of these attempts threw the same error.
What is causing this?
edit
"What kind of code could possibly cause this error?"
It would seem that the error is related to the document.body not being available as a result of the page being in strict mode. The mode is entered at bestbuy as a result of the directive:
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
With regards to internet explorer, the option chrome=1 creates a Google Content Frame (GCF) will force the page to operate in strict mode. comcast.com is in strict mode as a result of its doctype header using XHTML.
There are various ways to enter document modes in IE
The net result of the page being in strict mode is that the rendering surface becomes available at document.documentElement. This code will append text and a paragraph at the bottom of the viewing area:
var p = document.createElement("p");
p.innerHTML = "APPEND";
var holder = Element.prototype.appendChild;
holder.apply(document.documentElement, [p]);
I made this fiddle in order to test this behavior: http://jsfiddle.net/LAkQk/
I first decided to test this behavior in multiple browsers.
Runs without error in chrome, firefox, safari, and IE8.
Note that to test this fiddle (or any really) on ie8 you must use /embedded and then click "result".
So lets just start off with the acknowledgement that there is something on those sites which is causing the conflict.
I was able to repeat the error using IE8 on bestbuy.com, and to confirm that it did work at google.com
However, this is not an issue with apply or appendChild per say. It is specifically an issue with passing the document.body. You may test this yourself with this code at bestbuy.com:
(function(){
var p = document.createElement("p");
p.innerHTML = "APPEND";
var holder = Element.prototype.appendChild;
var d = document.getElementById("header");
holder.apply(d, [p]);
})()
Perhaps it is because of something attached to the body as a result of one of their plugins. Amusingly, this works from the ie console at bestbuy.com
$("body").append('<p>Append!</p>');
I looked through a number of the plugins and cannot find the exact line of code which is causing the overload or conflict, but it must be there, more than likely as a result of sniffing the user agent.
Debugger says "'Element' is undefined" for Travis' code and the only JS exception I receive when I load the page is that 'hasAttribute' is a not supported method. Both happens only when the IE8 loads the page in compatibility mode (Document Mode: IE7 Standards), but probably I load a different page from yours: your code uses Element so the exception would be the same as for Travis' code.
And here is the answer:
What's IE take on HTMLDocument and HTMLElement
There is no 'Element' in IE7.
Trying to select the following link in html:
Nodequeue
with this Javascript:
jQuery("a:contains('Nodequeue')").trigger("click");
And I am receiving this error message:
Javascript console (:1): Unsafe JavaScript attempt to access frame with URL http://cdn.nprove.com/cpma/p/1/2/e/b/12ebf3bc368ry3ra.html?npuid=1310010225&rurl=&id=cpma-2n7eypbvio581300288437193&null=&r=366424962878227 from frame with URL http://www.benzinga.com/analyst-ratings/analyst-color/11/07/1742957/the-beef-stops-here. Domains, protocols and ports must match.
Any idea what might cause this?
I created a
JSFiddle of your code which you can look at and notice that in the console your error doesn't come up in Chrome 12 or FireFox 5. I'm not sure what version of jQuery you are using that is causing that or your DOM situation that may be triggering that error, however, try this potential fix:
(function(window, $) {
$.fn.triggerAnchor = function() {
return this.each(function(e) {
var href = $(this).attr('href');
window.location.href = href;
return false;
});
};
})(this, this.jQuery);
Then use with:
$("a:contains('Nodequeue')").triggerAnchor();
I don't think jQuery triggers anchors, and it certaintly doesn't trigger native click events. This is the closest thing I can think of to emulate that behavior.
You can see it 'working' here
Explanation of the code:
The code is simply a jQuery plugin that looks at the href attribute of anchor and sets the window location to that value. I wrote in the typical pattern of a wrapped closure to localize references to window and jQuery. I'm allowing you to call this on multiple anchors, but I'm assuming the average user would only need to run this once.
That error usually means you are making a javascript request from one frame to another. In this case, is the link in an iframe, or is jquery running in an iframe?
Apparently, this call to window.open is not valid under Internet Explorer. The Javascript code on my site is not running, I would assume it is due to that error.
The line it tells me the error is on, is the call to window.open, apparently an argument is not valid there.
$('.objeto').click(
function() {
var center = 'height=380,width=900,top='+((screen.width - 900)/2)+',left='+((screen.height - 380)/2);
var address = $(this).attr('id');
window.open (address,'Ver articulo', config=center);
}
);
The site runs fine under both Google Chrome, and Firefox.
In IE, you can't have spaces in your second variable (the new window's name).
Try:
window.open (address,'Ver_articulo', config=center);
Also worth re-iterating that IE9 (and possibly below) doesn't like hyphens ('-') in the window name (2nd parameter).
I know one of the comments mentioned this, but it's a bit buried - and it's one tip that just solved an issue for me.
I'm not sure what config is, you just need:
window.open (address,'VerArticulo', center);
Keep in mind though, it looks like your id attribute is invalid to get the effect here, you probably want to use something different, e.g. data-href="urlHere" on the element, if it's not an anchor already.
even thou it's kind a late with answer for OP, but for someone else stumbling across this post it might help:
Had exactly same problem as OP after trying to use "window.open" method. It turns out that Chrome is ok with original href tag with URL in it where IE seems to get confused with that. After removing href from link worked spot on.
CODE SAMPLE:
$(document).ready(function ()
{
$('a[rel^="external"]').each(function ()
{
var externalLink = $(this);
var externalLinkValue = externalLink.attr("href");
externalLink.unbind('click');
externalLink.removeAttr("href");
externalLink.click(function (event)
{
event.preventDefault();
followExtrenalLink = window.open(externalLinkValue,'_blank');
});
externalLink.hover(function ()
{
externalLink.css('cursor', 'pointer');
});
});