//Funcion para obtener el valor del radiobutton y cambiar al tab siguiente
$(document).ready(function() {
var sw ='';
var Nombre = '';
var Apellido ='';
var Correo ='';
$('#submit1').click(function(){
Nombre= $('input[name=Nombre]').val();
Apellido= $('input[name=Apellido]').val();
Correo= $('input[name=Correo]').val();
if(Nombre !== '' && Apellido !== '' && Correo !== ''){
console.log("entro al elsejdowiugsciyvewvc hdiuecbiducbiudbcoudb jducbuidc dc udvcud c uidci dkc diucduddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd j iy jdddddddddddddddddddddddddddddddddddgyufyedge hdiuecbiducbiudbcoudbed fvfrvdffedscdsced");
$('.nav-tabs a[href="#paso2"]').tab('show');
}else{
console.log('Nombre: '+Nombre);
console.log('Apellido: '+Apellido);
console.log('Correo: '+Correo);
}
});
$('input[name=Training]').change(function(){
checkedSi = $( 'input[name=Training]:checked' ).val();
if(checkedSi === 'no')
{
$('.nav-tabs a[href="#paso2"]').tab('show');
}
});
$('#submit2').click(function(){
$('.nav-tabs a[href="#paso3"]').tab('show');
});
$('#submit3').click(function(){
location.href ="index.html";
});
});
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<section class="container py-4">
<div class="row">
<div class="col-md-12">
<center><h2>Prueba de Orientación Profesional</h2></center>
<ul id="tabsJustified" class="nav nav-tabs">
<li class="nav-item"><a data-target="#paso1" class="nav-link small text-uppercase active"><b>PASO 1 - REGISTRO</b></a></li>
<li class="nav-item"><a data-target="#paso2" href="#paso2" class="nav-link small text-uppercase "><b>PASO 2 - PRUEBA</b></a></li>
<li class="nav-item"><a data-target="#paso3" href="#paso3" class="nav-link small text-uppercase"><b>PASO 3 - RESULTADOS</b></a></li>
<!--data-toggle="tab" ..... para ir a los link ... href="" -->
</ul>
<br>
<div id="tabsJustifiedContent" class="tab-content">
<div id="paso1" class="tab-pane fade active show">
<form class="form-horizontal">
<fieldset>
<!-- Form Name - si la respuesta es no permitir pasar al siguiente paso -->
<legend><b><center>Registrar Información</center></b></legend>
<div class="form-group">
<label class="col-md-12 control-label" for="Training"><center>¿Desea suminitrar sus datos al portal web para enviarle información en el futuro?</label>
<div class="col-md-4">
<label class="radio-inline" for="Training-0">
<input type="radio" name="Training" id="Training-0" value="si" checked="">
Si
</label>
<label class="radio-inline" for="Training-1">
<input type="radio" name="Training" id="Training-1" value="no">
No
</label>
</div>
</div></center>
<center>
<!-- Text input-->
<div class="form-group">
<!--<label class="col-md-2 control-label" for="Nombre">Nombre</label>-->
<div class="col-md-4">
<input id="Nombre" name="Nombre" type="text" placeholder="Nombre" class="form-control input-md" required="">
</div>
</div>
<!-- Text input-->
<div class="form-group">
<!--<label class="col-md-2 control-label" for="Apellido">Apellido</label>-->
<div class="col-md-4">
<input id="Apellido" name="Apellido" type="text" placeholder="Apellido" class="form-control input-md" required="">
</div>
</div>
<!-- Text input-->
<div class="form-group">
<!--<label class="col-md-2 control-label" for="Correo">Correo</label>-->
<div class="col-md-4">
<input id="Correo" name="Correo" type="email" placeholder="Correo" class="form-control input-md" required="">
</div>
</div>
<!-- Button -->
<div class="form-group">
<label class="col-md-4 control-label" for="submit"></label>
<div class="col-md-4">
<button id="submit1" name="submit1" class="btn btn-primary" >SIGUIENTE</button>
</div>
</div>
</center>
</fieldset>
</form>
</div>
<div id="paso2" class="tab-pane fade">
<legend><b><center>Realizar Prueba</center></b></legend>
<div class="form-group">
<label class="col-md-12 control-label" for="Training"><b>1.</b>¿Frase favorita?</label>
<div class="col-md-4">
<label class="radio-inline" for="Training-0">
<input type="radio" name="Training1" id="Training1-A" value="A">
A. hola
</label><br>
<label class="radio-inline" for="Training-1">
<input type="radio" name="Training1" id="Training1-B" value="B">
B. Chao
</label><br>
<label class="radio-inline" for="Training-2">
<input type="radio" name="Training1" id="Training1-C" value="C">
C. Adios
</label><br>
<label class="radio-inline" for="Training-3">
<input type="radio" name="Training1" id="Training1-D" value="D">
D. Que mas
</label><br>
</div>
</div>
<div class="form-group">
<label class="col-md-12 control-label" for="Training"><b>2.</b>¿Mascota favorita?</label>
<div class="col-md-4">
<label class="radio-inline" for="Training-0">
<input type="radio" name="Training2" id="Training2-A" value="A">
A. Perro
</label><br>
<label class="radio-inline" for="Training-1">
<input type="radio" name="Training2" id="Training2-B" value="B">
B. Gato
</label><br>
<label class="radio-inline" for="Training-2">
<input type="radio" name="Training2" id="Training2-C" value="C">
C. Loro
</label><br>
<label class="radio-inline" for="Training-3">
<input type="radio" name="Training2" id="Training2-D" value="D">
D. Raton
</label><br>
</div>
</div>
<div class="form-group"><center>
<label class="col-md-4 control-label" for="submit"></label>
<div class="col-md-4">
<button id="submit2" name="submit2" class="btn btn-primary">SIGUIENTE</button>
</div></center>
</div>
</div>
<div id="paso3" class="tab-pane fade">
<legend><b><center>Resultados Obtenidos</center></b></legend>
<div class="form-group"><center>
<label class="col-md-4 control-label" for="submit"></label>
<div class="col-md-4">
<button id="submit3" name="submit3" class="btn btn-primary">SALIR</button>
</div></center>
</div>
</div>
</div>
</div>
</div>
</section>
asked by ANDRES CORREA GIRALDO 17.11.2017 в 15:29
source