Develop Reference

How to use getElementById on a link to pick up textfield value

I want use document.getElementById('YourElementId') to pick up the Textfield value and then send it to another page called request.php as URL parameter.
Example, if i type (3) on the Textfiled and click submit, the Link will pick up the form variable as url parameter just like the folowing (.../requst.php?=id=3) Onsubmit.
Bellow is my textfield and the submit link/button but it doesnt work. Someone please help me.
<input name="consigno" type="text" id="YourElementId" value="3">
ENTER

Actually you can do this by using html form. This will do same thing.
<form method="GET" action="remote.php">
<input name="nav" id="YourElementId" type="text" value="3">
<input type="submit" value="ENTER">
</form>

Submit a standard HTML form with React input fields

Sometimes I just want to submit a "normal" form, but have the input fields in React (of styling reasons).
But the form doesn't seem to "see" the values of the input fields when submitting.
<form action="comments" method="post">
<label>
Name:
<input
className={styles.input}
defaultValue="Bob"
type="text"
ref={this.input} />
</label>
<input type="submit" value="Submit" />
</form>
Is there a way to accomplish something like the above, i.e. posting a form without having to create an onSubmit event handler that referes to every single field in the form?
Ps. I'm aware that the default React way is to include state, but that increases the boilerplate code even more.

use name tag in your input
e.g.
<input name="comment" type="text" defaultValue="Bob"/>

jQuery targeting selector by input type and form name

I want to target any input of text type belonging to a form of a specific name. Because the form will have numerous input fields, I don't want to target a particular input name, but rather, capture the blur (or focusout) event for any input[type="text"] occurring within the form wrap.
My present code, which doesn't work:
$( document ).ready(function() {
$('form[name="tax_form"] input[type="text"]').on("blur",function() {
alert($(this).val());
});
});
I answered my own question. Because the code sample is essentially correct, there is no need for multiple people to try to solve the unsolvable. The problem had something to do with where I placed the javascript code, and nothing to do with structure or syntax of the code, itself.

The way the event "change" works is what it sounds like you want. An event handler doesn't actually fire when the input is clicked or if text is keyed in, it fires when text is entered and then the input loses focus.
In the following Snippet the same selector you are using is delegated to the "change" event. You'll notice that the ['tax_form'] has 4 text inputs yet the last one is the only one working. The reason is because if an input isn't assigned a type attribute, then by default type is 'text". So when using a selector based on an input's type="text", you must keep that in mind. So if you are in full control of your HTML, make sure that each input has a type attribute with an explicit value, or use classes which is better IMO.
SNIPPET
$(document).ready(function() {
$('form[name="tax_form"] input[type="text"]').on("change", function() {
alert($(this).val());
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form name='notIt'>
<fieldset>
<legend>Not a Tax Form</legend>
<input>
<input type="text">
<input>
<input type="text">
</fieldset>
</form>
<br/>
<br/>
<form name='stillNotIt'>
<fieldset>
<legend>Still not a Tax Form</legend>
<input type="text">
<input>
<input type="text">
<input>
</fieldset>
</form>
<br/>
<br/>
<form name='tax_form'>
<fieldset>
<legend>Tax Form</legend>
<input class='klass' value='TEXT INPUT BY DEFAULT'>
<input value='TEXT INPUT BY DEFAULT'>
<input name='text' value='TEXT INPUT BY DEFAULT'>
<input type='number'>
<input type='text' value='THIS ONE COUNTS'>
</fieldset>
</form>

Previous commentators were right, that my code was fine as-is. I took my selector code out of a header script file, and placed it at the bottom of my footer script, and it worked as expected.
In the end, it wasn't my code that was the problem, but rather something to do with where I placed it. Possibly other javascript or jQuery code stepping on it.

Your code should work fine. Here's a working example of it to prove it's working. The tax_form fields should console.log() on blur. The another_form should not.
$(function() {
$('form[name="tax_form"] input[type="text"]').on("blur",function() {
console.log($(this).val());
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1>Tax Form</h1>
<form name="tax_form">
<input type="text" name="first" value="first">
<input type="text" name="second" value="second">
<input type="text" name="third" value="third">
</form>
<h1>Another Form</h1>
<form name="another_form">
<input type="text" name="first2" value="first2">
<input type="text" name="second2" value="second2">
<input type="text" name="third2" value="third2">
</form>

How do I only validate against one specific button using ParsleyJS

I have applied ParsleyJS validation to a form that has multiple submit buttons that perform various tasks. I only want the validation to occur for one of the submit buttons, is this possible? if so, how?
For a pared down example:
<form name="aspnetForm" method="post" action="page.aspx" id="aspnetForm" data-validate="parsley">
<input type="text" id="text_for_example" data-required="true"/>
<input type="text" id="text_for_example2" data-required="true"/>
<input type="text" id="text_for_example3" />
<input type="submit" id="ClearsTheTextBoxes"/>
<input type="submit" id="SavesData" />
</form>
Ideally I want it to validate only on the "SavesData" submit, not on the "ClearsTheTextsBoxes". is this possible using ParsleyJS?
Thanks!
Note:
I cannot change the type any of the submit buttons to function differently; please do not suggest this. The "ClearsTheTextsBoxes" must remain a submit button.

to do so, you'll have to remove data-validate="parsley" from your form tag, and add a custom js function on click on the desired button. Then in this function, simply to a $('aspenetForm').parsley('validate');
Best

TypeError: e[h] is not a function

I've been using jquery 1.6 with no problem. Today I switched to jquery 1.8 and suddenly I am getting this error when trying to submit a form:
TypeError: e[h] is not a function.
Form:
<form method="post" action="login?login" name="login" id="login">
<input class="input" type="text" name="user_mail" id="user_mail" autocomplete="on" />
<input class="input" type="password" name="password" id="password" autocomplete="off" />
<a class="green_button" href="javascript:void(0)" id="login_button">Login</a>
<input type="submit" name="login" id="submit" style="visibility:hidden" />
</form>
<script language="javascript">
$("#login_button").click(function(){
$("#login").submit();
});
</script>
Am I missing something?
Thanks!

Remove the line below.
<input type="submit" name="login" id="submit" style="visibility:hidden" />
Update:
Or if you have to use the submit input, then you need to change the id submit to something else. The reason is that if you have an input element with id of submit, it will set a submit property to the form with the HTMLInputElement. So you could not call the .submit method on the HTMLFormElement.

I waster 3 hours trying to fix the same issue, I was using the name='submit' for my submit button and was calling $("#form_name").submit(); in a function and was getting the error. Sometimes small things I overlook end up wasting lot of time.

i think it's because the line
<input type="submit" name="login" id="submit" style="visibility:hidden" />
can you remove it and retry?

When we use a submit type element in a form, This element will be set as Submit property of the form. So one could not call the submit() function with other element of form.
There are two ways to do this. first one is just remove the line as given in first reply.
Or Use $("#submit").trigger("click"); instead of $("#login").submit();. and it will submit the form on pressing enter key word too.

Your form and input have the same name attribute value, login.
Change the name on the input to something else, like submit. This should clear up your error.

With jQuery 1.7 (possibly above too) if you have the name property also called submit it will break.
E.g.
<input type="submit" name="submit" value="Upload">
Will not work, however:
<input type="submit" name="sendSubmit" value="Upload">
Is fine.