How to call a JavaScript function from a button onclick in JSP page

Question

    <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
        pageEncoding="ISO-8859-1"%>
        <%@page import="java.util.Map" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <title>Login page</title>
    </head>
    <body>
     <link rel="stylesheet" type="text/css" href="css/login.css"/>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />

    <form action="LoginS" method="post">  
       <button type="submit"  onclick="javascript:MyFunction();">Login</button>
      <div class="container" style="background-color:#f1f1f1">
        <button type="button" class="cancelbtn">Cancel</button>
        <span class="psw">Forgot <a href="#">password?</a></span>
      </div>

      <script type="text/javascript">
    MyFunction(){
                 alert("java Script");
    }
    </script>
     </form>
    </body>
    </html>

Above is my code that I'm trying to call JavaScript function from the submit button onclick() event but its showing nothing. Am I doing any wrong in code.

When I click on the button nothing happens. I want the string value in the text box to be printed on the console.

where is the part that calls the function? also the correct javascript function syntax is function MyFunction(){} — Kevin Kloet
– Kevin Kloet, Commented Dec 19, 2016 at 11:29
Sorry i just miss ..now i have added please have a look on it — Panky031
– Panky031, Commented Dec 19, 2016 at 11:33
Its working now : I have just changed the script code to like this : — Panky031
– Panky031, Commented Dec 19, 2016 at 11:35
Its working now : I have just changed the script code to like this : <script type="text/javascript"> function MyFunction(){ alert("java Script"); } </script> — Panky031
– Panky031, Commented Dec 19, 2016 at 11:36

Mahsa Lotfi · Accepted Answer · 2016-12-19 13:35:06Z

3

I've made some changes to make your code working and print "java script" in the console since there isn't any text box in your code :) I've also added a textbox to your code and printed its value as a sample for you.

I changed the type of login button to "button" and defined MyFunction as a function.

I also made a fiddle for it to test.

<form action="LoginS" method="post">  
    <button type="button"  onclick="javascript:MyFunction()">Login</button>
    <input id="text-box"/>
    <div class="container" style="background-color:#f1f1f1">
        <button type="button" class="cancelbtn">Cancel</button>
        <span class="psw">Forgot <a href="#">password?</a></span>
    </div>

    <script type="text/javascript">
        MyFunction = function(){
            console.log("java Script");
            console.log(document.getElementById("text-box").value);
        }
    </script>
</form>

edited Dec 19, 2016 at 13:35

answered Dec 19, 2016 at 13:09

Mahsa Lotfi

774 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to call a JavaScript function from a button onclick in JSP page

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related