Как отправить форму на Select Change
У меня есть следующий вид. Я бы хотел, чтобы он был отправлен автоматически через jQuery, когда пользователь делает выбор, не нажимая кнопку отправки. Как это сделать?
<form action="" method="post">
<select name="id" id="cars">
<option value="">Choose</option>
<option value="1">Toyota</option>
<option value="2">Nissan</option>
<option value="3">Dodge</option>
</select>
<input type="submit" name="submit" value="Submit">
</form>
adeneo, я попробовал ваше предложение, но он все еще не работает. Вот полный код, что-то не так?
<!doctype html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#cars').on('change', function() {
this.form.submit();
});
});
</script>
</head>
<body>
<form action="" method="post">
<select name="id" id="cars">
<option value="">Select...</option>
<option value="1">Toyota</option>
<option value="2">Nissan</option>
<option value="3">Dodge</option>
</select>
<input type="submit" name="submit" value="Submit">
</form>
</body>
</html>
Ответы
Ответ 1
В вашей форме отсутствует значение действия, что предотвращает отправку формы в конце. Но в середине вы должны исправить этот код:
$(document).ready(function() {
$('#cars').on('change', function() {
document.forms[myFormName].submit();
});
});
Вы также можете отправить форму путем запуска события нажатия кнопки отправки:
$(document).ready(function() {
$('#cars').on('change', function() {
var $form = $(this).closest('form');
$form.find('input[type=submit]').click();
});
});
Ответ 2
В моем случае это работает отлично, и оно работает с кнопкой или без кнопки отправки.
<form action="" method="post">
<select name="id" id="cars">
<option value="">Choose</option>
<option value="1">Toyota</option>
<option value="2">Nissan</option>
<option value="3">Dodge</option>
</select>
</form>
<script type="text/javascript">
jQuery(function() {
jQuery('#car').change(function() {
this.form.submit();
});
});
</script>
Ответ 3
даже вы можете сделать это:
<form action="" method="post">
<select name="id" id="cars">
<option value="">Choose</option>
<option value="1">Toyota</option>
<option value="2">Nissan</option>
<option value="3">Dodge</option>
</select>
<input id='submit' type="submit" name="submit" value="Submit">
$(document).ready(function() {
$('#cars').on('change', function() {
$('#submit').click();
});
});
Ответ 4
Я знаю, что это немного устарело (и уже ответили), но ни один из ответов не был столь гибким, как я хотел, так что ниже это решение, в котором я закончил:
$(document).ready(function() {
$('#cars').change(function() {
var parentForm = $(this).closest("form");
if (parentForm && parentForm.length > 0)
parentForm.submit();
});
});