Pass value to be inserted in div to open window - javascript

I am trying to open a new window in the same tab and pass some html code to be inserted in a div section of the new open window. I am having trouble to pass the data as shown below:
Parent javascript:
function popupPlace() {
var mywindow = window.open('Details.html','_self');
mywindow.dataFromParent = placeListAll;
mywindow.init();
}
Child javascript:
<script type="text/javascript">
var dataFromParent;
function init() {
document.getElementById('Place').innerHTML=dataFromParent;
}
</script>
The init method is not being called.

Are you sure you're not talking about a new tab in the same window? Anymway the better way for you to send data in your new tab seems to pass it as url param :
window.open('Details.html?data=some-data-maybe-b64-encoded','_self');
Then you can get it in child with :
var urlParams = new URLSearchParams(window.location.search);
var data = urlParams.get('data'));
finally :
//parent
function popupPlace() {
//encoding to be able to store html in uri
var htmlForChild = encodeURIComponent("<p>Content for Children</p>");
var mywindow = window.open('Details.html?data=' + htmlForchild, '_self');
mywindow.dataFromParent = placeListAll;
mywindow.init();
}
//child
function init() {
var urlParams = new URLSearchParams(window.location.search);
document.getElementById('Place').innerHTML=decodeURIComponent(urlParams);
}

Related

How to open a new Tab with bind parameters using java script

This is my function. I want to open a new window with the below URL and pass these parameters.
function viewWeightAge() {
var userNIC = document.getElementById("NICNo");
var childName = document.getElementById("childName");
window.location.href = "https://localhost:8080/KiddieCare/AdminPanel/WeightAgeGraph.jsp?childName="+childName+"&userNIC="+userNIC;
}
can anyone explain me the error?
Question Updated.
function showWeightAge(){
var userNIC = document.getElementById("NICNo");
var childName = document.getElementById("childName");
var parameters= userNIC,childName;
window.open ('https://localhost:8080/KiddieCare/AdminPanel/WeightAgeGraph.jsp','Window Name',parameters);
}
I Have tried. It's an open new Window. Like this
using window.open() I can open a window but I want to send parameters to the new JSP.
Instead of using window.location.href which change the url of the current window
you should use window.open()
https://www.w3schools.com/jsref/met_win_open.asp
Note that it could be blocked as an unwanted popup
In your case it can be done as
function viewWeightAge() {
const userNIC = document.getElementById("NICNo");
const childName = document.getElementById("childName");
window.open("https://localhost:8080/KiddieCare/AdminPanel/WeightAgeGraph.jsp?childName="+childName+"&userNIC="+userNIC);
}

Set 'src' attribute for document.createElement('script')?

I'm trying to create a highchart on a different tab. But Im getting error that high chart is not defined. I have tried to register Highchart.js using different methods. Code is given below.
function OpenWin() {
var w = window.open();
w.document.open();
w.document.write('<div id="container" style="width:100%; height:400px;"></div>');
var scriptHead = w.document.createElement("SCRIPT");
//scriptHead.setAttribute('src','http://code.highcharts.com/highcharts.js');
var link = "http://code.highcharts.com/highcharts.js";
scriptHead.src = link;
w.document.head.appendChild(scriptHead);
var script = w.document.createElement("SCRIPT");
w.document.body.appendChild(script);
var js = w.document.createTextNode('var a = localStorage.getItem("ImportOptions"); console.log(JSON.parse(a)); var chart = new Highcharts.Chart(JSON.parse(a))');
script.appendChild(js);
w.document.close();
}
You need to wait for previous script to load. Demo.
function OpenWin() {
var w = window.open();
w.document.open();
w.document.write('<div id="container" style="width:100%; height:400px;"></div>');
var scriptHead = w.document.createElement("SCRIPT");
//scriptHead.setAttribute('src','http://code.highcharts.com/highcharts.js');
var link = "http://code.highcharts.com/highcharts.js";
// bind on script load event
scriptHead.onload = function() {
var script = w.document.createElement("SCRIPT");
w.document.body.appendChild(script);
var js = w.document.createTextNode('var a = localStorage.getItem("ImportOptions"); console.log(JSON.parse(a)); var chart = new Highcharts.Chart(JSON.parse(a))');
script.appendChild(js);
w.document.close();
}
// as A.Wolff mentioned you might need to set onload befor src for some browsers.
scriptHead.src = link;
w.document.head.appendChild(scriptHead);
}

Open html text in new tab using $window.open

$window.open('<span>request processed successfully</span>', '_blank');
I would like the $window service to show the simple text request processed successfully in a new tab.
But instead of it, it treats the html text as location url and tries to open the page http://domain-addr#request processed successfully
How can i pass html text argument to angular's $window service?
You can do something like this in standard JavaScript...
function newWindow() {
// create some html elements
var para = document.createElement('p');
var title = document.createElement('title');
// define some window attributes
var features = 'width=400, height=400, status=1, menubar=1, location=0, left=100, top=100';
var winName = 'New_Window';
// populate the html elements
para.textContent = 'Some example text.';
title.textContent = 'New Window Title';
// define a reference to the new window
// and open it with defined attributes
var winRef = window.open('', winName, features);
// append the html elements to the head
// and body of the new window
winRef.document.head.appendChild(title);
winRef.document.body.appendChild(para);
}
you can use pure javascript,
var w = window.open("www.mydomain.com/test.php", "_blank");
w.document.write('<span>request processed successfully</span>');
you could just create a simple html document with called success.htm or similar with "request processed successfully" and include that in the function.
so $window.open('success.html','_blank', 'size blah blah');
Try this:
HTML:
<button id="newWindow">
Click
</button>
JavaScript:
//call the function right away
(function() {
//grab button by id
var newWindow = document.getElementById("newWindow");
//add an event listener
newWindow.addEventListener("click", function() {
//create a new p element
var p = document.createElement('p');
// change the styles of your paragraph
// optional
p.style.color = "red";
p.style.fontSize = "4em";
//Insert the text you want
p.textContent = "request processed successfully";
//open the window
var windRed = window.open('', '_blank');
//append the p element to the new window's body
windRed.document.body.appendChild(p);
}, false);
})();

Closing a popup window after performing print

I have a requirement tp popup a window display a pdf page, perform silent print and close the same.
String s =
"var win = window.open('PrintPopUp.jsf','_blank',\"height=300,width=200,scrollbars=no," +
"status=no, resizable=no, screenx=0, screeny=0\");" +
"win.onclick= function(){ win.close();}"
I used the above code to get the popup , on click of print I write this code to my page and the following to call a servlet to generate the pdf;
FacesContext context = FacesContext.getCurrentInstance();
HttpServletRequest request = (HttpServletRequest)context.getExternalContext().getRequest();
HttpServletResponse response = (HttpServletResponse)context.getExternalContext().getResponse();
RequestDispatcher dispatcher = request.getRequestDispatcher("/hisprintservlet");
My question is this, I have been able to bring up the window, perform silent print but no matter what I do the popup wont close.
I am using IE 11 and the project uses ADF 12c.
Please help..
Checkout the docs on Popups here.
function showPopup(event)
{
event.cancel();
var source = event.getSource();
var popupid="popup";
var popup = AdfPage.PAGE.findComponentByAbsoluteId(popupId);
if (!popup.isPopupVisible())
{
var hints = {};
hints[AdfRichPopup.HINT_LAUNCH_ID] = source.getClientId();
hints[AdfRichPopup.HINT_ALIGN_ID] = source.getClientId();
hints[AdfRichPopup.HINT_ALIGN] = AdfRichPopup.ALIGN_AFTER_START;
popup.show(hints);
}
}
function hidePopup(event)
{
event.cancel();
var source = event.getSource();
var popupId = source.getProperty("popupId");
var isCanceled = source.getProperty("isCanceled");
var popup = AdfPage.PAGE.findComponentByAbsoluteId(popupId);
if (popup.isPopupVisible())
{
if (isCanceled)
popup.cancel();
else
popup.hide();
}
}
...
...
Hello World!
...
...
I found a solution for this.. i added an iframe to my popup window. In the body tag I added the followingg code to close ..
function test(win){if(win==null){alert('null');} else {setTimeout(function(win){this.close();},3000);}}
This works well in IE11

Random behaviour of SWF loading

I have a really strange behiavour with the loading of a SWF file: the buttons on it are working on the first load, but if I reload the page they don't work anymore, even if I empty my cache or force SWF reload by appending a random parameter at the end of the URL. The buttons are generated from a XML file called in the init function.
Here is how I call my swf :
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script
<script type="text/javascript">
// <![CDATA[
window.onload=function(){
var _time = (new Date()).getTime();
var params = {wmode: "transparent", src: "http://www.mywebsite.com/sites/default/files/medias/map/monde.swf?" + _time};
var flashvars = {site: "/fr"};
swfobject.embedSWF("http://www.mywebsite.com/sites/default/files/medias/map/monde.swf?" + _time, "flashContent", 920, 450, "10", false, flashvars, params);
};
// ]]>
</script>
<div id="flashContent"> </div>
The only way to get the buttons back is to edit the source in Firebug, change the SWF URL with something random and change it back so the URL is loaded again (it's not working on the first try, I have to do it few times before it works).
I don't have any cache on the SWF and on the XML I'm calling from AS3, so I don't understand how I can have such a random behaviour :
Here is the relevant parts of the AS3 script :
private function init(e:Event = null):void
{
removeEventListener(Event.ADDED_TO_STAGE, init);
var site:String = "";
if (this.loaderInfo.parameters.site != undefined)
site = this.loaderInfo.parameters.site;
_uLoader = new URLLoader();
_uLoader.addEventListener(Event.COMPLETE, _initMap);
var httpHeader : URLRequestHeader = new URLRequestHeader("pragma", "no-cache");
var httpRequest : URLRequest = new URLRequest(site+"/ajax/mywebsite_tools/list_master");
httpRequest.requestHeaders.push(httpHeader);
httpRequest.method = URLRequestMethod.GET;
httpRequest.data = new URLVariables("time="+Number(new Date().getTime()));
_uLoader.load(httpRequest);
_supportContinent = new MovieClip();
this.addChild(_supportContinent);
}
private function _initMap(e:Event):void
{
var cs:mywebsiteSingleton = mywebsiteSingleton.getInstance();
var xml:XML = new XML(_uLoader.data);
cs.xml = xml;
btRetour.buttonMode = true;
btRetour.mouseChildren = false;
btRetour.txt.text = xml.retour.text();
btRetour.gotoAndStop('OUT');
addEventListener(mywebsiteEvent.CONTINENT_CLICK, _contientClick);
btRetour.addEventListener(MouseEvent.CLICK, _retourMonde);
btRetour.addEventListener(MouseEvent.ROLL_OVER, _over);
btRetour.addEventListener(MouseEvent.ROLL_OUT, _out);
}
Figured it out. It was rather trivial in fact, the _initMap() function was randomly called before or after my buttons appear on the timeline. So if i get the xml too fast, the _initMap() function try to refer to a button that doesn't exist.
Fixed it with something a bit dirty, but anyway it works :
private function _initMap(e:Event):void
{
if(!btRetour || btRetour == null || !btRetour.hasOwnProperty("buttonMode")) {
setTimeout(_initMap, 500, e);
return;
}
// ...
}

Categories

Resources