i cannot invoke the function in login.html which is specified after the import statement in login.js

133 views Asked by At

This is my code

login.html-----------------------------------------

<!DOCTYPE html>
<html>
<head>
    <meta charset='utf-8'>
    <meta http-equiv='X-UA-Compatible' content='IE=edge'>
    <title>RavenL0gin</title>
    <meta name='viewport' content='width=device-width, initial-scale=1'>
    <link rel="stylesheet" type="text/css" href="login.css">
    <script type="module" src="./login.js"></script>
    <script type="module" src="./connect.js"></script>
</head>
<body>
    <div class="logincont">
        <div>
           <img src="boylog.png">
           <img src="girllog.jpeg">
           <input type="text" id="username" placeholder="User-Name" onchange=incre()><br>
           <span id="usernameerr"></span><br>
           <input type="password" id="pwd" placeholder="Password" onchange=incre()><br>
           <span id="passworderr"></span><br>
           <button onclick=comp() id="but">Login</button>
           <p>Did'nt Register yet?<a href="#">Register Now</a></p>
        </div>

    </div>
    
</body>
</html>

login.js------------------------------------------------------

import  {rows}  from "./connect.js";

console.log(rows)

 let nm=0;
 let pwd=0;

 export default function incre(){
    for(let i=0;i<rows.length;i++){
        if(rows[i].uname==document.getElementById("username").value){
            nm++;
            console.log(nm);
        }
        if(rows[i].pwd==document.getElementById("pwd").value){
            pwd++;
        }
 }
}

export default function comp(){
    document.getElementById("but").style.marginLeft="23px";
    document.getElementById("pwd").style.marginLeft="32px";


        if(nm==0){
            document.getElementById("usernameerr").innerText="Invalid Username";
            document.getElementById("but").style.marginTop="20px";


        }
        if(pwd==0){
            document.getElementById("passworderr").innerText="Invalid Password";
            document.getElementById("but").style.marginTop="20px";
        }

        if(nm>0 && pwd>0){
           window.location.replace("main.html");
        }
   
        num=0;
        pwd=0;
    }

connect.js-------------------------------------------------------

import mysql from "mysql2";



const pool=mysql.createPool({
    host:"localhost",
    user:"root",
    password:"root123",
    database:"vishnu"
}).promise();




const result=await pool.query("select * from login");
const rows=result[0];
console.log(rows)

export {rows};


this is my error So this is my code guys as you see I complicated a lot in this mess but still I hope you guys understand and give me a solution. I will be glad if anyone replies me

1

There are 1 answers

2
DibsyJr On

When defining properties in HTML tags you need to put quotation marks "" or '' around the value:

function comp(){
    console.log("Hello!");
}
 <button onclick="comp()" id="but">Login</button>