How to call a function in the javascript file type="module"

Question

I use the .net application to design my web. I import the file below:

//html file like:
<script src="~/js/login/login.js" type="module"></script>



//code  login.js below:
import reponsitoryfactory from "../../service/factory/reponsitoryfactory.js";
const authreponsitory = reponsitoryfactory.get("auth");

export function login() {
    alert('fasfs');
    var data = {
        "username": $('#txt-username').val(),
        "password": $('#txt-password').val()
    };
    authreponsitory.login(data).then(function (response) {
        if (response.data.success) {
            alert("success");
        }
    });
};

In the HTML file I call the login function like:

<span class="k t btn bnt-login" onclick="login1()">Login</span>

I try some way to fix so the login function is not exist, how can anyone help me call a function in the javascript file module!

Answer 1

You can do some changes like below.

//html file like:

<script src="~/js/login/login.js" type="module"></script>

<button id="login">Login</button>

//code login.js below:

import reponsitoryfactory from "../../service/factory/reponsitoryfactory.js";
const authreponsitory = reponsitoryfactory.get("auth");

export function login() {
    alert('fasfs');
    var data = {
        "username": $('#txt-username').val(),
        "password": $('#txt-password').val()
    };
    authreponsitory.login(data).then(function (response) {
        if (response.data.success) {
            alert("success");
        }
    });
};
document.querySelector('#login').addEventListener('click', login);