Is there a simpler way of copying and pasting one inputs value into other input with the same name

Question

I am trying to write something that will copy the current <input>s value and enter it into any <input> that start with the same name.

<input> names will follow this pattern: price-0, price-1, price-2, upc-0, upc-1, upc-2.

So if a user enters a value in <input name="price-0"> and hits copy the value should be transferred over to all input whos name start with price

This is the code I've written:

$(document).on('click', '.--copy', function () {
 var input_name = $(this).closest('div').find('input').attr('name').split('-')[0];
 $('input[name^=' + input_name + ']').val($(this).closest('div').find('input').val());
});

A fiddle to make everyones life easier: http://jsfiddle.net/6jGLD/

I feel like there are too many selectors being called upon and the code is somewhat difficult to read.

• Jason P: It would probably be easier to give each related input an identical class. Other than that, I would do $input = $(this).closest('div').find('input') at the beginning of your function so you don't have to traverse the dom to find the input twice.

Answer 1

One minor improvement I can think of is to create a variable to hold the input element since the element is used twice like

$(document).on('click', '.--copy', function () {
 var $input = $(this).closest('div').find('input'), input_name = $input.attr('name').split('-')[0];
 $('input[name^=' + input_name + ']').val($input.val());
});

Demo: Fiddle

Answer 2

You can just grab the value of the first input put it in a variable and put that variable as the value of the second input for example

var value = $('input.firstInput').val();
 $('input.secondInput').val(value);

here is a jsfiddle http://jsfiddle.net/suyRd/

• Zaki Aziz: The HTML should not be changed in the fiddle