We Keep Coding

Turn off autoComplete for all inputs in React app

This answer explains how to turn off autocomplete for an entire HTML document with jQuery.
Without jQuery is there a way to turn "off" React's equivalent autoComplete for all inputs within the app?
I'm not very familiar with jQuery otherwise I'd try to convert the function myself.

To disable the autocomplete for input fields in React, we need to set the input field’s autoComplete attribute to "new-password".
<input type="email" name="email_signup" placeholder="Email" autoComplete="new-password" />
<input type="password" name="password_signup" placeholder="Password" autoComplete="new-password" />
This will turn off autocomplete for input.

You can use autocomplete="off" on the parent level of the form and that will turn it off for the entire form
<form method="post" action="/form" autocomplete="off">
[…]
</form>

use this in elements:
autoComplete:'off'

You can do it with
<input name="myinput" placeholder="enter your name" value={this.input.myinput} autocomplete="off" />

The post that you are linking is just assigning the autocomplete off attribute to the document when it is loading. You can accomplish what jQuery is doing with something like the following using vanilla JS. However, I would suggest a more "React" way of doing things based on whatever logic you wish to accomplish.
var foo = document.querySelector("input");
foo.setAttribute("autoComplete", "off");

Executing javascript present in the value field of inputs - JavaScript

I have a form in html:
<form name="foo" action="http://localhost:3000/my_url" method="POST">
<input type="text" name="username" value="alert('hello')" >
</form>
I need to get that JavaScript in the value field for the input to execute, but only through the form's submit. The reason is that page is a template so I don't control it (can't have
<script>
var input = document.getElementsByName("username");
</script>
or any other <script>tag added to the page. I'm trying to prove that's possible an attack to take place over malformed <input> fields, specially using templates.
How can I have that Javascript to execute on the form submission? Remember I'm not allowed to modify the page content except for that piece.
Since I'm doing a POST that form, I can set the <input> field (and only the <input> field) to whatever I want.
I could do
username=<script>alert('hello')<script>
<input type="text" name="username" value="<script>alert('hello')<script>" >
or
username=window.onload = function() { alert('hello') }
<input type="text" name="username" value="window.onload = function() { alert('hello') }" >
I have thought about doing a
username=document.forms['myform'].onsubmit() = function() { alert('hello') }
<input type="text" name="username" value="document.forms['myform'].onsubmit() = function() { alert('hello') }" >
All of those are valid. However I need to get the Javascript in the tag to execute. How can I do that? The security flaw is how the` tag can be exploited if not properly sanitized. As per #guest271314 "requirement include adding tag ..."

When you use a template engine to render html content the server normally sanitize and escape it to prevent passive injection of cross site scripts or XSS for short.
Such attack can be easily achieved on a server that does not enforce the previously mentioned security measures by posting malformed content that will happily be rendered later by the template engine.
For example a form that sends user input
<form name="foo" action="http://localhost:3000/my_url" method="POST">
<input type="text" name="username" value="" >
</form>
If the user sends something like "><script>alert('foo')</script> and later you display this input in another form
<form name="bar" action="http://localhost:3000/my_other_url" method="POST">
<input type="text" name="username" value="#template_engine_render(posted_username_value)#" >
</form>
The resulting output will be
<form name="bar" action="http://localhost:3000/my_other_url" method="POST">
<input type="text" name="username" value="">
<script>alert('foo')</script>
</form>
Because the "> caracters close the input tag and you will end up executing arbitrary user javascript code in your page.
This is why "Never trust user input" is one of the most basic security rules of the web.

Try utilizing Function
Note, submission of form at stacksnippets appear blocked; substituted click event for submit event; i.e.g., click on input at stacksnippets for value of input to be called as parameter to Function.
document.forms["foo"].onclick = function(e) {
Function(this.children[0].value)()
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form name="foo" action="" method="POST">
<input type="text" name="username" value="alert('hello')" >
</form>

form validations drop ng-model objects?

Say I have the following form:
<form>
<input type="text" required ng-model='myValue' ng-maxlength='5'></input>
{{myValue}}
{{myValue.length}}
</form>
When the length of the text in the input exceeds the maxlength, the model becomes empty. Is there any way to prevent this behaviour while applying this validation, without rolling a custom form level validator?

at first, input element no end mark(</input), the correct like this:<input name="test" type="text"/>
you can handle form.test.$error.maxlength to deal something, example code:
<form name="form">
<input name="name" type="text" required ng-model='myValue' ng-maxlength='5'/>
<div>value:{{myValue}}</div>
<div>length:{{myValue.length}}</div>
<div>validate:{{form.name.$error.maxlength}}</div>
</form>
According your means, the invalid value lead to null model, I think this is no problem.

How can I force a form to submit using JavaScript when a person hits the space bar in the input field?

Is that possible? Google searches are leading me nowhere.
My Sample form:
<form action="search.asp" method="post" name="form1">
User ID <input type="text" size="15" name="userid"><p>
Last Name <input type="text" size="15" name="lastname"><p>
School <input type="text" size="15" name="school"><p>
District <input type="text" size="15" name="district"><p>
Email <input type="text" size="20" name="email"><p>
<input type="submit" value=" Go Search! ">
</form>
This needs to work from any input box on the form. I tried onkeyUP but wouldn't work or I probably wrote it wrong. I am no javascript expert. Any ideas?

I don't know why you'd do this, but in Firefox, you would write:
<form action="search.asp" method="post" name="form1" onkeydown="if(event.keyCode == 32) this.submit(); return false;">
Check here to see how to retrieve other browsers' key codes.
Again, this is how you would do it, but I think it's a bad idea.

The whole form to submit whenever a space is detected by may be a little messy, but what's interesting is to do it for a specific input. I used it in a field where user gives some tags. Each tag must de only one word,and so the space character can be used as an event to store the given tag and wait for the next.
<input type="text" id="tagtextbox" onKeyUp="if(event.keyCode == 32) myfunction();" />

How to skip fields using javascript?

I have a form like this:
<form name="mine">
<input type=text name=one>
<input type=text name=two>
<input type=text name=three>
</form>
When user types a value in 'one', I sometimes want to skip the field 'two', depending on what he typed. For example, if user types '123' and uses Tab to move to next field, I want to skip it and go to field three.
I tried to use OnBlur and OnEnter, without success.
Try 1:
<form name="mine">
<input type=text name=one onBlur="if (document.mine.one.value='123') document.three.focus();>
<input type=text name=two>
<input type=text name=three>
</form>
Try 2:
<form name="mine">
<input type=text name=one>
<input type=text name=two onEnter="if (document.mine.one.value='123') document.three.focus();>
<input type=text name=three>
</form>
but none of these works. Looks like the browser doesn't allow you to mess with focus while the focus is changing.
BTW, all this tried with Firefox on Linux.

Try to attach tabindex attribute to your elements and then programmaticaly (in javaScript change it):
<INPUT tabindex="3" type="submit" name="mySubmit">

You could use the onfocus event on field two, which will be called when it receives focus. At that point, field 1's value should be updated and you can perform your check then.

If you used the method you describe, and they worked, the focus would also change when the user clicks on the field, instead of tabbing to it. I can guarantee you that this would result in a frustrated user. (Why exactly it doesn't work is beyond me.)
Instead, as said before, change the tabindex of the appropriate fields as soon as the content of field one changes.

<form name="mine">
<input type="text" name="one" onkeypress="if (mine.one.value == '123') mine.three.focus();" />
<input type="text" name="two">
<input type="text" name="three">
</form>

Try onkeypress instead of onblur. Also, on the onfocus of field two is where you should be sending to three. I'm assuming you don't want them typing in two if one is 123 so you can just check that on two's onfocus and send on to three.