-2
I am doing a project on Nodejs and using EJS as engine and came across a problem when trying to use export to send data from my frontend to my backend.
When I take the export line, my formScript functions are performed perfectly however, when I type this line, my functions do not run, in the browser gives error seguint:
Uncaught Referenceerror: nextPageForm is not defined
in my formScript file, where I try to export, the code is like this:
function nextPageForm(){
let allForms = document.querySelectorAll('.form');
for(let i = 0; i < allForms.length; i++){
if(allForms[i].classList[1] == 'active'){
allForms[i+1].classList.add('active');
allForms[i].classList.remove('active');
break;
}
}
}
let valor = 3;
export default valor;
The EJS containing the html is like this:
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style/default.css">
<link rel="stylesheet" href="style/form.css">
<title>Formulário | Gport</title>
</head>
<body>
<header>
<div>aqui vai as bolinhas de indentificação de etapa</div>
</header>
<article>
<form method="POST" action="#">
<div class="form active">
<h2>Sobre você</h2>
<input type="text" name="name" placeholder="Nome" >
<input type="number" name="age" placeholder="Idade" >
<input type="email" name="email" placeholder="E-mail" >
<input type="phone" name="phone" placeholder="Telefone" >
<textarea style="resize: none" name="description" placeholder="Escreva um pouco sobre você" ></textarea>
<a class="back" href="/">Home</a>
<button type="button" class="next" onclick="nextPageForm()">Próximo</button>
</div>
<div class="form">
<h2>Educação</h2>
<section id="allCourse">
<div id="course">
<input type="text" name="course1" placeholder="Nome do curso" >
<input type="text" name="institution1" placeholder="Instituição" >
<input type="text" name="time1" placeholder="Duração" >
</div>
</section>
<button type="button" onclick="addInputsEducation()">Adicionar mais cursos</button>
<a class="back" onclick="previousPageForm()">Voltar</a>
<button type="button" class="next" onclick="nextPageForm()">Próximo</button>
</div>
<div class="form">
<h2>Projetos</h2>
<div class="project">
<input type="text" name="nameProject" placeholder="Nome" >
<input type="text" name="skillsProject" placeholder="Habilidades que esse projeto exigiu">
<section id="allSkills">
<span class="spanHidden">* clique na habilidade para excluir</span>
</section>
<button type="button" onclick="addSkill()">Adicionar Habilidade</button>
<input type="text" name="" placeholder="Duração" >
</div>
<button type="button" onclick="addProject()">Adicionar mais projetos</button>
<a class="back" onclick="previousPageForm()">Voltar</a>
<button class="next" onclick="sendForm()">Enviar</button>
</div>
</form>
</article>
<script type="text/javascript" src="/scripts/formScript.js"></script>
<script type="module" src="/scripts/testeDoido.js"></script>
</body>
</html>
And finally, here’s the way I’m importing on the Routes.js
import valor from '../public/scripts/formScript.js';