Como eu posso fazer para que a cada campo input preenchido o proximo apareça em jQuery? Seria assim, selecionar unidade depois o usuário seleciona o período da festa, depois que escolher o dia aparecer o ultimo campo para escolher o tipo de festa
function marcaDesmarcaPeriodo(caller) {
var checks = document.querySelectorAll('.periodo');
checks.forEach(c => c.checked = (c == caller) );
}
function marcaDesmarcaFesta(caller) {
var checks = document.querySelectorAll('.tfesta');
checks.forEach(c => c.checked = (c == caller) );
}
<div class="form-group">
<label>Selecione a unidade que deseja realizar a Festa</label>
<select class="form-control" id="list-lugar" name="unidade">
<option value="0" disabled="true" selected="true">Selecione uma Unidade</option>
<option name="PMA" value="200">Praia</option>
<option name="BRB" value="200">Bourbon</option>
<option name="MTO" value="100">Morumbi</option>
<option name="CN" value="100">Shopping</option>
<option name="SCS" value="100">Park</option>
<option name="TPL" value="100">Tiête</option>
<option name="SBC" value="100">São</option>
</select>
</div>
<div class="form-group">
<label>Escolha o período da Festa</label>
<div class="checkfesta">
<div class="row">
<div class="col-md-5">
<input id="add-periodo-t" onclick="marcaDesmarcaPeriodo(this)" class="periodo" type="checkbox" name="tarde" value="299" />
<label for="add-periodo-t">Período da Tarde</label>
</div>
<div class="col-md-5">
<input id="add-periodo-n" onclick="marcaDesmarcaPeriodo(this)" class="periodo" type="checkbox" name="noite" value="499" />
<label for="add-periodo-n">Período da Noite</label>
</div>
</div>
</div>
</div>
<div class="form-group">
<label>Escolha o dia da Festa</label>
<input type="text" class="form-control" name="data" id="data" placeholder="Escolha a data da Festa">
</div>
<div class="form-group">
<label>Escolha o tipo de Festa que deseja</label>
<div class="checkfesta">
<div class="row">
<div class="col-md-4 col-sm-6">
<input id="add-festa-k" onclick="marcaDesmarcaFesta(this)" class="tfesta" type="checkbox" name="kids" value="1499" />
<label for="add-festa-k">Festa 1</label>
</div>
<div class="col-md-4 col-sm-6">
<input id="add-festa-s" onclick="marcaDesmarcaFesta(this)" class="tfesta" type="checkbox" name="space" value="2000" />
<label for="add-festa-s">Festa 2</label>
</div>
</div>
</div>
</div>
<input type="button" id="proximo2" name="next" class="next action-button" value="Próximo" />
radio
em vez decheckbox
? assim não precisa usar esse script que vc postou.radio
o usuário poderá escolher os dois horários, é isto mesmo que vc quer?