Improve company productivity with a Business Account.Sign Up

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1574
  • Last Modified:

window.location for Safari and Firefox

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
quanmac
Asked:
quanmac
  • 9
  • 7
  • 5
  • +1
1 Solution
 
b0lsc0ttIT ManagerCommented:
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
 
quanmacAuthor Commented:
Here's the link tag:

<a href="javascript:confirmInvoice(<%= Request.QueryString["InHouseId"].ToString() %>)"><u>Submit Course Confirmation</u></a>
0
 
quanmacAuthor Commented:
I tried adding the:

return false;

and that didn't work
0
Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

 
b0lsc0ttIT ManagerCommented:
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
 
quanmacAuthor Commented:
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
 
b0lsc0ttIT ManagerCommented:
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
 
b0lsc0ttIT ManagerCommented:
By the way, thanks for showing me the source. ;)

bol
0
 
quanmacAuthor Commented:
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
 
quanmacAuthor Commented:
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
 
quanmacAuthor Commented:
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
 
b0lsc0ttIT ManagerCommented:
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
 
DavidBlackledgeCommented:
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
 
b0lsc0ttIT ManagerCommented:
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
 
b0lsc0ttIT ManagerCommented:
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
 
Michel PlungjanIT ExpertCommented:
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
 
Michel PlungjanIT ExpertCommented:
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
 
quanmacAuthor Commented:
I have tried using return false and that did not work
0
 
Michel PlungjanIT ExpertCommented:
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
 
quanmacAuthor Commented:
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
 
Michel PlungjanIT ExpertCommented:
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
 
quanmacAuthor Commented:
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
 
Michel PlungjanIT ExpertCommented:
I will make a test page for you...

Michel
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Upgrade your Question Security!

Your question, your audience. Choose who sees your identity—and your question—with question security.

  • 9
  • 7
  • 5
  • +1
Tackle projects and never again get stuck behind a technical roadblock.
Join Now