Can the ?# added in the URL by an input be avoided?

Question

I did this JS component but in some pages as codepen it crashes when I click submit because the the button adds a "?#" to the URL (running locally) and is like it changes to another page, this happens the first time I post a message, can be avoided? or is a normal thing of submit?

<div id = "typeSection">
<label for="message">Message:</label>
<form action="#" id="typeForm">
<label for="message"></label>
<textarea id= "character">0/280.</p>
<input type="submit" id = "addButton" value="Submit">

This is the component running in CodePen:

https://codepen.io/LeonAGA/pen/vroRBB

The final solution was sent the argument event of the submit listener to the function addMessage and cancel all action with the e.preventDefault(); — XaelGa, Oct 18 '18 at 07:02

Yang Daniel · Answer 1 · 2018-10-17T01:16:27.213

0

<form action="#" id="typeForm">

Action value might be the reason why adding # after the URL, try assign "" instead of # symbol

edited Oct 17 '18 at 01:16

answered Oct 17 '18 at 01:15

Yang Daniel

125
5

score 0 · Answer 2 · answered Oct 17 '18 at 01:15

0

when you add 'action="#"' in the form tag below:

<form action="#" id="typeForm">

it redirects the page to the current url with a "#" appended on to the end. If you put:

<form action="" id="typeForm">

you shouldn't have to worry about the "#" anymore.

answered Oct 17 '18 at 01:15

awohlford

9
1

The "less bad" method would be an `action="javascript:void(0);"`, which works wonders. – Ismael Miguel Oct 17 '18 at 01:33
1

Changing the form `action` will not stop this from re-loading the page on submit. – Phil Oct 17 '18 at 01:39

Can the ?# added in the URL by an input be avoided?

2 Answers2