We Keep Coding

How can I keep a clean url when using a form when using javascript and react?

I'm making this form that, for now, redirects, a user to another page after submitting a form. However, after the user is redirected, the form fields pop up in the url. I'm a beginner and I was wondering on how I can keep the url path to just what I specified in the "action" attribute of the form. Here's my code
<div>
<form action="/test">
<input type="text" name="login-username" id="login-username" placeholder="Username" />
<input type="password" name="login-password" id="login-password" placeholder="Password" />
<input type="submit" name="login-submit-button" id="login-submit-button" />
</form>
</div>
After clicking the button, the url looks like this:
http://localhost:3000/test?login-username=&login-password=&login-submit-button=Submit
How can I keep it to just
http://localhost:3000/test

As mentioned clearly in this answer, default method of form on submit is GET with encoding of type x-www-form-urlencoded, which basically appends input data to the current URL.
Using method POST appends form-data inside the body of the HTTP request (data is not shown in URL).

How to link to another page in javascript?

So I am having trouble linking from one page to another in JavaScript. I have the following code.
I am trying to call when users click submit. Below is the form I want users to fill out. I am trying to get to feed.html when users click submit.
function login(){
window.location="feed.html";
}
<form>
<p>Username</p>
<input type="text" name="" placeholder="Enter Username" value="">
<p>Password</p>
<input type="password" name="" placeholder="Enter Password">
<input type="submit" name="" value="Login" onClick="login()">
Lost your password?<br>
Don't have an account?
</form>
So I thought it would simply call the function and go to the feed page after clicking submit, but instead it does nothing. Does anyone see what the problem is?

Submitting a form navigates to the page that is the response to the form submission.
Assigning a URL to location navigates to that URL.
So:
Your JavaScript runs
The JS starts navigation to feed.html
The form submits
The form navigates to the current URL (since you didn't specify an action) instead.
The navigation in step 4 replaces the navigation in step 2.
Your options:
Don't use a submit button
Call preventDefault to prevent the default action of clicking on a submit button
Set an action instead of using JavaScript
The last of these choices is probably the sensible one. You have what appears to be a login form. Handling all the authentication logic that decides if the user can login or not inside the browser (which is under the control of the user) instead of on the server is a huge no-no.

You should maybe use the "action" attribute on your form tag.
<form action="feed.html">
...
</form>
This will submit your form and redirect to feed.html.

Parsley.js 2.0.2 require not working, but other validation works

Since this has already wasted a day and a half of my life, I am bringing it to the community someone can save me while I still have some hair left to pull out.
I am attempting to use parsley.js and it actually works for the most part, except when I simply want to do something as basic as requiring that a field has ANY value.
I know that Parsley.js is loading, and I know its working, because for example, if its looking for an email address, and I add one character to the field and submit it, the form stops the submit and correctly outputs an error message indicating I must have an email in the field. As I type an email, the validation works and turns green as soon as a valid email is recognized. So it works just fine for that part. The problem is that despite me indicating that the field is required, parsley seems to let the form submit if there is no value in the field. I would like it to throw an error if the field is blank, thats the part thats not working. But even putting one character in the field causes the rest of the validation to work, but a blank field slides right through. Please let me know any ideas you all have.
<form role="form" action="" method="POST" class="parsley-validate">
<div class="form-group">
<label>Email:</label>
<input type="text" data-parsley-require="true" data-parsley-type="email" class="form-control">
</div>
<button type="submit" class="btn btn-success">Submit</button>
</form>
Seems basic enough right? I can not possibly figure out why the require is not working. Maybe someone with more parsley experience can help me out with a trick that I am not seeing.
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="parsley.min.js"></script>
<script>
$('.parsley-validate').parsley();
</script>
Obviously I call parsley on the form as well & load jquery, like I said, if i add a character in the field it will validate. But for some reason if the field is empty it goes through.

You have a typo - the attribute should be "data-parsley-required" not "data-parsley-require". You can find working example here http://jsfiddle.net/2p7Pz/
<form role="form" action="" method="POST" class="parsley-validate">
<div class="form-group">
<label>Email:</label>
<input type="text" data-parsley-required="true" data-parsley-type="email" class="form-control" />
</div>
<button type="submit" class="btn btn-success">Submit</button>
</form>

Auto-submit form through Grease-Monkey

I have been using different script for auto submitting form like:
document.getElementsByTagName('form')[0].submit();
But all these refresh for endless time without submitting the form. I tried using alert statement which worked fine but still the form was not submitted.
<form id="level" method="post">
<br/>
<label for="answer">Answer:</label>
<input type="text" name="answer" id="answer" />
<input type="submit" name="submit" id="submit" value="Submit" />
</form>

.
With all your questions, I could try another conclusion.
If you're trying to make a brute-force attempt to retrieve a password, the server could have identified your ip and just stall your request because you've tried too often. Or even notice you're inhumanly fast with your request. These kind of things are a base defense against brute-force attacks.
The code should work fine.
Another guess could be that the page actually does something different when clicking that button, in stead of the normal submit. So you could try simulating a click on the button in stead of submitting the form directy.
$('#submit').click();

that line of code is right, maybe it is DOM issue, there is another <form> before or something else
you can try to access by ID
or jQuery :
$("#level").submit();

Submit a Form to a new Tab more than once

I am trying to build a simple form for sending a newsletter:
<form method="post" id="newsletter_form" action="">
<label for="subject">Newsletter Subject:</label><br/>
<input type="text" name="subject" class="textField large" id="subject" /><br/><br/>
<label for="contents">Newsletter Contents:</label><br/>
<textarea class="textField" rows="6" cols="40" name="contents" id="contents"></textarea>
</form>
And then two buttons, one of them sets the action to a preview page, and target to _blank, to open in a new tab, and then the other button sets another action, and removes the target, so that it submits normally and sends out the newsletter. However, hitting the preview button only works once in Chrome/Safari.
I have searched, and found out that this is a bug in Chrome and Safari. However, I am trying to bypass this by creating another form using jQuery, with a different ID, removing the first form, and making the preview submit that second form. This still doesn't work. It works for IE and Firefox, just not in Webkit based browsers.
Is there any way to get around this?

This seems to work for webkit. Not sure how it will work for IE.
$("#newsletter_form").submit(function(){
$("#newsletter_form").submit();
});