Javascript code Show/Hide Div....Cookies don't work


Ok, This piece of code is my Saviour.

It does a Show/Hide Div with a simple Password login that is now a "input type".

Here is the issue:
Somewhere along the way, I lost the ability of the Cookie Function.

I want to be able to automatically make
<div id="admintable" style="visibility:hidden">   //located at the bottom
to be
<div id="admintable" style="visibility:visible">
if the Cookie is authenticated as true.
<script type="text/javascript" src='/cookies.js'></script>
<script>
function getStyle()
{
      var temp = document.getElementById("admintable").style.visibility;
 
      return temp;
}
 
function switchMain()
{
        var isAuthed = authenticate();
        if(isAuthed){
                var current = getStyle();
 
                if( current == "visible" ){
                        document.getElementById("admintable").style.visibility = "hidden";
                }else{
                        document.getElementById("admintable").style.visibility = "visible";
                }
        }

}
function authenticate() {
 
if (readCookie('authenticated')!=null) { 
return true; 
} 
else { 
document.getElementById("div1").style.display="block";
alert ("Please enter the password");
}
return false;
}

function checkPassword(which) {
if (which != "1234") {
alert ("Incorrect password - please try again");
document.getElementById("pwd").value = "";
return false;
}
else {  
alert ("Password is correct!");
createCookie('authenticated',true);
document.getElementById("admintable").style.visibility = "visible"
document.getElementById("div1").style.display="none";  // remove password div if desired
return true; 
} 

}

authenticate();

function readCookie(name) {
        var nameEQ = name + "=";
        var ca = document.cookie.split(';');
        for(var i=0;i < ca.length;i++) {
                var c = ca[i];
                while (c.charAt(0)==' ') c = c.substring(1,c.length);
                if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
        }
        return null;
}
function createCookie(name,value,days) {
        if (days) {
                var date = new Date();
                date.setTime(date.getTime()+(days*24*60*60*1000));
                var expires = "; expires="+date.toGMTString();
        }
        else var expires = "";
        document.cookie = name+"="+value+expires+"; path=/";
}


</script>

                    <div id = "div1">
Please enter the password <input type = "password" name = "pwd" id = "pwd" onchange = "checkPassword(this.value)">
<button type="button">Submit</button>
</div>
                  <div id="admintable" style="visibility:hidden"> <span class="style1">

Open in new window

robbobrobAsked:
Who is Participating?
 
robbobrobConnect With a Mentor Author Commented:
Resolved.

I took the code and removed everytthing else and it worked

I then found out that I had a "disable Right click" function that was the issue.

Removed that and problem solved.
0
 
RajneshwarPrasadCommented:
What is the issue? use if statements.
0
 
robbobrobAuthor Commented:
RajneshwarPrasad: I actually need someone to look at the code and see where they can place a "if statement"

That is the issue. Sorry, I am not a programmer.
0
Keep up with what's happening at Experts Exchange!

Sign up to receive Decoded, a new monthly digest with product updates, feature release info, continuing education opportunities, and more.

 
RajneshwarPrasadCommented:
Put the script tag in your HTML codes using. I mean within html codes but whereever it requires javascript enclose it with script tag
0
 
StealthyDevCommented:
Hi author,

I think, the code attached can help you?

If this is not you are looking for, what do you want to validate? I mean why do you want a IF-Statement?

Regards.


function authenticate() {
 
if (readCookie('authenticated')!=null) { 
document.getElementById("div1").style.display="block";
return true; 
} 
else { 
//document.getElementById("div1").style.display="block";
document.getElementById("div1").style.display="none";
alert ("Please enter the password");
}
return false;
}

Open in new window

0
 
robbobrobAuthor Commented:
Sorry, Maybe I am not being clear enough.

My current code above does the following

1. Allows the Show/Hide Div tag to appear when the user enters the passcode (Works fine)
2. Creates a cookie "createCookie('authenticated',true);"    (I think this works fine)

The issue is
If someone goes to the site that has already been there, and therefore: 'authenticated',true:
the document.getElementById("admintable").style.visibility = "visible" will already be activated.
So the Function authenticate needs to be called as soon as the webpage loads, to check if someone already put in the passcode in the past.

senthurpandian: I replaced the code, and it did not work
0
 
StealthyDevCommented:
For this you need to set the expiry time of the cookie.

I can give you an example. GMail.
If you once login, you can open multiple tabs/windows without prompted for a password.
Like the way, you can set the cookie expiry for a day in GMail.

You (in your cookie.js) can also set it for 2-5 mins (like in banking websites).

Cheers.

0
 
robbobrobAuthor Commented:
Ok. I got it working in Firefox, Chrome and Safari.

But IE is killing me. Gives me a error

Error:'document.getElementById(...)' is null or not an object

Here is the working code. Like I said, works well in all browsers but IE.

Thoughts?
<head>  <script>
var expDays = 365; // number of days the cookie should last

function GetCookie (name) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0) break;
}
return null;
}
function SetCookie (name, value) {
var argv = SetCookie.arguments;
var argc = SetCookie.arguments.length;
var expires = (argc > 2) ? argv[2] : null;
var path = (argc > 3) ? argv[3] : null;
var domain = (argc > 4) ? argv[4] : null;
var secure = (argc > 5) ? argv[5] : false;
document.cookie = name + "=" + escape (value) +
((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
((path == null) ? "" : ("; path=" + path)) +
((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
}
function DeleteCookie (name) {
var exp = new Date();
exp.setTime (exp.getTime() - 1);
var cval = GetCookie (name);
document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString();
}
var exp = new Date();
exp.setTime(exp.getTime() + (expDays*24*60*60*1000));
function amt(){
var count = GetCookie('count')
if(count == null) {
SetCookie('count','1')
return 1
}
else {
var newcount = parseInt(count) + 1;
DeleteCookie('count')
SetCookie('count',newcount,exp)
return count
  }
}
function getCookieVal(offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}

function checkCount() {
var count = GetCookie('count');
if (count == null) {
count=1;
SetCookie('count', count, exp);
}
else {
count++;
SetCookie('count', count, exp);
document.getElementById("admintable").style.visibility = "visible"
document.getElementById("div1").style.display="none";  // remove password div if desired
return true; 
  }
}

function checkPassword(which) 
{
if (which=="herbalade" || which=="herbalife") 
{
alert ("Password is correct!");
document.getElementById("admintable").style.visibility = "visible"
document.getElementById("div1").style.display="none";  // remove password div if desired
return true; 
}
else 
{  
alert ("Incorrect password - please try again");
document.getElementById("pwd").value = "";
return false;
} 

}
//  End -->
</script>


AND
----------------------------------------

<div id = "div1">
                            Please enter the Passcode: <input type = "password" name = "pwd" id = "pwd" onchange = "checkPassword(this.value)">
  <button type="button">Submit</button>
  </div>
                          <div id="admintable" style="visibility:hidden"> <span class="style1">
                            <!-- BEGIN FORM -->

Open in new window

0
 
StealthyDevCommented:
Is that showing any line number?
0
 
robbobrobAuthor Commented:
Webpage error details

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET CLR 1.1.4322; InfoPath.2; OfficeLiveConnector.1.3; OfficeLivePatch.0.0)
Timestamp: Fri, 16 Apr 2010 16:21:18 UTC


Message: 'document.getElementById(...)' is null or not an object
Line: 1
Char: 20
Code: 0

0
 
StealthyDevCommented:
Try running this debug script to find where the problem is:

I cannot test in my end (as i dont have a server).


<head>  <script>
var expDays = 365; // number of days the cookie should last

function GetCookie (name) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0) break;
}
return null;
}
function SetCookie (name, value) {
var argv = SetCookie.arguments;
var argc = SetCookie.arguments.length;
var expires = (argc > 2) ? argv[2] : null;
var path = (argc > 3) ? argv[3] : null;
var domain = (argc > 4) ? argv[4] : null;
var secure = (argc > 5) ? argv[5] : false;
document.cookie = name + "=" + escape (value) +
((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
((path == null) ? "" : ("; path=" + path)) +
((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
}
function DeleteCookie (name) {
var exp = new Date();
exp.setTime (exp.getTime() - 1);
var cval = GetCookie (name);
document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString();
}
var exp = new Date();
exp.setTime(exp.getTime() + (expDays*24*60*60*1000));
function amt(){
var count = GetCookie('count')
if(count == null) {
SetCookie('count','1')
return 1
}
else {
var newcount = parseInt(count) + 1;
DeleteCookie('count')
SetCookie('count',newcount,exp)
return count
  }
}
function getCookieVal(offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}

function checkCount() {
var count = GetCookie('count');
if (count == null) {
count=1;
SetCookie('count', count, exp);
}
else {
count++;
SetCookie('count', count, exp);
alert("test1");
document.getElementById("admintable").style.visibility = "visible"
alert("test2");
document.getElementById("div1").style.display="none";  // remove password div if desired
alert("test3");
return true; 
  }
}

function checkPassword(which) 
{
if (which=="herbalade" || which=="herbalife") 
{
alert ("Password is correct!");
document.getElementById("admintable").style.visibility = "visible"
document.getElementById("div1").style.display="none";  // remove password div if desired
return true; 
}
else 
{  
alert ("Incorrect password - please try again");
alert("test1");
document.getElementById("pwd").value = "";
return false;
} 

}
//  End -->
</script>


AND
----------------------------------------

<div id = "div1">
                            Please enter the Passcode: <input type = "password" name = "pwd" id = "pwd" onchange = "checkPassword(this.value)">
  <button type="button">Submit</button>
  </div>
                          <div id="admintable" style="visibility:hidden"> <span class="style1">
                            <!-- BEGIN FORM -->

Open in new window

0
 
robbobrobAuthor Commented:
Can I email you the link.

I tried the script debgu in IE but it didn't give me anything useful
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.

All Courses

From novice to tech pro — start learning today.