Как отправлять значение, после выбора select(a)?

Question

[rollex_x93]

Проблема такая, пользователь выбирает из списка материал и после этого из БД вытягиваются его параметры - так вот проблема в том, что значения не отправляю в пост.Если создать кнопки и повесить на нее событие отправить в пост, тогда все работает, но мне бы хотелось, чтобы пользователю не приходилось постоянно нажимать на кнопку, чтобы параметры выгружались из БД.

<script type="text/javascript">
	$('.material').on('change', function() {
  	var id_mat = this.value;
  	$(".id_mat").val(id_mat);
  	$.post("materials.php" , $("#materials").serialize());
	});
</script>

Comments

[Андрей Николаев]

Простите, но не очень понял то, чего Вы хотите достичь и что у Вас уже есть. Я так понимаю, что у Вас есть select-поле, и при выборе одного из значений Вам нужно подгрузить input[type=hidden] и автоматически отправить форму, так ?

[rollex_x93]

Андрей Николаев: верно,если сделать событие по клику на кнопку,то он передаёт значение в скрытый инпут,а мне нужно,чтобы работало по событие - выбора опции из селекта

Answer 1

[Евгений]

На одном из проектов было понаписано нечто похожее, и то ли скрипты перекрывали друг друга то ли еще что. В общем, пришлось примерно такое решение сделать. Может поможет.

$('select').change(function() {
	if ( navigator.userAgent.indexOf('Safari') != -1 && navigator.userAgent.indexOf('Chrome') == -1 ) {
		
		var selIndex = $(this).find('option:selected').index()+1;
		$(this)
		.find('option')
			.removeAttr('selected')
		.end()
		.find('option:nth-child('+selIndex+')')
			.attr('selected', 'selected')
		.end()
		.find('option:not(:nth-child('+selIndex+'))')
			.prop('selected', false)
		.end()
		.find('option:nth-child('+selIndex+')')
			.prop('selected', true)
	} else {
		var selIndex = $(this).find('option:selected').index()+1;
		$(this).find('option').removeAttr('selected').end().find('option:nth-child('+selIndex+')').attr('selected', 'selected');
		$(this).val($(this).find('option[selected="selected"]').val());
	}

	// $(this).val()
	$.ajax({
		url: '',
		data: {
			a: $(this).val()
		},
		// ...
	})
})