Use current web directory when navigating to page or url - javascript

I'm updating a very old web app (webforms) that only works properly in IE 6-9. It was not originally written by me. Also, I'm not an expert at web development, so the solution to this might be very simple.
One issue is extensive use of window.showModalDialog, which is an IE specific call that opens a new browser window that disables the browser window that opened it, like a popup message. This has been replaced with a jquery modal dialog, however there's sometimes an issue with the 'url' that gets passed to it.
Here's a simplified reproduction of the issue. There's a javascript function that takes a url and an id.
function openEdit(url, id) { ...
This function existed in the original version, except it had code to open a modal popup window. I replaced it with the necessary jquery. However, the url value that gets passed in sometimes doesn't have enough information. Also, assume I have no control over the value that gets passed here.
Let's say the main page is at localhost/TestSite/Main.aspx. There are a number of frames within this page which display other pages, like localhost/TestSite/Products/ProductList.aspx - clicking an item on this page might open a window to localhost/TestSite/Products/ProductDetails.aspx. There are hundreds of pages that follow this general format.
Sometimes the url has a value of '/TestSite/Products/ProductDetails.aspx'. The jquery dialog correctly navigates to localhost/TestSite/Products/ProductDetails.aspx
However, other pages just pass in the name of the page, 'ProductDetails.aspx', which jquery tries to find at localhost/TestSite/ProductDetails.aspx. This works on IE using window.showModalDialog and the browser is able to get the expected directory of 'Product' because it's the same directory the open window call was made from. Jquery doesn't seem make this leap.
Now, I have a possible solution using window.location to get the current url, parse it a bit, and generate a valid url. I'm worried about what fringe cases this may create, though, and it also seemed like the improper way to do it.
Is there a way to have jquery open a dialog using the corrent directory, or is there a way to generate a current directory to use that doesn't involve window.location? Or is that my best choice.

Related

How to run popup.html without using default_popup? (CHROME EXTENSION)

So, I've got a situation where I want a background and content script to be run everytime the browser extension icon is clicked. The ideal behaviour is that extension icon is clicked, the script runs, and the popup will open, displaying the data that was grabbed by the script (but this should happen quickly, the script runs and gets the data very fast). Since chrome.pageAction.onClicked will not work if there is a default_popup defined in manifest.json, I think this leaves me with two options:
Use default_popup and figure out that the extension icon has been clicked some other way. I found this solution in another stack overflow post, but the workaround is to use default_popup: "popup.html", and then the popup.js that is defined in popup.html will send a message saying that the icon has been clicked, then when background.js receives this message, it executes the script. I implemented this idea and it worked... kinda. The trouble is, the popup will always come up before the script is fully executed, so you can't actually display the data grabbed by the script in the popup until the next click. I'm not sure there's any way to get the behaviour I desire using this method, so on to the next:
The other solution I can possible think of is to use onClicked, and then make the popup come up some other way, besides using default_popup in manifest.json. I'm also not sure if this is possible, I have looked on stackoverflow and haven't found anything similar.
Is the second method possible? Can the first method work somehow?
Your option #1 is correct, I think all that is needed is a loading screen when the user first sees the popup, and add some code that updates the popup as soon as it hears from the backend. Might need to see some code to better help there.
Option #2 will not really work, unless you opened the popup in a new tab (or just made it a whole new HTML page). I say this because there is a note here from the Chrome Dev team they will not support opening a popup unless it is from a user gesture -- https://stackoverflow.com/a/10484764/4875295.
If you wanted to go that route it would probably look something like:
Delete from your manifest.json browser_action.default_popup
In your background script add something like:
chrome.browserAction.onClicked.addListener(() => {
const data = dataMaker();
chrome.tabs.create({
url: `${chrome.runtime.getURL("app.html")}?data=${data}`
});
});
Then in your html file have some JS that reads the query string and updates the page accordingly.
Though, that's a different approach than you asked for and I think your original route may still be the best bet (with some added JS around loading).

How to open a url in an already existing browser tab?

I'd like to do the following in my application via javascript.
1) Press a button from a web page that opens a popup.
2) Select some options in the popup and accept them.
3) Change the content of what is in the first web page according to what has been selected in the popup and change it. A GET Request is acceptable, and if possible popup with the selected options should again be on top, either by putting it on top or by opening a new one with the same options chosen.
I think javascript must have some way of saving the name of the browser tabs your are opening and later, if you want, open a new URL, or put one over other but I cannot find them. The window.open options doesn't look like they can do this.
Any idea on how to achieve this thing? Thanks for your time.
You can try the window.opener method in the popup to access the main page. High level details here: http://www.w3schools.com/jsref/prop_win_opener.asp, but if you Google it there's examples.
We did this for a project and it works, with a few caveats:
Cross domain basically doesn't work, if you have multiple domains you have to get more creative.
Be careful cross browser as well, we had to add some custom javascript to handle
Basically, what you need to do on your main page is define a global javascript method that does what you want it to (it can take parameters). Then, on your popup, you can call it with window.opener.MethodNameHere();
Theoretically, if you do need to handle cross browser, you can try using postmessage, which I believe is only supported in html5 natively (there are plugins for html4), but it would probably be tricky getting it right in this circumstance and I'm not sure how to do it off the top of my head.

Opening a new window using Javascript after a timeout caught by popup blocker

I'm having a situation in which I want to allow the user to download a PDF. The generation of this PDF can take a couple of seconds, and I don't want a webserver thread to wait for the generation of the PDF, since that means the thread isn't available to handle other incoming requests.
So, what I would like to do is introduce the following URL patterns:
/request_download which invokes a background job to generate the PDF;
/document.pdf which will serve the PDF once it is generated
The use case is as follows.
A user clicks on 'Download PDF'. This invokes a piece of Javascript that'll show a spinner, make a request to /request_download and receive a HTTP 202 Accepted, indicating the request was accepted and a background job was created. The JS should then poll the /request_download url periodically until it gets HTTP 201 Created, indicating that the PDF has been created. A Location header is included that is used by the JS to forward the client to /document.pdf. This has to be in a new window (or tab, at least it shouldn't replace the current page). The level of expertise of our users is very low, so when I forward to the url, they might not know how to get back to the website.
The problem
Now, window.open works fine if it is invoked by the user via a click event. However, I want to invoke window.open in a callback function through setInterval as soon as I see that 201 Created response. However, browsers won't like that and will interpret it as a popup, causing it to get caught by popup blockers on IE8-10 as well as Chrome. Which makes sense.
I also can't open a new window and invoke the Javascript over there. In that case, users would see a blank page with a spinner. If that page then forwards to the /document.pdf, IE will show this yellow warning bar telling that it prevented files from being downloaded. Chrome and Firefox will do this without any problems, but a large percentage of our users is on IE.
What I've tried, and didn't work
window.open(location)
Setting the src of an iframe to the retrieve location
Manually adding an <a> tag to the document body and trying to click it using javascript
Adding an <a> tag to the document body and invoking a MouseEvent on it
Partially works: opening a new window on user click and storing a reference to it, then perform the asynchronous requests and upon completion, set the location of the earlier opened window. But: IE will block this and say it prevented files from being downloaded. So still not a fully working solution.
I'm straight out of ideas on how I can make this work and decided and decided to ask The Internet for help. I'm hoping you guys can help me with this, or recognise the problem. Thanks in advance!

window.open() does not open when clicked more than once

In my JSP application, I have a javascript function that opens a new window. The reportURL is a call to an asp application that produces a pdf file. So, if you call that asp page, it will produce pdf data.
The javascript that I have is:
function openReport(id)
{
window.open('<%=reportUrl%>&id='+id,
'_blank',
'width=900 height=900 scrollbars=yes status=yes'
);
}
Now my application runs fine, when the report link is clicked, it opens a new window and I can view my pdf. However, when I close the pdf report window and click the link again to generate report, it opens a new window (without the pdf). This new window does not look like a blank window as the background is not white, rather it looks like the pdf plugin for the browser recognizes it is pdf as I can see grey background but I cannot view the document.
Can anyone please let me know where is the problem?
My guess is its a caching issue of some kind. Whether its caching the window itself, or the results of the URL I can't tell without investigating it. Two things I would try, naming the window with a random name that changes every time you click it so instead of '_blank' use (new Date()).toString() (or similar I haven't tested it). The second thing to try is to ensure that the URL is unique every time to avoid caching there, so choose a querystring variable thats not used by the reporting system and change that every time its clicked e.g. + 'version='+(new Date()).toString().
This jquery popup window code works if you click it twice, so be helpful in determining what works and what doesn't http://swip.codylindley.com/popupWindowDemo.html
In fact you can conduct your own test, change the URL in your popup to a regular website and see how it works, if it works normally you know its the content not the window.
Hopefully that gives a starting point - unfortunately its hard to give a exact answer without being able to reproduce the problem.

Append to URI/URL live without refreshing the page location with JavaScript/jQuery

What I have is a MVC framework that I am manipulating the DOM via JavaScript and jQuery. Which to a point is a mute reference to this question. Through the MVC if I go to
domain.com/page/
I land on a default page with recent info, updates, etc. However through the MVC if I go to something like
domain.com/page/ref1/ref2/ref3
We can handle that on the backend to do what we want. When its gone to directly. So the thought here for this question is, can I mimic the behavior cross browser up to at least up to IE 6/7+, Firefox 3.x+, Chrome. And by mimic I mean manipulate the URL/URI like I would the DOM itself. This way when someone comes along and navigates to sections via the methods we manipulate the DOM and find something they want to share all they have to do is go up to the browsers URL bar, and then copy and paste it to a message.
What would be even nicer is a method that can work with the back and forth history buttons on browsers as well. All without having to reload/refresh the page.
have you tried
window.location.replace(URL)
This function doesn't load any pages.If you change your current location like this , when you redirect to somewhere , your last address will be the non-modified address.It doesnt write new URL to the browser history.So it would be like as if you just give the key to what the user wants to share.
Have you considered modifying the anchors in the URL? While on this page:
http://www.google.com/
Changing the URL to this:
http://www.google.com/#foo
... won't trigger a page refresh. So you could use (read/modify) the contents of the URL after the anchor all you want and the page won't get reloaded. Should be able to build on that idea.

Categories

Resources