Robert Granlund
asked on
Javascript to populate the input value of a hidden text field
With javascript, is there a way to have a hidden input field and have that value be populated by a handful of other input fields. So I had a list of of first and last name inputs and there are three sets of fields that each have a different first and last name. Can I then, on submit take those six names and comma separated them into the value of a hidden input?
So I guess the first and last name will be an array because there may be endless first and last names.
So I guess the first and last name will be an array because there may be endless first and last names.
<input type ="text" class="first-name-1" name ="first-name[ ]" value="" />
<input type ="text" class="last-name-1" name ="last-name[ ]" value="" />
<input type ="text" class="first-name-2" name ="first-name[ ]" value="" />
<input type ="text" class="last-name-2" name ="last-name[ ]" value="" />
<input type ="text" class="first-name-3" name ="first-name[ ]" value="" />
<input type ="text" class="last-name-3" name ="last-name[ ]" value="" />
<input type="hidden" id="name" name="name" value="" />
<script>
$('#name').attr('value', $('.first-name').valuel() + $('.last-name').valuel() );
ASKER
I should actually be like this because the fields are added dynamically. You can add as many first and last names as you want. I need to make the following work because all of the classes are the same.
<input type ="text" class="first-name" name ="first-name[ ]" value="" />
<input type ="text" class="last-name" name ="last-name[ ]" value="" />
<input type ="text" class="first-name" name ="first-name[ ]" value="" />
<input type ="text" class="last-name" name ="last-name[ ]" value="" />
<input type ="text" class="first-name" name ="first-name[ ]" value="" />
<input type ="text" class="last-name" name ="last-name[ ]" value="" />
Here you go:
var $first = $(".first-name"),
$last = $(".last-name"),
tmpArray = [];
for (var i = 0; i < $first.length; i++){
tmpArray.push($first[i].value + " " + $last[i].value);
}
$("#name").val(tmpArray.join(","));
My question is why do you want to do this?
If you are sending your form data to a processing script - it will have access to the first name data - what is the specific requirement of putting a generated value in a hidden field when that can be derived from the other data in the form?
Bearing in mind that you have to validate the data on the server anyway given that browser data can be tampered with and therefore cannot be trusted.
If you are sending your form data to a processing script - it will have access to the first name data - what is the specific requirement of putting a generated value in a hidden field when that can be derived from the other data in the form?
Bearing in mind that you have to validate the data on the server anyway given that browser data can be tampered with and therefore cannot be trusted.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Open in new window
Note: For the final code see if you can just define a class for the target inputs, so you can grab all the names based on the 'DOM order with just a simple code.