Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations John Tel on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

add a link on an alert message 1

Status
Not open for further replies.
WhiteKnight7372001

WhiteKnight7372001

MIS
Oct 23, 2001
8
CA
Here is the theoretical question...

Our contest program is down. Write a JavaScript alert with a message to the public to go on this contest link:

<a href=&quot;/ottawa/ottawacitizen/contests/circcontest/&quot; class=&quot;newsheadlinecolour&quot;>
<img src=&quot;/barterads/CitizenFallSportsSpree_120x60.gif&quot; width=&quot;120&quot; height=&quot;90&quot; alt=&quot;Sports Spree prize package&quot;
class=&quot;AssocImage&quot; border=&quot;0&quot; vspace=4></a>

- is it possible to change the &quot;ok&quot; button to a graphic link?

need to know urgently!!! Please help!!
 
Sort by date Sort by votes
No, can't do that (with the image that is). But you can have the OK button link to a website like this.
Code: 
if (window.confirm(&quot;Would you like to go to Yahoo !!&quot;)) {
  window.location.href = &quot;[URL unfurl="true"]http://www.yahoo.com&quot;[/URL]
}

Read this thread thread216-152215 that I just wrote for someone else. It discusses creating custom alert, confirmation boxes in small sub windows compatible for IE and NS. Using this convention, you could definitely replace one of the buttons with an image, but it's going to take some tweeking. I'd be happy to help if you think this is the way you want to go. :)

ToddWW
 
Upvote 0 Downvote
That's an amazing code. Yes I agree - it's very crazy :)
If you have time to assist in developing a custom button that would be appreciate. We would have to use the graphic
link...

<a href=&quot;/ottawa/ottawacitizen/contests/circcontest/&quot; class=&quot;newsheadlinecolour&quot;>
<img src=&quot;/barterads/CitizenFallSportsSpree_120x60.gif&quot; width=&quot;120&quot; height=&quot;90&quot; alt=&quot;Sports Spree prize package&quot;
class=&quot;AssocImage&quot; border=&quot;0&quot; vspace=4></a>

I need by the end of tomorrow. If you don't have time I totally understand. I appreciate the help you've already given me.
 
Upvote 0 Downvote
No problem. I'll put something together you can work with in the morning. (MDT U.S.)

How many buttons ?
How many of them are images ?
What are the sizes of the images ?
What do you want the buttons to do ?

Glad to help s-)
ToddWW
 
Upvote 0 Downvote
Hi Todd,

to answer your questions:

1. I need 1 button to be an image

2. the size and name of the image is:

<img src=&quot;/barterads/CitizenFallSportsSpree_120x60.gif&quot; width=&quot;120&quot; height=&quot;90&quot; alt=&quot;Sports Spree prize package&quot;
class=&quot;AssocImage&quot; border=&quot;0&quot; vspace=4>

so...

width = 120
height = 90
name and location of image: &quot;/barterads/CitizenFallSportsSpree_120x60.gif&quot;
class(?)=&quot;AssocImage&quot;

3. the image button should allow user to go to the following page

<a href=&quot;/ottawa/ottawacitizen/contests/circcontest/&quot; class=&quot;newsheadlinecolour&quot;>

Thanks so much Todd! I'll be check this site frequently today.

 
Upvote 0 Downvote
Real quick. I just need to confirm something. The image name says 120x60 but you're telling me the height is 120 x 90.

Thanks.. Almost done !!

ToddWW :)
 
Upvote 0 Downvote
OK my friend. Sorry it took a little longer than expected.

Copy this and run it. The submit function fires the function that pops up the window. Read over the JavaScript carefully and you should be able to see where you can make changes to your liking..

Code: 
<html>
<head>
<script Language=&quot;JavaScript&quot;>
<!--

// THIS SETS THE ALERT WINDOW
// AS A GLOBAL VARIABLE
var myAlert

// THIS DEFINES THE WINDOW PARAMETERS
// IN THE ALERT BOX
var alert_text = &quot;Would you like to navigate to this page ?&quot;
var alert_title = &quot;Confirmation&quot;
var winheight = '215'
var winwidth = '250'


// THIS CREATES THE DYNAMIC ALERT BOX

function checkForm(form_ref) {
  myAlert = window.open('','alert','width='+winwidth+',height='+winheight+',top=100,left=100')
  var wC = '<html><head><title>'+alert_title+'</title></head>'
  wC += '<body bgcolor=&quot;#C0C0C0&quot; onBlur=&quot;self.focus();&quot;>'
  wC += '<table border=&quot;0&quot; width=&quot;100%&quot; cellpadding=&quot;0&quot; cellspacing=&quot;0&quot;>'
  wC += '<tr><td width=&quot;100%&quot; align=&quot;center&quot;><font face=&quot;Arial&quot; size=&quot;2&quot;><strong>'
  wC += alert_text
  wC += '</font></strong></td></tr>'
  wC += '<tr><td width=&quot;100%&quot; height=&quot;10&quot;></td></tr>'

  wC += '<tr><td width=&quot;100%&quot; align=&quot;center&quot;>'
  wC += '<a href=&quot;javascript:self.opener.procButton(1);&quot;>'
  wC += '<img src=&quot;/barterads/CitizenFallSportsSpree_120x60.gif&quot; width=&quot;120&quot; height=&quot;90&quot; alt=&quot;Sports Spree prize package&quot; class=&quot;AssocImage&quot; border=&quot;0&quot; vspace=4>'
  wC += '</a>'
  wC += '</td></tr>'

  wC += '<tr><td width=&quot;100%&quot; height=&quot;10&quot;></td></tr>'

  wC += '<tr><td width=&quot;100%&quot; align=&quot;center&quot;>'
  wC += '<input type=&quot;button&quot; value=&quot;Cancel&quot; onClick=&quot;self.opener.procButton(2);&quot;>'
  wC += '</td></tr>'


  wC += '</body></html>'
  myAlert.document.open()
  myAlert.document.write(wC)
  myAlert.document.close()
}

//PROCESSES THE RETURN VALUES FROM
//THE POPUP WINDOW

function procButton(b_val) {
  myAlert.close()
  if (b_val == 1) {
    window.location.href = &quot;/ottawa/ottawacitizen/contests/circcontest/&quot;
  }
  if (b_val == 2) {
    // DO NOTHING THIS IS THE
    // CANCEL BUTTON
  }
}
//-->
</script>
</head>
<body>
<form>
<br><input type=&quot;button&quot; value=&quot;Submit&quot; onClick=&quot;checkForm();&quot;>
</form>
</body>
</html>

Hope this helps. :)

ToddWW
 
Upvote 0 Downvote
Yeah! It totally worked Todd! I will honestly admit that this javascripting is beyond me at this point. I'm going to ask a few questions that may seem ignorant...

1. i need the alert message to appear automatically - without the submit button - is this possible? (maybe somehow using the Window.Open function...)

3. what does &quot; wC += &quot; signify?

4. what does this line mean?
&quot; ('','alert','width='+winwidth+',height='+winheight+',top=100,left=100') &quot;


thanks in advance!
 
Upvote 0 Downvote
Answers:

1. i need the alert message to appear automatically - without the submit button - is this possible? (maybe somehow using the Window.Open function...)
I just used the submit button as a means to fire that function for the test example. You can have that window come up whenever you want. When do you want the window to appear ??


3. what does &quot; wC += &quot; signify?
wC is simplay a string variable. By using the += method, I am adding the string to what is already stored in that variable. Basically, we're building a very long string that will eventually be written to the window. The string represents all of the HTML code required to render the results in the alert window. It is written to the alert window using the myAlert.document.write(wC) method.


4. what does this line mean?
&quot; ('','alert','width='+winwidth+',height='+winheight+',top=100,left=100') &quot;
That's the method that opens the small window on top of the current page. At that moment in time, the window is blank. But the following JavaScript writes HTML to that window. It's done so fast, you don't even notice that it is a blank page at the second it's created.

Hope this helps..

ToddWW

 
Upvote 0 Downvote
Helps alot!!

1. I need the alert message to appear immediate after the page is uploaded. Can that be done?

2. The code you gave me - is this as simple as it can be - or can we eliminate some and still have it run properly?




You're one hell of a programmer by the way...
 
Upvote 0 Downvote
That's as simple as you can get it if you want the window to behave like an alert box. You can remove my comments, but I would encourage you to leave them. To get the window to popup after the page is loaded just do this.

#1: Change this existing JavaScript line.
Code: 
function checkForm(form_ref) {
To this..
Code: 
function popWin() {
Essentially removing the parameter reference to a form and changing the function name since we're not validating a form.

#2: Inside the opening <body> tag of your HTML document, write this.

Code: 
onLoad=&quot;popWin();&quot;

That will fire that function and pop up that window immediately after the page loads into the browser.

ToddWW :)
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

Mike Lewis
  • Locked
  • Question
Anyone here got any experience of Grid.JS (a sortable Javascript grid) 1
Replies
5
Views
2K
Mike Lewis
Mike Lewis
Kennelbloke
  • Locked
  • Question
Can't Get Markers to show on Map
Replies
0
Views
997
Kennelbloke
Kennelbloke
TheLazyPig
  • Locked
  • Question
Buttons not aligned after another button is clicked
Replies
2
Views
382
gmmastros
gmmastros
rogerte
  • Locked
  • Question
Code that works on Windows, Android and Iphone
Replies
0
Views
714
rogerte
rogerte
Rayj0000
  • Locked
  • Question
How to disable an html button for subsequent website visitors?
Replies
0
Views
665
Rayj0000
Rayj0000

Part and Inventory Search

Sponsor

Back
Top