I Have an HTML Form. There Are 4 Questions. 3 Questions Radio, 1 Questions Text.
There Is A Production That Will Go To the Next Step When All The Buttons Are Clicked. But the Values Selected on the Radio Button Do Not Come to Me. The Form is Working With Webhook and Needs to Send Data to Integromat.
How Can I See the Values Clicked on the Radio Buttons?
When I Click on the Radio Buttons, I Can See the Next Question, But I Can't See the Values Coming from the Radio Buttons. Thank you.
Javascript:
$(document).ready(function() {
'use strict';
$('input[type=radio], input[type=checkbox]').on('click', function(e) {
e.preventDefault();
$(this).parents('.test-step').next().addClass('active');
$(this).parents('.test-step').removeClass('active');
})
$('.test-step .prev-btn').on('click', function(e) {
e.preventDefault();
$(this).parents('.test-step').prev().addClass('active');
$(this).parents('.test-step').removeClass('active');
})
})
HTML:
<form name="example-1" action="webhook" id="wrapped" method="POST">
<div class="covid-test-wrap test-step active">
<div class="test-progress">
<div class="test-progress-step">
<span class="step-number">1/4</span>
<svg>
<circle class="step-4" cx="30" cy="30" r="28" stroke-width="4" fill="none" role="slider" aria-orientation="vertical" aria-valuemin="0" aria-valuemax="100" aria-valuenow="50"></circle>
</svg>
</div>
</div>
<h3>Kaç Çalışanınız Var?</h3>
<div class="step-block">
<div class="row">
<div class="col-sm-6">
<div class="form-group">
<input type="radio" name="calisan-sayisi" onclick="getVals(this, '1-2');" value="1 - 2" class="form-control" id="1 - 2">
<label for="1 - 2">1 - 2</label>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<input type="radio" name="calisan-sayisi" value="3 - 4" class="form-control" id="3 - 4">
<label for="3 - 4">3 - 4</label>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<input type="radio" name="calisan-sayisi" value="5 - 19" class="form-control" id="5 - 19">
<label for="5 - 19">5 - 19</label>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<input type="radio" name="calisan-sayisi" value="20 - 49" class="form-control" id="20 - 49">
<label for="20 - 49">20 - 49</label>
</div>
</div>
<div class="col-sm-12">
<div class="form-group">
<input type="radio" name="calisan-sayisi" value="50 +" class="form-control" id="50 +">
<label for="50 +">50 +</label>
</div>
</div>
<a href="#" class="button">Sonraki</a>
</div>
</div>
</div>
<div class="covid-test-wrap test-step">
<div class="test-progress">
<a href="#" class="prev-btn"><img src="images/arrow-left-grey.png" alt="">Önceki</a>
<div class="test-progress-step">
<span class="step-number">2/4</span>
<svg>
<circle class="step-5" cx="30" cy="30" r="28" stroke-width="4" fill="none" role="slider" aria-orientation="vertical" aria-valuemin="0" aria-valuemax="100" aria-valuenow="50"></circle>
</svg>
</div>
</div>
<h3>Mevcut Yemek Gideri Çözümünüz Hangisi?</h3>
<div class="step-block">
<div class="row">
<div class="col-sm-6">
<div class="form-group">
<input type="checkbox" name="cozum" value="Elden Nakit Ödeme Yapılıyor" class="form-control" id="Elden Nakit Ödeme Yapılıyor">
<label for="Elden Nakit Ödeme Yapılıyor">Elden Nakit Ödeme Yapılıyor</label>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<input type="checkbox" name="cozum" value="İş Yerinde Mutfağımız Var" class="form-control" id="İş Yerinde Mutfağımız Var">
<label for="İş Yerinde Mutfağımız Var">İş Yerinde Mutfağımız Var</label>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<input type="checkbox" name="cozum" value="Catering Hizmeti Alıyoruz" class="form-control" id="Catering Hizmeti Alıyoruz">
<label for="Catering Hizmeti Alıyoruz">Catering Hizmeti Alıyoruz</label>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<input type="checkbox" name="cozum" value="Anlaşmalı Restoranda Yiyoruz" class="form-control" id="Anlaşmalı Restoranda Yiyoruz">
<label for="Anlaşmalı Restoranda Yiyoruz">Anlaşmalı Restoranda Yiyoruz</label>
</div>
</div>
<div class="col-sm-12">
<div class="form-group">
<input type="checkbox" name="cozum" value="Yemek Kartı, Kuponu Kullanıyoruz" class="form-control" id="Yemek Kartı, Kuponu Kullanıyoruz">
<label for="Yemek Kartı, Kuponu Kullanıyoruz">Yemek Kartı, Kuponu Kullanıyoruz</label>
</div>
</div>
<a href="#" class="button">Sonraki</a>
</div>
</div>
</div>
<div class="covid-test-wrap test-step">
<div class="test-progress">
<a href="#" class="prev-btn"><img src="images/arrow-left-grey.png" alt="">Önceki</a>
<div class="test-progress-step">
<span class="step-number">3/4</span>
<svg>
<circle class="step-5" cx="30" cy="30" r="28" stroke-width="4" fill="none" role="slider" aria-orientation="vertical" aria-valuemin="0" aria-valuemax="100" aria-valuenow="50"></circle>
</svg>
</div>
</div>
<h3>Talebinizi Hangisi En Doğru İfade Eder?</h3>
<div class="step-block">
<div class="row">
<div class="col-sm-6">
<div class="form-group">
<input type="radio" name="talep" value="Kurumsal Firma Başvurusu" class="form-control" id="Kurumsal Firma Başvurusu">
<label for="Kurumsal Firma Başvurusu">Kurumsal Firma</label>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<input type="radio" name="talep" value="Restoran, Cafe, Market Başvurusu" class="form-control" id="Restoran, Cafe, Market Başvurusu">
<label for="Restoran, Cafe, Market Başvurusu">Restoran, Cafe, Market</label>
</div>
</div>
<div class="col-sm-12">
<div class="form-group">
<input type="radio" name="talep" value="Bireysel, Kamu Görevlisi Başvurusu" class="form-control" id="Bireysel, Kamu Görevlisi Başvurusu">
<label for="Bireysel, Kamu Görevlisi Başvurusu">Bireysel, Kamu Görevlisi</label>
</div>
</div>
<div class="col-sm-12">
<div class="form-group">
<input type="radio" name="talep" value="Diğer" class="form-control" id="Diğer">
<label for="Diğer">Diğer</label>
</div>
</div>
<a href="#" class="button">Sonraki</a>
</div>
</div>
</div>
<div class="covid-test-wrap test-step">
<div class="test-progress-step">
<span class="step-number">4/4</span>
<svg>
<circle class="step-8" cx="30" cy="30" r="28" stroke-width="4" fill="none" role="slider" aria-orientation="vertical" aria-valuemin="0" aria-valuemax="100" aria-valuenow="50"></circle>
</svg>
</div>
<h3>İletişim Bilgileriniz</h3>
<div class="step-block">
<div class="row">
<div class="col-sm-6">
<div class="form-group">
<input type="text" class="form-control" name="ad-soyad" placeholder="Adınız Soyadınız" required>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<input type="text" class="form-control" name="telefon" placeholder="Telefon Numaranız" required> <!-- error class: has-error -->
<!-- <span class="error-msg">This field is required!</span> -->
</div>
</div>
<div class="col-sm-12">
<div class="form-group">
<input type="text" class="form-control" name="firma" placeholder="Firma Adınız" required> <!-- error class: has-error -->
<!-- <span class="error-msg">This field is required!</span> -->
</div>
</div>
<div class="col-sm-12">
<div class="form-group">
<input type="text" class="form-control" name="e-posta" placeholder="E - Posta Adresiniz" required> <!-- error class: has-error -->
<!-- <span class="error-msg">This field is required!</span> -->
</div>
</div>
<button class="submit" data-toggle="modal" data-target="#terms-txt1">Gönder</button>
</div>
</div>
</form>
