Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    New Coder
    Join Date
    Jan 2013
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Making a simple form work.

    Hello!
    First time here, and I am in need of a little guidance.
    I have the vision for my website, I just lack a little in the technical know-how.

    Let me give you an idea of what's going on here, I have the intro page set up. My goal is to have a simple login page, a really simple, basic password protection concept. The result I'm looking for is an 'if, else if, else' type script, where certain passwords take you to certain pages. It's bare-boned, and not super secure, but that's okay. Nothing sensitive is being hosted, it's more of a stepping stone for bigger projects down the road.

    I know a bit about HTML, and am coming along nicely with CSS, but Javascript is still for the most part over my head. This is my first time ever using Javascript, I kind of skipped over 'Hello World' and right to conditionals. I've got the idea mostly worked out, while consulting Google for assistance, but I can not get it to work right. Here's what I have so far.

    Code:
    <script language="javascript">
    function loadPage(form) {
    if (form.id.value=="1") {
    open.document="newcustomer.php"
    } else {
    alert("Invalid password")
    }
    }
    </script>
    That's the script so far, it's located in the body, I've tried the head, to no avail. For ease with troubleshooting, the only acceptable password is '1,' this is so I know for certain that I'm putting in the right password. Also, this script as of now only has one acceptable password, when I finally get this working right, and add more pages, I'll add more 'else if's.'


    Code:
    <form name="form">	
    <CENTER><label for="enter">Enter Your Password:</label><input name="id" input type="text" class="box" name="pwd"/>  <input type="submit" class="submit" onClick="loadPage(this.form)" value="Enter Now"/></CENTER>
    </form> 
    This is the actual HTML markup for the form. Straight forward stuff here, just a simple text box (temporarily set to 'text' for the same troubleshooting assistance.)


    The alert box does show up when an incorrect password is entered, but if I enter the correct password (1, in this case) the page simply refreshes, and 'pwd=1' appears at the end of the URL.

    I'm puzzled, normally I can figure things out on my own, but this time I'm reaching out. Hopefully I've given you enough information, this is also my first attempt at looking for assistance for this sort of thing. If you need anymore, let me know!

    Thanks for any and all help.

    Bill



    (Afterthought: I hit preview to make sure everything looked alright, then I noticed I have 'name=pwd' and 'input name=id' both in the form. I tried deleting the 'name=pwd' and trying again, same result, only 'id=1' appeared in the URL. Thought I had it there for a second, so close...


    (Edit: Sorry, I posted without reading the post that tells you how to post. I'll put in descriptive titles in from now on...
    Last edited by bdenny20; 01-24-2013 at 01:16 PM. Reason: I'm retarted...

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,918
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    Quote Originally Posted by bdenny20 View Post
    Hello!
    First time here, and I am in need of a little guidance.
    I have the vision for my website, I just lack a little in the technical know-how.
    Lots of problems.

    <script language=javascript> is long deprecated and obsolete. Use <script type = "text/javascript"> instead (in fact also deprecated but still necessary for IE<9).

    Assigning a name to a form is also deprecated and obsolete. Forms should have an id only.

    You may not name an HTML element with the reserved word id. It is simply silly to give a name the name id. A sensible name/id for a password field is, er, say pwd. And you realise that have assigned two different names to the field.

    There is no Javascript keyword "open". Have a look at window.location

    label for="enter" // There is no field named enter.

    But your script is totally insecure and hence virtually useless. Anyone can see the password and the redirect page simply by using View Source. Any non-trivial password or log-in script requires server-side coding.

    The trouble with scraping bits of code from the internet when you do not really understand what you are doing is that you are likely to end up with obolete stuff or even complete rubbish. Presumably you would not attempt to service or repair a machine or appliance without any experience or understanding of how it worked.

    You say you have now read the posting guidelines regarding silly thread titles. The thread title is supposed to help people who have a similar problem in future. Yours is useless for this purpose. You can (and should) edit it to make it more meaningful.

    Adam and Eve were created from an apple tree. Noah's wife was Joan of Ark. Noah built an ark and the animals came on in pears. - Pupil's answer to Catholic Elementary School test.
    Last edited by Philip M; 01-24-2013 at 12:15 PM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #3
    New Coder
    Join Date
    Jan 2013
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks for the reply. I re-named the post, I tried earlier, but didn't see the option to change the title originally. I was more successful the second time around.

    I originally had the 'text/javascript' in lieu of the latter, but in my increasingly odd attempts to get this to work, I started trying peculiar things...

    The enter label thing has something working for it on the style sheet, it formats the wording nicely, conventional methods proved unsuccessful. (There's a theme here if you can not tell...)

    I finally got it to work using 'window.open()'. It's not exactly what I was looking for, since this opens a new tab rather simply changing the page on the current tab. I'll keep tinkering with that later.

    Yes, I'm sorry it's blatantly obvious that I'm skewering Google for bits and pieces of other code to make something work. I am not just copying and pasting, I'm re-typing, looking up, and studying the purpose of each and every element. We all have to start out somewhere.

    Speaking of that, it's not entirely useless. It's a similar concept as 'Hello World,' which is arguably just as useless, albeit that is it's objective. I'm just trying to get my feet wet, and make script that does something somewhat productive at the same time.

    Thank you for your two cents though, I'm sure I'll be back after I botch more things up.

    Bill

  • #4
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,918
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    The trouble with "skewering Google for bits and pieces of other code" is that you are likely to encounter obsolete, deprecated, antiquated or just-plain-wrong-nowadays code, which you then have to un-learn if you want to gain competence. A good deal of the stuff posted on the internet is wildly outdated. You want to learn modern Javascript, not A History of Javascript.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #5
    Regular Coder
    Join Date
    Apr 2012
    Location
    St. Louis, MO
    Posts
    985
    Thanks
    7
    Thanked 101 Times in 101 Posts
    Google suggestion for code searching: "more search tools", "within last year".
    ^_^

    If anyone knows of a website that can offer ColdFusion help that isn't controlled by neurotic, pedantic jerks* (stackoverflow.com), please PM me with a link.
    *
    The neurotic, pedantic jerks are not the owners; just the people who are in control of the "popularity contest".

  • #6
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,179
    Thanks
    75
    Thanked 4,339 Times in 4,305 Posts
    As Philip said, this is about as secure as tying your house door closed with a piece of string.

    But...
    Code:
    <form action="newcustomer.php" onsubmit="return checkPassword(this);">
    Enter your password: <input name="pwd"/>
    <br/>
    <input type="submit"/>
    </form>
    <script type="text/javascript">
    function checkPassword(form)
    {
        if ( form.pwd == "1" ) { return true; // form will be submitted }
        alert("Invalid password"); // alert is also obsolete...you should *NOT* use it
        return false; // the form submit is cancelled
    }
    </script>
    Learn to use the standard HTML controls so much as possible.

    The advantage of the coding here is that if a user disables JavaScript, the <form> will *STILL* be submitted to your "newcustomer.php" page and then you can (and should!) re-check the password in the PHP code.

    Of course, this begs the question of why you are checking the password in the JavaScript code in the first place.

    Again, if a user disables JavaScript, the JS check is worthless.

    So just do it all in the PHP code and be safer and have it work no matter what.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #7
    New Coder
    Join Date
    Jan 2013
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks for the input. Once it finally started working, it was removed. Essentially for reasons already mentioned. It's not even necessary for me to have a password here, a enter link suffices.

    That 'script' was archived, and hopefully I can look back on it one day with the same incredulous expressions I'm sure you all had when you first saw it.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •