Single mouse click to open new tab + modal window at same time - javascript

See for example:
http://www.retailmenot.com/view/macys.com
When you click on one of the buttons, it both automatically opens a new tab, and pop out their modal window.
What are the possible ways to do this?
They seem to do both actions with Javascript. They actually do something that keeps the window in the current tab and not on the one that was opened. How is it done?
In general, Can I achieve these two actions (nevermind if focus is on new window) with a regular form submission with target=_blank the new tab, and some class to pop the modal window? What should the javascript look like?
Is there any way to do this without javascript at all?
Basically I'm looking for practices that are supported from IE8+, and cross browser compliant.

See this : http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_win_open
You can open your js modal also inside myFunction() function.

Related

window.open() in new tab are not subject to pop-up blockers

I want to open new tab window on some condition for example:
var temp=true
if(temp)
window.open('test.aspx');
My problem is window.open() in new tab should not subject to pop-up blockers.
I have tried window.open('viewReport.aspx', '_newtab' ); and window.open('viewReport.aspx', '_blank' );, but its always subject to pop-up blocker.
Please provide any solution.
Thanks.
Window.open will force opening a new tab with a given URL. This is called a Pop-Up.
You cannot control it.
Instead use javascript to simulate a windows by using ex. https://jqueryui.com/dialog/ or http://fancybox.net. Both works with ajax request so you can pull the html content from another page.
My problem is window.open() in new tab should not subject to pop-up blockers.
You might think that but the people writing web browsers do not.
You cannot open a new tab or window from JavaScript except in response to a user event.
The solution is to find some other way to present your information (such as providing the user with a link to it or placing it in the same page).
Create a jquery popup div in ‘on click trigger’ event, that pop up displays with opacity background and it will remains center the popup if you scrolling zoom out the browser and closing it fadeout, and also you can customize the content of the popup div for your cool website designs.
Working example: http://istockphp.com/jquery/creating-popup-div-with-jquery/#sthash.5HcIfl8n.dpuf

How can I open a pop-up window without it being blocked?

I haven't found a single answer able to tell me what's the right way to open a popup.
Times have changed, and popups have been mostly replaced with fancybox-like boxes. However, there are still times when popups are needed.
For those cases, I don't want my popup to be blocked by the browsers.
What's the right way to open a popup without it being blocked? Even if it opens a new tab in the browser. I just want my popup to be open, and have control of it from the parent or vice versa.
Popup blockers will block any popup, unless it is opened because of an user action.
If the user clicks on a link, and a popup is opened in the click listener of that link, the popup blocker knows the user want to open something and will not (or should not) block the popup.
What you cannot do:
open a popup when the page is opened or closed
open a popup after a certain interval
open a popup after something asynchronous happens
What you can do:
open a popup in the on click listener
using target="_blank" in a anchor tag
You can access both windows with JavaScript variables:
if you use window.open, the parent can have a reference to the popup by assigning the result of window.open to a variable. Check out this article at W3Schools.
If the popup needs to have access to the window who has opened it, you can use window.opener. Check out this question.
try this, it works for me
$('#myButton').click(function () {
var redirectWindow = window.open('http://google.com', '_blank');
redirectWindow.location;
});
Js fiddle for this is here https://jsfiddle.net/safeeronline/70kdacL4/2/
if you want to open new tab after ajax call see this fiddle http://jsfiddle.net/safeeronline/70kdacL4/1/

How to disable maximize,mimimize and close button for a new window open

I am using window.open() method to open a page as a pop-up window for a link button click event.
But the poup-up window is having minimize,maximize,close(x) button.
I dont want those buttons. How can remove these buttons?
This is the method i am using,
window.open(url,"Link","toolbar=0,location=0,directories=0,status=0,menubar=0,titlebar=no,scrollbars=1,resizable=0,width=450,height=310,left=500,top=350");
Tell me how can do this.
Regards,
Chirag Jain.
You can't.
If you want a popup style window without full window decorations you'd have to create a new overlay <div> on top of the existing content and fill that with content, perhaps using an <iframe>.
You can't do it from javascript alone. Think about it, if you could, then people could put it into code on web-pages and cause other people's computers to open windows they couldn't easily close.
Instead you'll have to look for an answer specific to whichever browser you're using to host this application, and change it on the computers of your users appropriately. Even then though I don't think you'll be in luck (with Firefox for example, I can see how to get rid of them on all browser windows, but not on just one).

Customizing the window popup skin?

Is there a way to customize the window layouts of popup that opens as a result of window.open event?
You could use jQuery UI to create a modal dialog box if you don't need an actual browser window.
If you mean you want to style the browser window this is not possible (not reliably across browsers as far as I know at least). You could open up your own-made popups inside the already opened website using javascript (then the popups would not be real popups but elements in the html DOM). Check out www.zkoss.org for an example using ajax for this if you are using java as a backend technology.
Demo:
Modal window demo

Google Toolbar prevents open a new window

Google toolbar is creating a serious problem for me in IE 6 when i try to open a window using window.open or if i set target="_blank" for anchor tag. It treats the window as pop up and dispaly pop up is blocked which i really don't want to dsiplay to my user. This problem only occurs if there is a extra code getting executed before window.open, e.g. calling another method at onclick then using window.open. Can somebody tell me how to solve this issue?
The toolbar and other devices like that are intended to protect users from unwanted popup windows. The only way for them to determine whether a window is "wanted" is to determine whether window.open is being called in an event handler for a user-initiated event, like a button click. Thus if you try to do something like call window.open on document load, or in an AJAX success handler, the toolbar (and other blockers) will assume that the popup is suspect.
There's nothing you can do about this other than, as noted by Mr. Buchan, tell your users what to expect. Wherever possible, have your popups launched directly from click handlers.
A more radical change would be to shift away from window.open and use simulated popup windows made from floating elements that cover up part of the page. Something, that is, like what jQuery UI dialogs give you.
Adding the site to your Trusted Sites will work.
Setting target="_blank" shouldn't be triggering a pop-up blocker.

Categories