Código:
</div>
</div>
</div>
<div class="tab-pane" id="address">
<div class="row">
<div class="col-sm-12">
<h4 class="info-text"> Características del Producto </h4>
</div>
<div id="color" class="col-sm-6">
<div class="form-group">
<label>Color</label><br>
<select name="exterior" class="form-control" >
<option value="">-- Selecciona --</option>
<option value="AF">Rojo</option>
<option value="AX">Azul</option>
</select>
</div>
</div>
<div class="col-sm-3">
<div class="form-group">
<label>Cantidad</label>
<input name="cantidad" type="cantidad" class="form-control" placeholder="3...">
</div>
</div>
<div id="mExterior" class="col-sm-6" style="display:none">
<div class="form-group">
<label>Marco Exterior</label><br>
<select name="exterior" class="form-control" >
<option value="">-- Selecciona --</option>
<option value="AF">Sí</option>
<option value="AX">No</option>
</select>
</div>
</div>
<div id="mInterior" class="col-sm-6" style="display:none">
<div class="form-group">
<label>Marco Interior</label><br>
<select name="interior" class="form-control" >
<option value="">-- Selecciona --</option>
<option value="AF">Sí</option>
<option value="AX">No</option>
</select>
</div>
</div>
</div>
</div>
</div>
<div class="wizard-footer">
<div id='result'></div>
<hr>
<div class="pull-right">
<input type='button' class='btn btn-next btn-fill btn-warning btn-wd btn-sm' name='next' value='Siguiente' />
<input type='submit' class='btn btn-finish btn-fill btn-warning btn-wd btn-sm' name='finish' value='Finalizar' />
</div>
<div class="pull-left">
<input type='button' class='btn btn-previous btn-fill btn-default btn-wd btn-sm' name='previous' value='Anterior' />
</div>
<div class="clearfix"></div>
</div>
</form>
</div>
</div> <!-- wizard container -->
</div>
</div><!-- end row -->
<!--Mensaje: Alfombras bajo pedido-->
<div id="msg-pedido" class="modal fade">
<div class="modal-dialog " >
<div class="modal-content">
<div class="modal-header">
<button tyle="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">Atención:</h4>
</div>
<div class="modal-body">
<p>Todas las alfombras Residenciales son bajo pedido.</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">Ok</button>
</div>
</div>
</div>
</div>
</div> <!-- big container -->
<div class="footer">
</div>
</div>
</body>
<script src="assets/js/jquery-1.10.2.js" type="text/javascript"></script>
<script src="assets/js/bootstrap.min.js" type="text/javascript"></script>
<!-- plugins -->
<script src="assets/js/jquery.bootstrap.wizard.js" type="text/javascript"></script>
<!-- More information about jquery.validate here: http://jqueryvalidation.org/ -->
<script src="assets/js/jquery.validate.min.js"></script>
<!-- methods for manipulating the wizard and the validation -->
<script src="assets/js/wizard.js"></script>
<script>
var form1 = $( "#estimate" );
form1.validate();
$( "#estimate" ).submit(function( event ) {
if (form1.valid()==true){
var parametros = $(this).serialize();
$.ajax({
type: "POST",
url: "process.php",
data: parametros,
beforeSend: function(objeto){
$("#result").html("Mensaje: Cargando...");
},
success: function(datos){
$("#result").html(datos);
}
});
event.preventDefault();
}
});
</script>
</html>
Como lo podría hacer cuando esté seleccionado "Alfombra", y cuando esté "Piso Laminado" y demás?, saludos.