Javascript function is not defined in script?

Question

I know this question has been asked before but I have tried numerous solutions from stackoverflow and I could not find the problem.I receive the error in the browser console that the function that I defined in the script tag is not defined.This is the code:

<html>
<body>
    <input type="text" id="input_1"/>
    <button type="button" value="Click" onclick="cd()" id="getDatabaseData">Click!</button>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">
        function cd() {
            var inbtn = {};
            inbtn.input = $('#input_1').val();

            console.log('Started...');

            $.ajax({

                type: 'post',
                url: '<%: Url.Action("Trial") %>',
                data: inbtn,
                success: function er() {
                    console.log("Succes!")
                },
                error: function err() {
                    console.log("Error!")
                }
            })
        }   
    </script>
</body>
</html>

I tried to add $document.ready and also to add a separate event listener(not onclick function)

 $(document).ready(
        document.getElementById("getDatabaseData").addEventListener("click", cd, false));

It did not worked.I also replaced the whole function with a simple function:

function cd(){
console.log("Message");
}

and I still receive the same error:

Uncaught ReferenceError: cd is not defined
    at HTMLButtonElement.onclick

Your cd() function is not correctly placed within a <script> tag in your document. Open a new <script> after your jQuery. — Michael Rodriguez
– Michael Rodriguez, Commented Dec 21, 2019 at 17:33

John Dahl · Accepted Answer · 2019-12-21 17:44:54Z

2

To clarify what has already been said, but not specifically called out... a script tag can EITHER contain a src attribute to pull in an external script file OR it can contains the script content. A single script tag cannot contain both.

answered Dec 21, 2019 at 17:44

John Dahl

312 bronze badges

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

Comments

ousecTic · Accepted Answer · 2019-12-21 17:32:42Z

Just a small mistake

You need to make another script tag and put the function cd inside

<html>
<body>
    <input type="text" id="input_1"/>
    <button type="button" value="Click" onclick="cd()" id="getDatabaseData">Click!</button>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">

    </script>
    <script>
    function cd() {
            var inbtn = {};
            inbtn.input = $('#input_1').val();

            console.log('Started...');

            $.ajax({

                type: 'post',
                url: '<%: Url.Action("Trial") %>',
                data: inbtn,
                success: function er() {
                    console.log("Succes!")
                },
                error: function err() {
                    console.log("Error!")
                }
            })
        } 
    </script>
</body>
</html>

I am assuming this is the result you want , because the cd is now defined

Collectives™ on Stack Overflow

Javascript function is not defined in script?

2 Answers 2

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Related