JavaScript works in FF not in IE7

Question

kenny.tor 0 Newbie Poster

15 Years Ago

Dear all,
First time posting. I have a piece of javascript like the following. What it does is when you click on the text 'Click me', it will prompt you for password; if you enter 'test', it will show the url 'picasa' in a div. The code works in FF3 perfectly but it just won't show the url in IE7. Please shed me some light.

<html>
<head>
  <SCRIPT LANGUAGE="JavaScript">

 
var URL = "http://picasaweb.google.ca/";
var form = "<form name=\"gform\"" + "method=\"post\">" +
           "Password: <input type=\"password\" name=\"gpassword\" id=\"gp\"/>" +
          "<input type=\"submit\"   onclick=\"validate()\" value=\"submit\" />" +
          "</form>";

var pass = "test";

function setFocus()
{
document.getElementById("gp").focus();
}

function showURL()
{
  document.getElementById('GalleryDiv').innerHTML = "<a href=\"" + URL + ">" + "LINK" + "</a>";
}

function showForm()
{
  document.getElementById('targetDiv').innerHTML = form;
} 

function validate()
{
if(document.getElementById("gp").value==pass)
  {
   showForm();
   showURL();
  }
   
} //end validate()
  </SCRIPT>
</head>

<body onload="setFocus()">


<h1 onclick="showForm();setFocus();">Click me</h1>

<div id="targetDiv">
</div>

<div id="GalleryDiv">
</div>

</body>
</html>

javascript

2 Contributors
5 Replies
147 Views
1 Day Discussion Span
Latest Post 15 Years Ago Latest Post by essential

essential 84 Posting Shark

15 Years Ago

Same issue with Firefox vs IE thread. Have you checked it out?

essential 84 Posting Shark

15 Years Ago

Ok, here's your code. It's been configured according to your provided (x)HTML document and all unnecessary function's has also been removed. I still maintained some of your lines so you won't loose track when you perform editing in the script.

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<title>CROSS-PLATFORM</title>
<script type="text/javascript">
// <![CDATA[
var url, form, pass, loc;
var showURL, showForm, validate;

   url = "http://picasaweb.google.ca/";
pass = "test";

showURL = function() {
   loc = '\n<a href="' + url + '">LINK</a>\n';
   (( document.getElementById ) ? document.getElementById('GalleryDiv').innerHTML = loc : document.all["GalleryDiv"].innerHTML = loc );
};

validate = function() { 
  txt = (( document.getElementById ) ? document.getElementById("gp") : document.all["gp"] );
   if ( txt.value === pass ) { 
   showURL(); return false;
   } alert("Invalid Password!"); 
return false;
};

showForm = function() {
   form = '\n<form action="#" id="gform" method="post" onsubmit="return validate();">\n';
   form += 'Password : <input type="password" name="gp" id="gp" value="" size="20" />\n';
   form += '<input type="submit" value="submit" />';
   form += "</form>";
   (( document.getElementById ) ? document.getElementById('targetDiv').innerHTML = 
form : document.all.targetDiv.innerHTML = form );
    (( document.getElementById ) ? document.getElementById("gp").focus() : document.all["gp"].focus() );
};

// ]]>
</script>
</head>
<body>
<h1 onclick="showForm();">Click me!</h1>
<div id="targetDiv"></div>
<div id="GalleryDiv"></div>
</body>
</html>

Hope you find it useful...

Reply to this topic

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

kenny.tor 0 Newbie Poster · Answer 1 · 2009-05-25T10:00:12+00:00

I did. But I didn't quite get it.

Same issue with Firefox vs IE thread. Have you checked it out?

kenny.tor 0 Newbie Poster · Answer 2 · 2009-05-26T11:00:41+00:00

Thanks so much Essential. Frankly I did not fully understand why yours works beautifully while mine just won't get along with IE. Anyhow, I am still wondering what magic this line of code does (( document.getElementById ) ? document.getElementById("gp") : document.all["gp"] ); Afterall, I am still green on JavaScript.

essential 84 Posting Shark Featured Poster · Answer 3 · 2009-05-26T14:09:28+00:00

It's a shorthand statement of:

if ( condition ) { 
   return true;
} else { 
   return false;
}

shorthand statement syntax:

(( [b]condition[/b] ) ? condition is true : false condition );

NOTE This will only work on a single line statement -- if you have more lines', then simply do the whole thing with the if ( ) { } else { } block.

Hope it goes wel with you...

essential