I have a search engine with a backend in GoLang & Buffalo, I'm new to web programming, and I'm sure this is a stupid problem. I have a nav-bar with a search bar, and another search bar in the body. The nav-bar is an embedded html (plush partial).
The search.html's form works flawlessly, but the nav-bar's submit button doesn't do anything.
have the following code:
<!-- search.plush.html -->
<html>
<body>
<div>
<%= partial("header.html") %>
</div>
...
<div>
<form action="/results" method="GET">
<input id="text" for="mainsearch" inputmode="latin" placeholder="Search words or phrases">
<div role="group">
<button name="type" value="word" type="submit">Word Search</button>
<button name="type" value="phrase" type="submit">Phrase Search</button>
</div>
</form>
</div>
...
</body>
</html>
And
<!-- _header.plush.html -->
<div>
<form action="/results" method="GET">
<input id="text" for="mainsearch" inputmode="latin" placeholder="Search words and phrases">
<div role="group">
<button name="type" value="general" type="submit">
<i class="ion-search"></i>
</button>
</div>
</form>
</div>
I embed _header.html in every other html, and it doesn't work anywhere. I think it's more of a html's problem rather than plush's, but I can't find information about this..
EDIT: I've found using the developer console on Chrome, that <form> and </form> in _header.plush.html are gone after being rendered.
From what I saw, the value in the input is not going to be sent to the server since there isn't a name tag for that input.
The name attribute is used to reference elements in a JavaScript, or to reference form data after a form is submitted.
Note: Only form elements with a name attribute will have their values passed when submitting a form.
It is a good practice to get your html output validated. https://validator.w3.org/