Solved

window.location for Safari and Firefox

Posted on 2007-11-16
22
1,520 Views
Last Modified: 2010-06-21
Hi there,

I have the following javascript being run after a button click:
<script type="text/javascript">
function confirmInvoice(InHouseId){
      var mess = "Are you sure you would like to submit the course confirmation?";
      var retVal = confirm(mess);
      if (retVal == true){
            window.location = "adInHouseCourseDepositInvoice.aspx?InHouseId=" + InHouseId + "&Submit=1";
      }
}
</script>

When the window.location runs, the page sends out an email. What we are having problems with is that when we user Safari or Firefox, the page is visited twice and the email gets sent twice because of that.

Does anyone have an idea on how to fix this problem?

It works fine on IE, but not on Safari or Firefox.
0
Comment
Question by:quanmac
  • 9
  • 7
  • 5
  • +1
22 Comments
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 20300027
quanmac,

What is the code in the element that is clicked?  The issue might just be there.  The basic setup of the "button" should be ...

<input type="button" onclick="confirmInvoice('whatever'); return false;" />

Let me know what your tag or element looks like.  Adding the "return false" and cleaning any errors may be the solution.

Let me know if you have any questions or need more information.

b0lsc0tt
0
 
LVL 3

Author Comment

by:quanmac
ID: 20300064
Here's the link tag:

<a href="javascript:confirmInvoice(<%= Request.QueryString["InHouseId"].ToString() %>)"><u>Submit Course Confirmation</u></a>
0
 
LVL 3

Author Comment

by:quanmac
ID: 20300118
I tried adding the:

return false;

and that didn't work
0
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 20300372
Use ...

<a href="#" onclick="confirmInvoice(<%= Request.QueryString["InHouseId"].ToString() %>); return false;"><u>Submit Course Confirmation</u></a>

By the way, what does the html result look like for that tag?  It seems like you might need to put use single quotes for the value the ASP tags are "inserting."  Use View Source in the browser to see what the html looks like.  Show me that code if you aren't sure.

bol
0
 
LVL 3

Author Comment

by:quanmac
ID: 20300393
I got an error message when I added in the return false; it was saying the there was a return statement outside the function


<script type="text/javascript">

			function confirmInvoice(InHouseId){

				var mess = "Are you sure you would like to submit the course confirmation?";

				var retVal = confirm(mess);

				if (retVal == true){

					window.location = "adInHouseCourseDepositInvoice.aspx?InHouseId=" + InHouseId + "&Submit=1";

				}

			}

		</script>
 

....
 

<a href="confirmInvoice(100170); return false;"><u>Submit Course Confirmation</u></a>

Open in new window

0
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 20300579
That is because you are still doing it in the href property/attribute.  You need to do as I showed above.  Replace the script in the href with # and put the script in an event.  You shouldn't use the href property to run script.

Let me know how that works.  Hopefully that is the last issue and will get this working. :)

bol
0
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 20300584
By the way, thanks for showing me the source. ;)

bol
0
 
LVL 3

Author Comment

by:quanmac
ID: 20301170
Thanks bol,

I made the changes you suggested and the error is gone but I still get the same result as it is sending me 2 copies of the email instead of 1 in firefox, but I get 1 copy if I run the page in IE.
0
 
LVL 3

Author Comment

by:quanmac
ID: 20301180
Could it be something to do with window.location?

I've tried window.location.href but when I do that, I get sent 2 copies from IE where window.location only sends me 1 copy in IE.
0
 
LVL 3

Author Comment

by:quanmac
ID: 20301526
I've tried changing the window.location to window.location.href and I still get the same problem.

Also, I've tried window.location.replace and that gave me the same problem as well.
0
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 20302475
What does the rest of the page do?  What happens if you use that URL in the Firefox browser?  In other words something like ...

http://[www.domain.com/folder]/adInHouseCourseDepositInvoice.aspx?InHouseId=[InHouseId]&Submit=1

Notice the parts in brackets [] are where you enter the info the script would send or your full URL.  Do this in Firefox and I am curious to see if you get 1 or 2 emails.

I think there is something else happening on the page.  Does the page have a form or anything else?

What if you open a popup and use the URL there?  Let me know if you need info on doing this.  It is just to try to id the problem. ;)

Let me know how this works or if you have a question.

bol
0
What Is Threat Intelligence?

Threat intelligence is often discussed, but rarely understood. Starting with a precise definition, along with clear business goals, is essential.

 
LVL 2

Accepted Solution

by:
DavidBlackledge earned 500 total points
ID: 20306517
The problem is that you are using a javascript: url, but not returning a void result.

If the result of a javascript: url is a string, that string is interpreted as either a URL to use for the completion of the Link, or as the new content in some cases (probably all cases where it isn't obviously a URL).

The last thing your function does is set the location... the "result" of setting that location is the URL you set it with, therefore the "result" of the function is also that URL since that is the last thing that was executed.

In all three browsers, the javascript continues running after the location is set, continuing at the javascript: link which causes the link to execute with that returned URL, thus two webserver requests occur:  One when you set location, and one with the Link executes with a plain URL.
Apparently in IE, setting window.location returns a different object that doesn't get interpreted as a URL, while setting window.location.href returns a plain URL.

Two ways to solve this:
return a void value from your function (make the last line of the function "void(0);"),
or start a better habit by voiding the javascript you're running in the javascript: URL.
either
href="javascript:void(confirmInvoice(...))"
OR
href="javascript:confirmInvoice(...);void(0)"

...in general, we should all be in the habit of making ";void(0)" the last part of EVERY javascript: url.
0
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 20306546
Don't put javascript in the href attribute.  We just got that fixed.  You don't need to even use void.  You can review the example in the comment at http:#20300372 for an idea of how to use script in an anchor tag (or others).  It is the event that can run the script, not an element property.

bol
0
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 20306554
By the way, if needed the return false (see example) will stop the "default" behavior after the script runs.  In the case of an anchor it stop the href part from being "run" by the click.

bol
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 20314320
As b0lsc0tt pointed out, the canonical way of doing this is onClick="something(); return false"

Although the
href="javascript:void(something())"
will work, it
1. will give a 404 in browers that have turned javascript off
2. is abusing the javascript protocol for something it was not designed to do

Here is what you SHOULD have done
<script type="text/javascript">
function confirmInvoice(InHouseId){
  var mess = "Are you sure you would like to submit the course confirmation?";
  var retVal = confirm(mess);
  if (retVal == true){
    window.location = "adInHouseCourseDepositInvoice.aspx?InHouseId=" + InHouseId + "&Submit=1";
  }
}
</script>
 
<a href="#"
onClick="confirmInvoice(100170); return false;"><u>Submit Course Confirmation</u></a>

If that did not work (I doubt that very much) then I am sure the problem is on the server or you have other scripts that interfere with the call.

What I would do, by the way - was to allow all users to sign up - if javascript is turned off, they do not get the question, but they DO get the email:

<script>
var mess = "Are you sure you would like to submit the course confirmation?";
</script>
 
<a href="adInHouseCourseDepositInvoice.aspx?InHouseId=100170&Submit=1"
onClick="return confirm(mess)"><u>Submit Course Confirmation</u></a>


MUCH simpler and less error prone
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 20314329
PS: If you would review the solution by b0lsc0tt and see that it works, I believe at least a split is in order. Especially since we should all make it a habit never to use javascript protocol for such issues.
0
 
LVL 3

Author Comment

by:quanmac
ID: 20314372
I have tried using return false and that did not work
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 20314540
I would very much like to be ABSOLUTELY sure about that since I preach to use it always.

Would you please assist me in verifying that you have tried

<a href="#"
onClick="confirmInvoice(100170); return false;"><u>Submit Course Confirmation</u></a>

and not

<a href="confirmInvoice(100170); return false;"><u>Submit Course Confirmation</u></a>
as you posted which will never work.

Or try my suggestion

<script>
var mess = "Are you sure you would like to submit the course confirmation?";
</script>
 
<a href="adInHouseCourseDepositInvoice.aspx?InHouseId=100170&Submit=1"
onClick="return confirm(mess)"><u>Submit Course Confirmation</u></a>

which should work exactly the same as



<script type="text/javascript">
function confirmInvoice(InHouseId){
  var mess = "Are you sure you would like to submit the course confirmation?";
  var retVal = confirm(mess);
  if (retVal == true){
    window.location = "adInHouseCourseDepositInvoice.aspx?InHouseId=" + InHouseId + "&Submit=1";
  }
}
</script>

<a href="#" onClick="confirmInvoice(100170); return false;"><u>Submit Course Confirmation</u></a>

but only if you make sure it is as written.

If you had any other errors on the page, it could really influence any other script on the page.
0
 
LVL 3

Author Comment

by:quanmac
ID: 20315118
I have tried this:

<script type="text/javascript">
function confirmInvoice(InHouseId){
  var mess = "Are you sure you would like to submit the course confirmation?";
  var retVal = confirm(mess);
  if (retVal == true){
    window.location = "adInHouseCourseDepositInvoice.aspx?InHouseId=" + InHouseId + "&Submit=1";
  }
}
</script>

<a href="#" onClick="confirmInvoice(100170); return false;"><u>Submit Course Confirmation</u></a>

And that didn't work.
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 20318164
That is hugely problematic - I cannot even begin to imagine how this should not work

Is this on a Mac and how does it not work?

For example if you change it to


<script type="text/javascript">
function confirmInvoice(InHouseId){
  var mess = "Are you sure you would like to submit the course confirmation?";
  var retVal = confirm(mess);
  if (retVal == true){
    window.location = "http://www.google.com/";
  }
}
</script>

<a href="#" onClick="confirmInvoice(100170); return false;"><u>Submit Course Confirmation</u></a>


Does that not do what it is supposed to do - ask and go to google if ok, stay if not?

Thanks for your cooperation
0
 
LVL 3

Author Comment

by:quanmac
ID: 20320702
When I was testing out things, I had a user on a Mac using Safari and Firefox and I also tested things on Firefox on my XP machine.

The only time it worked was when I used void(0);
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 20320994
I will make a test page for you...

Michel
0

Featured Post

Top 6 Sources for Identifying Threat Actor TTPs

Understanding your enemy is essential. These six sources will help you identify the most popular threat actor tactics, techniques, and procedures (TTPs).

Join & Write a Comment

When you need to keep track of a simple list of numbers or strings, the Array object is your most direct tool.  As we saw in my earlier EE Article (http://www.experts-exchange.com/A_3488.html), typical array handling might look like this: (CODE) B…
This article will give core knowledge of JavaScript and will head in to your first JavaScript program. I am Durvesh Naik and I am here to deal with this series of JavaScript. I will teach you JavaScript in part wise , as its quite boring to read big…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

758 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

21 Experts available now in Live!

Get 1:1 Help Now