Link to home
Start Free TrialLog in
Avatar of boatful
boatful

asked on

window.prompt 'name & password(***)' ???

I need the code for a JavaScript dual-field prompt window (exactly like the Experts Exchange log-on prompt). I need the 2nd field contents obscured by ******.   Please also explain (if you could) how to set the contents of the 2 fields to predetermined string literals.  
Thanks so much,
Tony
Williston,VT
Avatar of clambake
clambake

This cannot be done in JavaScript.  Unfortunately JS lacks the ability to customize the three dialog boxes (prompt, alert, confirm) beyond the text message it spits up.

Authentication like the Experts Exchange login prompt are specified in the web server.  Contact your server administrator or ISP to have them restrict access in this manner.
you cannot customize the confirm-box to have the fields you are looking for, BUT you can open a new window to look the way you want it to look. Try this code:

<HTML>
<!-- works in Netscape, not tested in IE -->
<HEAD>
<TITLE> Dialog-Test </TITLE>

  function CheckPwd() {
msgWindow=window.open("","displayWindow","height=150,width=400");
   msgWindow.document.write("<HEAD><TITLE>Password required</TITLE></HEAD>")
   msgWindow.document.write("<BODY bgcolor='gray'><FORM formpwd><table><tr><td>Your name:</td><td><input type=text size=20></td></tr>");
   msgWindow.document.write("<tr><td>Your password:</td><td><input type=password size=20></td></tr>");
   msgWindow.document.write("<tr><td COLSPAN=2 ALIGN=CENTER><input type=button value=' OK '>&nbsp;&nbsp;<input type=button value=' Cancel '></td></tr></table></form>");
   return msgWindow;
  }

</HEAD>
<BODY>
  <form><input type=button onclick="CheckPwd()" value="Open"></form>
</BODY>
</HTML>

This opens a window like the one you want to have. Unfortunately, this is not a simple routine that waits for an OK/Cancel and returns values. You will have to mess around with timers and return-values to detect if, when and how the form was closed and to get what you want to have.
I will help you do this, but I'd like to have the question unlocked first and I'd also appreciate it if you could increase the point-value if you have any points to spare - this definitely is NOT an easy one!
Take a look at the page (just cut&paste the code) and post a comment...
The problem with attempting client-side authentication is that it will always be insecure.  Holger, do you propose that the document source includes something like:

if (password_entered = "magic_word")
      {
      document.location = "secure_file.html"
      }


??? well... you tell me!
You asked about a "window.prompt 'name & password(***)' ???"...
where did YOU want to put the password? If you have access to a server that offers server side authetication, that's definitely better if you only want to restrict access to your pages - plus, it is (almost) hack-proof, something that JavaScript can and will probably never be...
Many servers do not support this type of authentication or, more accurately, don't have it enabled for their "clients' homepages". You can also calculate the new URL from the password, which is fairly safe as long as you have an index.html file and people can't look at your directory.

Which type of authentication you use also depends on your needs - server side authentication is safe but fairly unflexible - you can not change the layout of the prompt, you do not have access to the user name that was used without some form of CGI and you cannot set the fields to a "predetermined string literal".
btw.: If you do have CGI, you can also do whatever you want with the data and then send them to a script for verification. This script would either return a page: "Sorry.....blablabla" or the next page for the user...

This is not what you asked, though!! I was trying to answer your question.
Avatar of boatful

ASKER

Interesting discourse, you guys!  I suppose server side authentication is best, but unfortunately is 1) beyond my present knowledge level and 2) not available to AOL customers (where my web pages reside).
I want to unlock the question so Holger can have the points.  I appreciate his/her thouroughness and was able to adapt the script myself (with timeouts, etc. as needed).  The other paradigm for password protection in JavaScript I found compelling is the following simple routine.  It works great in a frames environment, where the META HTTP-EQUIV=REFRESH call is allowed only if the correct password is entered, toggling a parent variable to true (e.g. parent.ACCESS_GRANTED=true):

Try This. It's The Simpleist Password Protection Thing I Know.  Here Are The Steps...
1)Make An Incorrect Password Page
2)Make A Correct Password Page
3)Make A Log-in Page (code below)
4)Make A Welcome Page That Links ONLY To The Log-In Page

<HTML>
<!-- Password Log-in JavaScript Copyright 1996-1997, Smallfri Inc. -->
<!-- http://www.nsis.com/~coadydk/ -->
<HEAD>
<TITLE>Password Log-in</TITLE>
<SCRIPT language="JavaScript">
<!-- Script Segment
    password = "correct-password"; // Password Needed To Enter The Web Page
    relocateloc = "welcome1.htm" //
Location You'll Be Pushed To If Your Password Is Inncorrect
    if (prompt("What Message I Want To Be Displayed When Someone Try's
To Log-in ie, Please Enter Your Correct Password", "") != password) {
location.href=relocateloc}
// End Script -->
</SCRIPT>
<!-- Log-in Script End -->
</HEAD>
<BODY BGCOLOR=#FFFFFF>
<!-- Begin Axcess Granted Push -->
<!-- This "Push" Is Extreamly Important
    For The Password Log-in To Work The
    Page Called "axcess_granted_page.html'
    Is The Page That They Goto If The
    Password Is Correct Make The Page Name
    Complacated So It Won't Be An Easey Guess! -->
<META HTTP-EQUIV=REFRESH CONTENT="1; URL=axcess_granted_page.html">
<!-- End Axcess Granted Push -->
</BODY>
</HTML>

You Can Edit Almost Anything But Don't Add Things To The Body Section Execept
What's Allready There, Ie:Text, Images, Extra HTML, Ext.

This One Also Has A Couple Of Comments So You Can Easly Understand the routine.
Hey why not to use
"password" in form, it at least give you **** :)

<HTML> <head>
<script>
 function checkpass()
 {if(document.forms[0].elements[0].value=="correctone")
  document.forms[0].action="valid.html"
 }
</script>
</head>

<body>
<FORM  method="get" action="notvalid.html" onSubmit="checkpass()">
Enter your passwors here:
<input name type="password"  >
<input type="submit" Value="go" >
</form>
</BODY>
</HTML>

Sure that's also insequre, but better than nothing
and not so sophisticated :)
Well, first of all: Sorry, boatful. I got mixed up and thought you had posted the comment clambake had posted - that's why I wrote "You tell me!"...

2) For some reason, I did not get an e-mail that you posted a comment... so I didn't post an answer...

3) KOLLEGOV: a) boatful said he/she had solved the problem by adjusting the script I had posted and unlocked the question so I could answer to get the points... why do you post an answer then??
    b) My answer also contains the "password" field, but in an extra window, which is what boatful wanted.


boatful:
I'd appreciate it if you could unlock the question again ;-))

btw: What happens to your solution if I disable JavaScript and then open the page?? "Open sesame" ? You might prefer a solution where users without JS cannot enter rather than enter automatically *gg*
* also, both your password and the URL of the next page show up as plain text in the source of the document. Anybody smart enough to choose "View Source" can simply read the PW or even go to the next page right away...
It is "safer" to forward the user to a page that is in some way calculated from the PW. This way, neither the correct word nor the PW show up in the page and it is almost impossible to guess... something as simple as ROT13 will do ;-)... even document.location=PW+".html" is good enough! That way you can even have multiple passwords that lead to different pages (maybe some of them with a META-Refresh ;-)
Sorry, Holger :)
Boatful,please, reject my answer.



Avatar of boatful

ASKER

Sorry kollegov, but in all fairness I'd like the points to go to Holger.  It's been an education.................
Boatful (Tony Shaw, Williston, VT)
ASKER CERTIFIED SOLUTION
Avatar of Holger101497
Holger101497

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of boatful

ASKER

Holger,
Truthfully, I didn't know it was possible to disable JS in Navigator, but I will try it and see what transpires.  The site I'm building uses JS EXTENSIVELY to access html database arrays and assemble customized material for my clients (none of which would be possible anyway with JS disabled) !!  I intend to advertise to folks in my profession and permit them to access the 'shareware' version online.  I will give folks a month or two of free usage (emailing needed passwords -- changed monthly) and after that give them the option to 1) subscribe to the site for a monthly fee, or 2) buy the 'software' on floppy.  Scores of html and gif files are involved, so only the most determined hackers will succeed at downloading everything they need run the 'program' unauthorized.
Thanks again for your help...and persistence!!
Tony