JSFiddle - React, Tailwind, and code Playground

by ggChris

HTML

<!-- This input gets submitted successfully-->
<p>
    <strong>Check this option</strong>
    <input type="radio" value="" class="qwerty" id='radio29_7' name='other'>
</p>

<p id="other_lang">
    <strong>Define the other languages you use?</strong>
    <input type="text" value="" class="rad" id='radio29_7' name='other'>
</p>

<!-- This input doesn't submit and are always empty-->
<p id="visualstudio"> 
    <strong>How many licenses do you have?</strong>
    <input type="text" value="3" class="rad" id='radio77_8' name='lqvs'>
</p>

<!-- This input doesn't submit and are always empty-->
<p id="os"> 
    <strong>For which operating systems?</strong>
    <input type="text" value="Windows" class="rad" id='radio77_9' name='lqos'>
</p>

<!-- This input doesn't submit and are always empty-->
<p id="ms"> 
    <strong>Would you be willing to explore building some aspects of your technology on the Microsoft platform?</strong>
    <input type="text" value="Yes" class="rad" id='radio77_10' name='lqms'>
</p>

JavaScript

var langformData = {
    'lq1'  : $('input.lang:checked').serialize().replace(/%5B%5D/g, '[]').replace(/%23/g, '#'),
    'lq2'  : $('input[name=lq2]:checked').val(),
    'lq3'  : $('input[name=lq3]:checked').val(),
    'lq4'  : $('input[name=lq4]:checked').val(),
    'lq5'  : $('input[name=lq5]:checked').val(),
    'lq6'  : $('input[name=lq6]:checked').val(),
    'lq7'  : $('input[name=lq7]:checked').val(),
    'lq8'  : $('input[name=lq8]:checked').val(),
    'lq9'  : $('input[name=other]').val(),
    'lq10' : $('input[name=lqvs]').val(),
    'lq11' : $('input[name=lqos]').val(),
    'lq12' : $('input[name=lqms]').val()
};
console.log(langformData);

$('#other_lang, p#os, p#visualstudio, p#ms').hide();
	
	$('.qwerty').change(function(){
		if ($(this).is(':checked')) {
			$('#other_lang').fadeIn(250);
		} else {
			$('#other_lang').fadeOut(250);
		};
	});

$('#other_lang, p#os, p#visualstudio, p#ms').hide();
	
	$('.qwerty').change(function(){
		if ($(this).is(':checked')) {
			$('#other_lang').fadeIn(250);
		} else {
			$('#other_lang').fadeOut(250);
		};
	});