mbvee
mbvee

Reputation: 391

Uncaught ReferenceError: <function> is not defined at HTMLInputElement.onclick

I am trying to call a simple javascript function from my html page. The javascript function will decrypt using the "lib.js" file and the same is alerted.

Uncaught ReferenceError: decryptfun is not defined at HTMLInputElement.onclick (test.html:18)

The below is the only file I use (along with other dependent library files).

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="lib.js">
function decryptfun() {
    var pass = "hjubjbjhdgyuwj";
    var encrtoken = "abcdefghijklmn";

    var p = lib.decrypt(encrtoken, atob(pass));
    }
    alert(p);
</script>
</head>

<body>
<h1>Decrypt Operation</h1>
<input type="button" onclick="decryptfun()" value="Click">
</body>
</html>

I tried other suggestions provided for the same type of issue at Stackoverflow but I was not successful. Can anybody help me out in locating the cause of the issue ?

Upvotes: 12

Views: 144621

Answers (3)

Rami Alloush
Rami Alloush

Reputation: 2626

My problem was the I was defining my function inside

<script>
    $(document).ready(function () {
        function myFunction() ....
    })
</script>

It worked fine when directly defined in the script tag

<script>
     function myFunction() ....
</script>

Upvotes: 0

VISHAL GOTI
VISHAL GOTI

Reputation: 1

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Person.aspx.cs" Inherits="JqueryDemo1.Person" %>

<!DOCTYPE html>`enter code here`

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <script src="Scripts/jquery-3.5.1.min.js"></script>

    <script type="text/javascript">

        function SubmitData() {
            $.ajax({
                url: 'Person.aspx/InsertData',
                type: 'post',
                contentType: 'application/json;charset=utf-8',
                dataType: 'json',
                data: "{Name:'" + $('#txtname').val() + "', Address:'" + $('#txtaddress').val() + "', Age:'" + $('#txtage').val() + "'}",
                success: function () {
                    alert("Data inserted successfully");
                },

                error: function () {
                    alert("insert errorr");
                }
            });
    </script>

    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <table>
                <tr>
                    <td>Name:</td>
                    <td>
                        <input type="text" id="txtname" /></td>
                </tr>
                <tr>
                    <td>Address:</td>
                    <td>
                        <input type="text" id="txtaddress" /></td>
                </tr>
                <tr>
                    <td>Age:</td>
                    <td>
                        <input type="text" id="txtage" /></td>
                </tr>

                <tr>
                    <td>
                        <input type="button" id="btnsave" value="Submit" onclick="SubmitData()" />
                    </td>
                </tr>
            </table>
        </div>
    </form>
</body>
</html>

Upvotes: -1

Shakti Phartiyal
Shakti Phartiyal

Reputation: 6254

Your error is because you have defined your function inside:

<script type="text/javascript" src="lib.js">

the correct way is to close that script tag first like so:

<script type="text/javascript" src="lib.js"></script>

and then defining the script tag again to define the function like so:

<script>
function(){
    //body of function
};
</script>

<script type="text/javascript" src="lib.js"></script>
<script>
  function decryptfun() {
    var pass = "hjubjbjhdgyuwj";
    var encrtoken = "abcdefghijklmn";

    //var p = lib.decrypt(encrtoken, atob(pass)); //USE THIS IN YOUR CASE
    var p = "test"; //just for example
    alert(p);
  }
</script>
<h1>Decrypt Operation</h1>
<input type="button" onclick="decryptfun()" value="Click">

Upvotes: 11

Related Questions