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 8 of 8
  1. #1
    New to the CF scene
    Join Date
    Apr 2008
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Image button in forms

    Login and Password script - Javascript Kit


    Please, please advise me how I script the 'onClick="pasuser(this.form)' if I want to use my own image as a button instead of the standard and boring browser version.

    I have tried for days now various combinations of Submit() etc but to no avail. This has fast become the nightmare of the year, especially as I am no stranger to scripts or producing my own websites and assume that the answer to the problem is very simple.

    I can only presume that I'm doing something so fundamentally wrong that I can't see it for what it is.

    The script is:-

    <script language="javascript">
    <!--//
    /*This Script allows people to enter by using a form that asks for a
    UserID and Password*/
    function pasuser(form) {
    if (form.id.value=="JavaScript") {
    if (form.pass.value=="Kit") {
    location="page2.html"
    } else {
    alert("Invalid Password")
    }
    } else { alert("Invalid UserID")
    }
    }
    //-->
    </script>

    and the current input for the button is:
    <input type="button" value="Login" onClick="pasuser(this.form)">

    Please help!!

    Thanks

    EuroWhippey

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,864
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    What's id in form.id? Post the complete html of your form.
    BTW, please read this sticky, http://www.codingforums.com/showthread.php?t=82672
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    New to the CF scene
    Join Date
    Apr 2008
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hi Abduraooft


    Complete form as supplied by Javascript Kit - see below. If it's wrong don't blame me!! It works fine with the basic button so nothing wrong there. Point is how do I get an image button to work this script??

    Any help appreciated.


    <table bgcolor="white" cellpadding="12" border="1">
    <tr><td colspan="2"><center><h1><i><b>Login
    Area</b></i></h1></center></td></tr>
    <tr><td><h1><i><b>UserID:</b></i></h1></td><td><form name="login"><input
    name="id" type="text"></td></tr>
    <tr><td><h1><i><b>Password:</b></i></h1></td><td><input name="pass"
    type="password"></td></tr>
    <tr><td><center><input type="button" value="Login"
    onClick="pasuser(this.form)"></center></td><td><center><br><input
    type="Reset"></form></td></tr></table>


    Any help appreciated.

    Thanks

    EuroWhippey

  • #4
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,252
    Thanks
    203
    Thanked 2,557 Times in 2,535 Posts
    <script type = "text/javascript">

    function pasuser() {
    if (document.myForm.uid.value == "JavaScript") {
    if (document.myForm.pass.value == "Kit") {
    location = "page2.html";
    } else {alert("Invalid Password")}
    }
    else { alert("Invalid UserID")}
    }

    </script>

    <form name = "myForm">
    <input type = "text" name = "uid" size = "20">
    <input type = "text" name = "pass" size = "20">
    <img src = "yourImage.gif" onClick = "pasuser()">
    <input type="button" value="Login" onClick="pasuser()">

    </form>

    I expect you want that your user id and password are case sensitive.
    BTW it is not a very good idea to name an element id as that can create confusion. I have changed it to uid.

    I expect also that you realise that client-side validation of user names and passwords is hopelessly insecure, as anyone can view the source.


    It is your responsibility to die() if necessary….. - PHP Manual
    Last edited by Philip M; 04-26-2008 at 09:06 AM.

  • #5
    New to the CF scene
    Join Date
    Apr 2008
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks guys for info and help but no one so far has answered my question!!

    Is there anyone out there in cyber leggoland who knows how to cose for using an image instead of standard button. That's all I need.

    Thanks

  • #6
    Senior Coder rangana's Avatar
    Join Date
    Feb 2008
    Location
    Cebu City, Philippines
    Posts
    1,752
    Thanks
    65
    Thanked 372 Times in 365 Posts
    Is this what you mean?
    Code:
    <input type="image" src="http://www.clker.com/cliparts/e/1/8/6/1195445174337626852molumen_green_round_submit_icon.svg.hi.png" style="vertical-align:middle;height:40px;" onClick = "pasuser(this.form)">
    Learn how to javascript at 02geek

    The more you learn, the more you'll realize there's much more to learn
    Ray.ph

  • #7
    New to the CF scene
    Join Date
    Apr 2008
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yes and No.

    Because putting either onClick = "pasuser(this.form)" or onSubmit = "pasuser(this.form)" does not make the form work. onClick does nothing and all that onSumbit does is ckeck that the username/password is ok and then it simply refreshes the page. How do I get it to action the url it's meant to go onto ?

  • #8
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,252
    Thanks
    203
    Thanked 2,557 Times in 2,535 Posts
    I am afraid that I do not understand what your problem is. You have not previously mentioned submission of a form - I thought that your objective was to use an image in place of a button, and if the uid and password were correct you wanted to redirect to a page called "page2.html".

    You can easily modify the script I gave you to submit a form if that is what you want.

    Quizmaster: "Cornish" describes something from which English county?
    Contestant: Devon.


  •  

    Posting Permissions

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