Why doesn't HTML see the js function?

F

f1rew0rk142022-04-21 05:14:35

JavaScript

f1rew0rk14, 2022-04-21 05:14:35

I added a form and a button to the html, by clicking on which the function from the script should be called.
If I write only a function in this script, then everything works, but if I add imports there, it already writes that the function is not used anywhere and, accordingly, the script does not work.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="./get_input_data.js"></script>
</head>
<body>
<h1>Send message</h1>
    <form onsubmit="get_input_data()">
        <input type="text"  id="data">
        <button type="submit" >send</button>
    </form>
</body>
</html>

/*import {parameters} from "./Parameters";
import {spam_protection} from "./client";*/

function get_input_data()
{
    let text = document.getElementById("data");
    alert(text.value);
}

Reply

Answer the question

In order to leave comments, you need to log in

4 answer(s)

Z

Zagir Majidov, 2022-04-21
@Zagir-vip

wrap js in a tag

E

Evgeny Zhurov, 2022-04-21
@Zhuroff

If I'm not mistaken, onsubmit only works with scripts written in the same html file inside the script tag. It does not work with external files. In any case, submitting from html is so-so practice. If you still write js in external files, then submit it there as well. And to access specific form values, use the name attributes:

<form id="form">
    <input type="text" name="textField">
    <button type="submit" >send</button>
</form>

const form = document.querySelector('#form')

function submitForm(event) {
  event.preventDefault()
  console.log(event.target.textField.value)
}

form.addEventListener('submit', submitForm)

I

imko, 2022-04-21
@imko

Take it to window

window.get_input_data = function ()
{
    let text = document.getElementById("data");
    alert(text.value);
}

B

BUTURUM, 2022-04-23
@BUTURUM

in fact, js embedded in html attributes is a controversial and unreliable thing. I suggest just adding:

<script>
     document.getElementById('form').addEventListener('submit',  get_input_data)
</script>