Develop Reference

Move data from on input field to another and submit form

I am trying to get one input field that is higher up the page, move it's content to a form field at the bottom of the page and submit the form.
Please see what I have done here (doesn't work):
$('#move_down').click(function() {
$('#input_1').val($('#input_2').val())
});
<input type="text" id="input_1" value="">
<br>
<button id="move_down">Click Here</button>
<br>
<input type="text" id="input_2" value="">
<script src="//code.jquery.com/jquery-3.2.0.js"></script>
Moving the data is just the first part, I am also trying to get it to take the user down to the main form and submit it - is this possible with jQuery?
Updated the question to fix my silly error of omitting the ID selectors. Just need to figure out how to submit the form now.

You are right; just correct your query selector:
$('#move_down').click(function() {
$('#input_2').val($('#input_1').val())
});
http://jsfiddle.net/82x28ryr/4/

Missing the # prefix for id selector
Works fine doing
$('#move_down').click(function() {
$('#input_2').val($('#input_1').val())
});
<input type="text" id="input_1" value="">
<br>
<button id="move_down">Click Here</button>
<br>
<input type="text" id="input_2" value="">
<script src="//code.jquery.com/jquery-3.2.0.js"></script>
As for "moving down" you have only provided html in demo for 2 inputs. You need to update question with all relevant html in order to implement additional features

PHP form Submit multiple values through one form field and append to array

I have php form that posts data to URL with single field, the problem is I can only submit one value. I have a barcode scanner that I want to be able to scan multiple serial number barcodes and submit the form. I probably need a javascript but I am not sure. See below
<?php
echo("Serial Number: " . $_POST['serial'] . "<br />\n");
?>
<form action="myform5.php" method="post">
<p>First name: <input type="text" name="serial" /></p>
<input type="submit" name="submit" value="Submit" />
</form>
So in other words, I want a form field where I can enter multiple serial numbers and be able to post the data to the URL. Since I am using barcode scanner which also submits enter key after each scan, so I want to be able to add multiple serials without touching the keyboard and when finished, should be able to click submit and it posts the data.
The SQL query would be something like this;
select * from hdds where serial IN ('5MQ3DJAA', '5MQ3DJAB', '5MQ3DJAC', '5MQ3DJAB', '5MQ3DJAR');
I dont want to use the textarea field, I cannot figure out how to have a single input type text field and have a add button next to it, when a serial number is scanned or entered, that number is added to list below, that number is shown below the field and serials keep adding up when done press the submit button that posts the data.
This is what I am looking to do, see below example.
I would appreciate a small working example?

If you need to enter multiple serial numbers then add serial number as an array values. Try this :
<?php
if(isset($_POST['submit'])){
echo "Serial Numbers";
echo "<br/>";
$serial = $_POST['submit'];
print_r($serial);
}
?>
<form action="myform5.php" method="post">
<p>serial number: <input type="text" name="serial[]" /></p>
<p>serial number: <input type="text" name="serial[]" /></p>
<p>serial number: <input type="text" name="serial[]" /></p>
<input type="submit" name="submit" value="Submit" />
</form>

How to add a hidden list of IDs to a form in Javascript?

I've got a simple form in html:
<form action="" method="post">
<input id="title" name="title" size="30" type="text" value="">
<input type="submit" value="Save this stuff">
</form>
I also have a file upload on the page, which handles uploads using ajax and adds the files to a mongoDB. The file upload returns the mongoDB id of the file (for example 12345) and I want to add that id to the form as a hidden field so that the id is POSTed to the server upon submitting the form. Since the user can add multiple files though, I want to add a list of id's to the form.
I found how I can add one hidden field to a form from javascript, but this always handles a single field, not a field with multiple values. So I thought of adding a checkbox field to the form so that I can submit multiple values in one element, but it kinda feels like a hack.
Can anybody hint me in the right direction on how I can add a hidden list of values to a form using Javascript? All tips are welcome!
[EDIT]
In the end I would like the form to look something like this:
<form action="" method="post">
<input type="hidden" name="ids" value="[123, 534, 634, 938, 283, 293]">
<input id="title" name="title" size="30" type="text" value="">
<input type="submit" value="Save this stuff">
</form>

I am not sure if I understand your question correctly, so I may just be guessing here.
Try adding multiple hidden inputs with a name such as ids[] so that they will be posted to the server as an array.
Example:
<form action="" method="post">
<input type="hidden" name="ids[]" value="123">
<input type="hidden" name="ids[]" value="534">
<input type="hidden" name="ids[]" value="634">
<input type="hidden" name="ids[]" value="938">
<input type="hidden" name="ids[]" value="283">
<input type="hidden" name="ids[]" value="293">
<input type="submit" value="Save this stuff">
</form>

Why not simply concatenating all the ids into a string like so "123,456,890,..etc" and then adding them as a value to ids inupt. When you need them, simply split by ',' which would give you an array with ids?
Todo so only with javascript something like this should work
var elem = document.getElementById("ids");
elem.value = elem.value + "," + newId;

Do you mean that for each time the user clicks the 'upload' button you need to add a hidden field to the form?
Can you post the entire form, that should clear things up...
[Edit]
you could store the id's in an Array, everytime an id should be added to the hidden field's value you could do somthing like:
$('#ids').attr('value', idArray.join());
I'm just typing this out of the box so excuse any little errors

HTML Submit buttons on forms reload but not lose data

Lets say I have this: http://jsfiddle.net/oh0omatq/2/
<form>
<input placeholder="my value">Country
<button name="subject" type="submit" value="england">England</button>
<button name="subject" type="submit" value="wales">Wales</button>
<br />Your country is: Wales
<input type="submit">
</form>
Can I use this submit buttons for england and wales to set a value within the form, and reload the form, but also not loose the information already entered in the form, such as in the input box.
This above is just a preview, but I want to be able to reload and filter the input elements in the form depending on the button the user clicked, but also not loose any previously entered data in the fields.

I would recommend using javascript for this. I've edited your fiddle to use an onclick function.
<form>
<input placeholder="my value">
Country
<button name="subject" value="england" type="button" onclick="document.getElementById('value').innerHTML = this.value">England</button>
<button name="subject" value="wales" type="button" onclick="document.getElementById('value').innerHTML = this.value">Wales</button><br />
Your country is: <span id="value">Wales</span>
<input type="submit">
</form>
Changing the buttons to a type="button" so they don't submit the form allows the javascript to edit the value. Ofcourse you can make an input out of the span, allowing the chosen value to be sent with the form. Ofcourse, a select box would work as well then.
Would that do what you want?
You can see the edited fiddle here.
Keep in mind, this is a quick sketch. It is not recommended to use javascript inline.

How can convert numbers to words on load event?

I did a javascript is working fine and translating numbers to words.
But is doing the action only when I do click on "CALCULATE" and want to show the translation without typing or doing click just assing the value
Here is the view
<form>
Number to words<BR>
<BR>Number/Número
<INPUT NAME="Number" TYPE="text" SIZE="60" value="123"><BR>
<INPUT NAME="Calc" TYPE="button" VALUE="Calculate" ONCLICK="Calculate(this.form)">
<INPUT NAME="Reset" TYPE="button" VALUE="Reset" ONCLICK="ClearForm(this.form)">
<BR>
Spanish<BR><TEXTAREA NAME="Spanish" ROWS="5" COLS="90"></TEXTAREA><BR>
</form>
Here is the demo http://jsfiddle.net/RQ7R4/13/
Somebody can help me with this?

The following will both 'translate' on load AND while you type -- but be careful, it can keep your browser too busy if you have a high number of form elements that have to be read:
$(function() {
$('input[name=Number]').on('keyup change blur',function() {
Calculate( this.form );
});
Calculate( $('form')[0] );
});
AMAZINGLY WORKING DEMO
I had to change the input element type from text to number so it can only respond to number -- some auto-validation of sorts:
<INPUT NAME="Number" TYPE="number" SIZE="60" value="123"><BR>

<INPUT NAME="Number" TYPE="text" SIZE="60" value="123" onchange="Calculate(this.form)">
If you tab out of the field it will call the Calculate function. I would suggest you explore jQuery or AngularJS if you require something advanced.