I have written a script that opens a pop up window , searches for a user , when finds
the user the search window closes and then the script shows the new user in the parent window.
Basically I tried all of the script separately but I have problems when I pass between windows. The code ahead does not pass the found user, but passes one example user just for meantime to debug the code.
Here is the script file: ( I will explain it later )
var orgWindow
var searchWindow
$(document).ready(function(){
$(".add_participants").on("click", function() {
var orgWindow = window.self
var searchWindow = window.open("http://localhost:3000/users/search", "_blank",
"left=200, top=100, height=300, width=300, menubar=yes");
});
});
function printUser(){
var a = orgWindow.document.createElement("a");
a.setAttribute("href","/users/show");
a.setAttribute("id","3");
var aText = orgWindow.document.createTextNode("elad bezalel");
var img = orgWindow.document.createElement("img");
img.setAttribute("alt","El4");
img.setAttribute("src","/uploads/user/image/3/el4.jpg");
img.setAttribute("height","150");
img.setAttribute("width","150");
myDiv = orgWindow.document.getElementById("par");
a.appendChild(img);
var brk = orgWindow.document.createElement("br");
a.appendChild(brk);
a.appendChild(aText);
myDiv.appendChild(a);
}
function add_user(){
user_id = $("#button").data("user_id");
window.close(searchWindow);
window.blur(searchWindow);
window.focus(orgWindow);
orgWindow.document.write(printUser());
orgWindow.close();
}
I am using jQuery. when I click a button the search window open. Then I find a user in the search window and click on another button (add user) and then the search window closes and the parent window gets focused. Now I tried to implement the user image and name, but somehow it doesn't work.
How should I repair my script?
Note that you have declared orgWindow and searchWindow as variables in two different scopes, the global scope (the two var usages at the top) and local to the click handler. This could be part of your problem.
I think the two separate window contexts are getting intermingled.
In the main page add_user function:
function add_user(user_id){
window.close(searchWindow);
window.blur(searchWindow);
window.focus(orgWindow);
orgWindow.document.write(printUser());
orgWindow.close();
}
And in the popup:
$("#button").click($(window.opener).add_user($(this).data("user_id")));
Related
I the below script, once the button is pressed, a new browser tab with Google is opened. I then want to fill the search box on this newly opened tab.
How do I switch focus to this new tab, so that I can wait for it to load completely and then fill the search box?
<button id="start">Google</button>
<script>
function open_google_in_new_tab() {
var url = "https://www.google.com";
window.open(url);
window.onload(fill_search_box()); // here it will try to operate on the old tab
};
function fill_search_box() {
var search_box = document.getElementsByName("q")[0];
search_box.value = "Some text";
};
var start_button = document.getElementById("start");
start_button.addEventListener("click", open_google_in_new_tab);
</script>
You can't exactly target another element in another document from your script, however, you can set the textbox value of the Google textbox using a query string:
www.google.com?q=SearchTerm
When creating the SearchTerm you should also use encodeURI to ensure that your attached search query meets URL standards
Also, if you wish to open the window in another tag you can use window.open(url, "_blank") to open.
See example below:
Note:- The page will not open due to snippet restrictions - so run in your own browser.
<button id="start">Google</button>
<script>
function open_google_in_new_tab() {
var text = "Some text";
var url = "https://www.google.com?q=" + encodeURI(text);
console.log(url)
window.open(url, '_blank');
};
var start_button = document.getElementById("start");
start_button.addEventListener("click", open_google_in_new_tab);
</script>
You cannot do that with Javascript unfortunately.
However, this might make you achieve something similar if you are willing to try.
You can manipulate the search string via parameter named "q" in the query string of the Google website. So, in order to make the user to go the Google and search this particular word, you attach the keyword to it. Something like this:
var url = "https://www.google.com?q=searchKeyword";
I am creating a button that upon click will open a new window with webpage X, within which there is a search bar that needs to automatically reflect the search "Team."
I already have the document.getElementById() of webpage X, and my button already opens webpage X, but how do I (upon window.open) fill the search bar with "Team" using a script that is being run on the first page.
I hope this is clear, as I am somewhat new to this.
When you call window.open(...) you have to assign the result to a variable, then you can use it to manipulate the new window contents, and look for elements the same that you do with the current one.
Be aware that you'll have to wait for the new window to be loaded before searching for elements on it, so for your pourpose it's better to put that code into the onload callback:
var theNewWindow = window.open("https://www.youtube.com");
theNewWindow.onload = function() {
theNewWindow.document.getElementById("masthead-search-term").value = 'team';
};
Hi this is my first question in this site.
My problem is-I have created a jsp where in i have given one link to call another jsp (already created by some one) in a popup window.On saving some details in child window i want those values to be accessed in my parent window.But i dont have the permission to change the code of child window jsp.
can anyone help me...?
Thanks,
the code i am using to open a popup is as follows.
function popUp(url){
alert("inside popup");
window.open(url,'newWindow','width=750,height=400,left=150,top=100,toolbar=no,resizable=true');
}
Provided the url does not violate the same origin policy, you can access the window properties via the return value of window.open(), eg
var windowRef = window.open(url, ...);
var someElement = windowRef.document.getElementById("element-id");
var someJavaScriptVar = windowRef.someVar;
I have created a form so the user can complete his name, last name, credit card number etc.
All the information is provided by the user.
When the user has ended his work he should press a button and a new window pops up with the user's information revised.
Anyone has a suggestion on this? I would be grateful.
opener.document.getElementById("text").value = txt;
You can reference the child window from the parent one and vice-versa. When you open a popup window with window.open(url, options), it returns a reference to the child window. You can add handlers to it. Using jquery:
var w = window.open(url);
$(w).load(function() {
alert("I've just loaded");
});
From the child window, you can use the variable opener to reference the parent window. So if you want to grab info from the parent window, you'll use something like (again jquery):
var first_name = $(opener.document).find('.first-name').text();
Got this info here: http://sharkysoft.com/tutorials/jsa/content/053.html
From a user experience point of view, if you just want to open a popup to confirm the data, without server side processing, I find opening a popup disturbing and would rather use an overlay on the same page.
Is it possible to check if same window is already opened?
For example i have opened a window via javascript.
Can i check if that's opened on another page via javascript?
Just want to focus on page if it's been opened already to avoid duplicate windows.
Thanks ;)
Look at window.open() method. You must specify the name of the window as the second parameter. If there already is a window with that name, then the new URL will be opened in the already existing window, see http://www.w3schools.com/jsref/met_win_open.asp
If you really want to check, if the window is opened by your own scripts, then you have to keep a reference to the opened window in a global variable or the likes and create it with
var myOpenedWindow = myOpenedWindow || window.open(URL, "MyNewWindow");
You can also encapsulate this behavior in a method:
var myOpenWindow = function(URL) {
var myOpenedWindow = myOpenedWindow || window.open(URL, "MyNewWindow");
myOpenedWindow.location.href= URL;
myOpenedWindow.focus();
}
And call that function with myOpenWindow('http://www.example.com/');
If you have parent--child window then here is a solution that will allow you to check to see if a child window is open from the parent that launched it. This will bring a
focus to the child window without reloading its data:
<script type="text/javascript">
var popWin;
function popPage(url)
{
if (popWin &! popWin.closed && popWin.focus){
popWin.focus();
} else {
popWin = window.open(url,'','width=800,height=600');
}
}
</script>
<a href="http://www.xzy.com"
onclick="popPage(this.href);return false;">link</a>
one more thing ::--- If the user refreshes the parent window, it may loses all its
references to any child windows it may have had open.
Hope this helps and let me know the output.
This will help if you want to open a url from a link
var Win=null;
function newTab(url){
//var Win; // this will hold our opened window
// first check to see if the window already exists
if (Win != null) {
// the window has already been created, but did the user close it?
// if so, then reopen it. Otherwise make it the active window.
if (!Win.closed) {
Win.close();
// return winObj;
}
// otherwise fall through to the code below to re-open the window
}
// if we get here, then the window hasn't been created yet, or it
// was closed by the user.
Win = window.open(url);
return Win;
}
newTab('index.html');