<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title></title>
<style>
</style>
</head>
<body>
<table>
<tbody>
<!--шапка-->
<tr>
<th>
<select id="column_1" class="product-fields">
<option id="opt_1" selected="selected">opt_1</option>
<option id="opt_2">opt_2</option>
<option id="opt_3">opt_3</option>
<option id="opt_4">opt_4</option>
</select>
</th>
<th>
<select id="column_2" class="product-fields">
<option id="opt_1" selected="selected">opt_1</option>
<option id="opt_2">opt_2</option>
<option id="opt_3">opt_3</option>
<option id="opt_4">opt_4</option>
</select>
</th>
<th>
<select id="column_3" class="product-fields">
<option id="opt_1" selected="selected">opt_1</option>
<option id="opt_2">opt_2</option>
<option id="opt_3">opt_3</option>
<option id="opt_4">opt_4</option>
</select>
</th>
</tr>
<!--тело-->
<tr>
<td>Ячейка 1
<input type="hidden" name="" class="column_1" value="ячейка_1" />
</td>
<td>Ячейка 2
<input type="hidden" name="" class="column_2" value="ячейка_2" />
</td>
<td>Ячейка 3
<input type="hidden" name="" class="column_3" value="ячейка_3" />
</td>
</tr>
<tr>
<td>Ячейка 1
<input type="hidden" name="" class="column_1" value="ячейка_1" />
</td>
<td>Ячейка 2
<input type="hidden" name="" class="column_2" value="ячейка_2" />
</td>
<td>Ячейка 3
<input type="hidden" name="" class="column_3" value="ячейка_3" />
</td>
</tr>
<tr>
<td>Ячейка 1
<input type="hidden" name="" class="column_1" value="ячейка_1" />
</td>
<td>Ячейка 2
<input type="hidden" name="" class="column_2" value="ячейка_2" />
</td>
<td>Ячейка 3
<input type="hidden" name="" class="column_3" value="ячейка_3" />
</td>
</tr>
</tbody>
</table>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$(document).ready(function() {
alert('Скрипт загружен');
$('table').on('change', '.product-fields', function() {
var optionId = $(this).children(':selected').attr('id'),
parentId = $(this).attr('id');
$('input.' + parentId).each(function() {
$(this).attr('name', optionId);
});
});
});
</script>
</body>
</html>