How do I send form data to a link? - html

Question

I have a HTML page with a form, that has 2 inputs, an email, and a username. I want to pass these inputs to a node.js express server called exampleserver.com with fetch(). I have no problems with the server, however, I have problems with the form. Here is my html form:
<h1 align="center">Form</h1>
<input type="text" placeholder ="person#email.com" id="email">
<br>
<input type="text" id="username" placeholder="person">
<br>
<button type="submit" onclick="myfunc()" id="demo">Click Me</button>
<script type="text/javascript">
var email = document.getElementById('email')
var formattedemail = email.value.replace(/\./, '-') //periods dont work as a path in the express server, so this changes the period to a hyphen.
var username = document.getElementById('username');
function myfunc() {
let fetchRes = fetch("https://exampleserver.com/inputform/" + formattedemail + "/" + username.value);
fetchRes.then(res =>
res.json()).then(response => {
console.log(response.status)
})
}
</script>
Thank you!

Answer 1

Your code is working fine with jsonplaceholder api, make sure your API is working as expected.
var email = document.getElementById('email')
var formattedemail = email.value.replace(/\./, '-') //periods dont work as a path in the express server, so this changes the period to a hyphen.
var username = document.getElementById('username');
function myfunc() {
// temp data
formattedemail = "todos";
username.value = "1";
let fetchRes = fetch("https://jsonplaceholder.typicode.com/" + formattedemail + "/" + username.value);
fetchRes.then(res =>
res.json()).then(response => {
console.log(response);
})
}
<h1 align="center">Form</h1>
<input type="text" placeholder="person#email.com" id="email">
<br>
<input type="text" id="username" placeholder="person">
<br>
<button type="submit" onclick="myfunc()" id="demo">Click Me</button>