Ejemplos para ocultar y mostrar DIVS HTML

Primero hacemos las funciones una para cada boton

   1: function Agregar(){ 

   2:          document.getElementById("usuarioslocos").style.display = "none";

   3:         document.getElementById("divpararegistrar").style.display = "table";

   4:     }

   5:  

   6:     function Eliminar(){ 

   7:         if(obtenerRadioSeleccionado("form", "radios")!=false){

   8:             if(confirm("Deseas Realmente eliminar este registro?")){

   9:                 var id = obtenerRadioSeleccionado("form", "radios").value;

  10:                 location.href= "index.php/welcome/deleteUserId/" + id;

  11:             }

  12:                         else{ }

  13:         }

  14:         else{alert("No a seleccionado un registro !!");}

  15:     }

  16:  

  17:  

  18:     function Editar(){ 

  19:         

  20:                     if(obtenerRadioSeleccionado("form", "radios")!=false){

  21:             if(confirm("Desea Modificar el registro?")){

  22:                 var id = obtenerRadioSeleccionado("form", "radios").value;

  23:                 location.href= "index.php/welcome/updateUserId/" + id;

  24:             }

  25:                         else{ }

  26:         }

  27:         else{alert("No a seleccionado un registro !!");}

  28:     }

 

Creamos los botones y le asignamos una función a cada una

   1: <button onclick="Agregar()" type="button">Agregar

   2:         <button onclick="Editar()" type="button">Editar

   3:         <button onclick="Eliminar()" type="button">Eliminar

   4:         <button onclick="PDF()" type="button">PDF

Luego configuramos los divs

   1: <div id="usuarioslocos">

   2:             <table border="0" align="center" id="tabla">

   3:             <tr bgcolor="#7362ec" align="center" onmouseover='this.style.backgroundColor='#E13300''

   4:                                                  onmouseout='this.style.backgroundColor='#7362ec''>

   5:             

   6:             ID

   7:             NOMBRE  

   8:             APELLIDO 

   9:             RFC

  10:             CONTRASEÑA CERTIFICADO

  11:             CERTIFICADO

  12:             LLAVE

  13:             SELECCIONAR

  14:             

  15:             

  16:     

  17:             <?php

  18:             $colorfila=0;

  19:             

  20:             

  21:             if($records!=false){

  22:                foreach($records->result() as $row){

  23:                    if ($colorfila==0){ 

  24:                    $color= "#b5b5b5"; 

  25:                    $colorfila=1; 

  26:                     }else{ 

  27:                    $color="#f7f7f7"; 

  28:                    $colorfila=0; 

  29:                 }    

  30:                 echo "<tr bgcolor='".$color."' align='center' ";?> onmouseover="this.style.backgroundColor='#E13300'"

  31:                                                                    onmouseout="this.style.backgroundColor=''">

  32:                                                                 

  33:                                                                 <?php

  34:                 echo "";

  35:                 

  36:                 echo pintar($busqueda,$row->Cliente)." 

  37:                  ".pintar($busqueda,$row->Nombre)."

  38:                  ".pintar($busqueda,$row->Apellido)."

  39:                  ".pintar($busqueda,$row->RFC)." 

  40:                 ".pintar($busqueda,$row->contraCertificado)."

  41:                 ".pintar($busqueda,$row->nombreCertificado)."

  42:                 ".pintar($busqueda,$row->nombreLlave)."

  43:                 

  44:                 

  45:                 

  46:                 <input type='radio' name='radios' value='".$row->Cliente."'>";

  47:         

  48:                 echo "";

  49:             }

  50:             

  51:         }

  52:         ?>

  53:         

  54:         

  55:         

  56:  

  57:     

  58: 

  59:  

  60: 
<?php

  61: //echo $this->table->generate($records);

  62: //Creamos la páginación

  63:  echo $this->pagination->create_links();

  64:  ?>

  65:  

  66:  

  67:  

  68:  

  69:  

  70:  

  71:  

  72:  

  73:  <div id="divpararegistrar" hidden="true">

  74:  

  75:  

  76:     

  77:         

  78:         

  79:         <?php $jjq = base_url()."js/jquery-latest.js";

  80:               $jja = base_url()."js/jquery.validate.js";

  81:     

  82:     echo "";

  83:     echo "";

  84:     

  85:     ?>

  86:  

  87:         <style type="text/css">

  88:  

  89:             * { font-family: Verdana; font-size: 96%; }

  90:             label { width: 10em; float: left; }

  91:             label.error { float: none; color: red; padding-left: .5em; vertical-align: top; }

  92:             p { clear: both; }

  93:             .submit { margin-left: 12em; }

  94:             em { font-weight: bold; padding-right: 1em; vertical-align: top;                     }

  95:         

  96:               

  97:  

  98: function validar(esto){ 

  99: valido=false; 

 100: for(a=0;a<esto.elements.length;a++){ 

 101: if(esto[a].type=="checkbox" && esto[a].checked==true){ 

 102: valido=true; 

 103: break 

 104: } 

 105:  

 106: } 

 107: if(!valido){ 

 108: alert("Chequee una casilla!");return false 

 109: } 

 110:  

 111: }  

 112:  

 113:  

 114:   

 115:             <script type="text/javascript">

 116:  

 117: $(document).ready(function(){

 118: $("body div:last").remove();

 119: });

 120: 

 121:  

 122:          

 123:   $(document).ready(function(){

 124:  $("#registro").validate({

 125:   rules: {

 126:     nom_usu: {

 127:       required: true,

 128:       maxlength: 25,

 129:       minlength:    3

 130:     },

 131:     

 132:     login: {

 133:       required: true,

 134:        maxlength: 2,

 135:       minlength:    2,

 136:       number: true

 137:     },

 138:     

 139:     psw: {

 140:       required: true,

 141:        maxlength: 10,

 142:       minlength:    6,

 143:       number: true,

 144:       equalTo: "#psw1"

 145:  

 146:     },

 147:     

 148:     psw1: {

 149:       required: true,

 150:        maxlength: 10,

 151:       minlength:    6,

 152:       number: true

 153:  

 154:     },

 155:     

 156:     acceso: {

 157:       required: true

 158:     },

 159:     

 160:     

 161:     status: {

 162:       required: true

 163:     }

 164:   }

 165: });

 166:  

 167:   });

 168:   

 169:   

 170:   

 171:       label{

 172:         width:150px;

 173:         display: inline-block;

 174:     }

 175:   

 176:   

 177: 

 178: 

 179: 

 180: <?php echo $_SESSION['nombre'];?>

 181:         

 182:         

 183:         

Registrar nuevo cliente

 184:          <div id="container" align="center">

 185:   

 186:   

 187:   

 188:   <form id="registro" name="registro"  action="index.php/ctrClientes/addClient" method="POST" enctype="multipart/form-data">

 189:     

 190:     

 191:     <label for="login">Nombres:

 192:     <input type="text" name="NombreCliente" id="NombreCliente" onchange=""/> 

 193:     

 194:     

 195:     <label for="nom_usu">Apellidos:

 196:     <input type="text" name="apellidos" id="apellidos"/>

 197:     

 198:     <label for="RFC">RFC:

 199:     <input type="text" name="RFC" id="RFC" />

 200:     

 201:     

 202:     <label for="psw1">Contraseña del Certificado

 203:     <input type="text" name="ContraCer" id="ContraCer"/>

 204:     

 205:     

 206:     <label for="file">Certificado:

 207:     <?php form_open_multipart('upload/do_upload'); ?>

 208:     <input type="file" name="cer" size="20000" /> 

 209:     

 210:     

 211:     

 212:     <label for="file">Archivo Llave:

 213:     <?php form_open_multipart('upload/do_upload'); ?>

 214:     <input type="file" name="key" size="20000" /> 

 215:     

 216:     

 217:     

 218:  

 219:     <input type="submit" name="submit" value="Registrar"/>

 220:     

 221:     

 222:     

 223:     

 224: