How to submit form using radio option
Question
I'm doing my website in Safari. It works well in Safari, Firefox and Chrome. But in Explorer it's not working properly. Here I want to submit a form and direct to another page when a radio option is clicked. I have used onChange="this.form.submit(); in the input. But it does not work in Explorer. Please suggest me a solution. I have tried query too. But that's also not working. I have attached the code below.
<script src="https://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript" language="javascript">
(function(document, window, $, undefined) {
var form = $('#form-id');
$('.radio-class').each(function(i, element) {
var radio = $(element);
radio.on('change', function() {
// selected value
var radioValue = $(this).val();
form.submit();
});
});
}(document, window, jQuery, undefined));
</script>
<body>
<form action="go.php" method="post" id="form-id">
<label for="radio-select"><input type="radio" name="radio-select" value="Mango" class="radio-class">Mango</label>
<label for="radio-select"><input type="radio" name="radio-select" value="Apple" class="radio-class">Apple</label>
<label for="radio-select"><input type="radio" name="radio-select" value="Pinaple" class="radio-class">Pinaple</label>
</form>
</body>
1 answers
solution1
2 2015-08-05 11:04:37
Try this way:
<script>
$(document).ready(function(){
var form = $('#form-id');
$('.radio-class').each(function(i, element){
var radio = $(element);
radio.on('change', function(){
// selected value
var radioValue = $(this).val();
form.submit();
});
});
});
</script>
The code inside $(document).ready() will be executed after the DOM is fully loaded. This way, the .radio-class elements will exist when the listener for the change event is added.
It's explained better here .
This is another example with a simplified loop:
$(document).ready(function(){
var form = $('#form-id');
$('.radio-class').on('change', function(){
form.submit();
});
});
And this is with the shorthand for $(document).ready()
$(function(){
var form = $('#form-id');
$('.radio-class').on('change', function(){
form.submit();
});
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.