<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <div class="row col-md-12"> <div id="informe-new-info"> <div class="well"> <div class="input-group col-md-10 line"> <form> <div class="col-sm-12 form-group"> <label class="control-label" for="acuerdo">Acuerdo</label> <select id="acuerdo" class="col-sm-2 form-control"> <option value="Acuerdo001">Acuerdo001</option> <option value="Acuerdo002">Acuerdo002</option> </select> </div> <div class="col-sm-2 form-group form-param"> <label class="control-label" for="tipoFacturacion">Tipo Facturacion</label> <select id="tipoFacturacion" class="col-sm-2 form-control"> <option value="Tipo1">Facturacion1</option> <option value="Tipo2">Facturacion1</option> </select> </div> <div class="col-sm-4 form-group form-param"> <label class="control-label" for="cif">CIF</label> <select id="cif" class="col-sm-2 form-control"> <option value="cif01">cif01 - NombreDeEmpresaDeHasta80Caracteres__0123456789__01</option> <option value="cif01">cif02 - NombreDeEmpresaDeHasta80Caracteres__0123456789__02</option> </select> </div> <div class="col-sm-4 form-group form-param"> <label class="control-label" for="servicio">Servicio</label> <select id="servicio" class="col-sm-2 form-control"> <option value="servicio01">cod01 - Servicio01</option> <option value="servicio02">cod02 - Servicio02</option> </select> </div> <div class="col-sm-2 form-group form-param"> <label class="control-label" for="fecha">Fecha</label> <select id="fecha" class="col-sm-2 form-control"> <option value="fecha01">20141228</option> <option value="fecha02">20141128</option> </select> </div> <div class="col-sm-12 form-group form-param"> <label class="control-label" for="descConcepto">Concepto</label> <input type="text" class="form-control" id="descConcepto" placeholder="Descripción concepto"> </div> <div class="col-sm-4 form-group form-param"> <label class="control-label" for="importe">Importe</label> <input type="number" class="form-control" id="importe" placeholder="0.00"> </div> <div class="col-sm-12 form-group form-param"> <label class="control-label" for="comentarios">Comentarios</label> <input type="text" class="form-control" id="comentarios" placeholder="Comentarios"> </div> <div class="form-group form-param"> <div class="col-md-offset-4 col-md-4"> <p class="text-center"> <button id="btn-save" type="submit" class="btn btn-primary"> Guardar </button> <a href="#back" id="btn-back" class="btn btn-default"> Atrás </a> </p> </div> </div> </form> </div> </div> </div> </div> </div>

@import url("http://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.5.4/bootstrap-select.min.css")

$(document).ready(function() { $('.form-param').hide(); $('#acuerdo').change( function() { $('.form-param').show(); $('#acuerdo').attr('disabled', true); }); });