Seguidores

MIS WEBS



domingo, 28 de abril de 2019

UTILIZAR PHP EN MI WEB

APUNTES Php

APUNTES PHP

Uso de switch en php

Si tenemos varias repeticiones de comparación con if en ocasiones puede resultar más cómo hacer esa comparación con un bucle switch, al ser más sencillo.

Lo utilizaremos para comparar varias opciones posibles.

Ejemplo de switch:

	
switch ($Conbustible) {
			case 'Gasoil':
				echo 'el precio del Gasoil es 1.40€'; 	
			break;
			case 'Super 95':
				echo 'el precio de Super 95 es 1.60€'; 	
			break;
			case 'Super 98':
				echo 'el precio de Super 98 es 1.70€';
			break;
		}



						

¿Qué es un bucle?

Un bucle es un fragmento de código que se repetirá hasta que deje de cumplirse una condición dada.

Un bucle puede ser predeterminado si se estable las vueltas de bucle desde el inicio o indeterminado si desconocemos las veces que se repetirá.

While
El código se ejecuta mientras que se cumpla una condición.
Do-while
El código se ejecuta hasta que se cumpla la condición pero en este caso se evaluara al final de vuelta, por lo que como mínimo entrará una vez en el bucle.
For
Es un bucle determinado, el bucle se repetirá en tantas ocasiones como decidamos. Suele utilizarse para recorrer arrays y es uno de lo que más se usa.

Sintaxis de While

<?php	
	while(condición){

	código......
};
?>

Sintaxis de Do-While

<?php
	do{

	código......
}while(condición);

?>

Sintaxis de for

<?php
	for($i=valorInicio;$i<valorFinal; i++){
	codigo....
};

?>

En el siguiente ejemplo escriviremos en pantalla valores entre 1 y 10

Le indicamos que i inicie su bucle en 0 y lo finalice en 9 (i<10) y que a cada buelta de bucle el valor de i incremente 1 (i++)

	
<?php
	for($i=0; $i<10; $i++){
		echo "$i , ";

	}

?>

Este sería el resultado:

viernes, 19 de abril de 2019

TRUCOS RÁPIDOS JAVA


 MÉTODO ToString

El método ToString() pertenece a la superclase  o clase cósmica object y puede resultar muy útil para generar diferentes mensajes. Aquí os dejo un ejemplo rápido.





Ejm. En el siguiente caso utilizo el método ToString()  para crear mensajes en consola Syste.out.println cada vez que se copie un byte del archivo original al copiado. Por último imprimirá un mensaje con la cantidad de bytes copiados en el nuevo archivo.


public String toString(int tipoTexto){
if (tipoTexto==1)              return "se copio el byte     ";
else if (tipoTexto==2)  return "El total de bytes copiados ha sido de    ";
return "";             
        }
        public void ClonadorDeBytes() {       
                try {          
                List cargabytesi = new ArrayList();
FileInputStream Lectura_Bytes = new FileInputStream("C:\\Users\\f\\Desktop\\b/prueba archivo bytes.jpg");
FileOutputStream escritura_Bytes = new FileOutputStream ("C:\\Users\\f\\Desktop\\b/foto copiada por java3.jpg");
                int miByte =0;
                boolean si_NO=true;
                int contador =0;
                //Mientras que el byte read() sea diferente a -1 imprimelo
                while (miByte != -1) { //cargamos los registros en el arrayList
                        miByte= Lectura_Bytes.read();
                        if (miByte != -1) {
                        escritura_Bytes.write(miByte);
                        System.out.println(toString(1) + miByte);
                        contador++;
                        }
                }
        System.out.println(toString(2) +contador);
                Lectura_Bytes.close();escritura_Bytes.close();
                }catch(IOException e){
                        e.getMessage();
                       
                }
       }



El mensaje en consola será el siguiente, tan solo dejo un tramo porque son muchas líneas tantas que ni cabrían en consola porque es el resultado de la clonación de un archivo, dejo la muestra de unas líneas tan solo para verlo.

se copio el byte     164
se copio el byte     2
se copio el byte     69
se copio el byte     95
se copio el byte     244
se copio el byte     212
se copio el byte     81
se copio el byte     185
se copio el byte     65
se copio el byte     202
se copio el byte     53
se copio el byte     21
se copio el byte     238
se copio el byte     52
se copio el byte     80
se copio el byte     7
se copio el byte     255
se copio el byte     217
El total de bytes copiados ha sido de    75373


sábado, 6 de abril de 2019

FORMULARIO HTML5

Cómo hacer un formulario en html5

EJEMPLO DE FORMULARIO CON HTML5

En el siguiente ejemplo juntaré varios imputs de un formulario y les daré un diseño. Existen varias formas con las que podemos distribuir nuestro formulario en el panel: utilizando una tabla o utilizando css. A mi personalmente me gusta utilizar Css ya que un formulario no es lo mismo que una tabla. Pienso que si utilizamos la etiqueta table para un uso al que no fue pensada se convierte en un mal uso y confunde al buscador. Se que al principio de html se utilizaba la etiqueta table para diseñar los espacios del body, pero desde la entrada de html5 eso ha canbiado y la etiqueta label representa una tabla.
FORMULARIO PRÁCTICA
Fecha nacimiento
Estado civil
Estado civil hermano
<form method="GET" >
                                    
        <fieldset id="contenedorForm">
                <legend id="TituloFormm">FORMULARIO PRÁCTICA </legend>
                            
                        <div> 
                                <nput placeholder="NOMBRE:" type="text" name="NOMBRE" id="NOMBRE">
                        </div>
                        <div>
                                <input placeholder="APELLIDOS" type="text" name="Apellidos" id="Apellidos">
                        </div>
                        <div>
                             <legend>Fecha nacimiento </legend>
                             <input type="date" name="Edad" id="Edad">
                        </div>
                        <div>
                                <input placeholder="Email@email.com" type="email" name="Email" id="Email">
                        </div>
                        <div>
                                <label for="Apellidos">Chekear: </label> 
                                <input type="checkbox" name="Apellidos" id="Apellidos">
                        </div>
                                <label for="Apellidos">Satisfacción: </label> 
                                <input type="range" name="barra" id="Apellidos">
                        <div>
                                <fieldset id="estado_civil" >
                                        <legend>Estado civil </legend>
                                        <div>
                                                <input type="radio" name="raza" id="raza_1" value="humano" />
                                                <label for="raza_1">Soltero/a </label>
                                        </div>
                                        <div>
                                                <input type="radio" name="raza" id="raza_2" value="elfo" />
                                                <label for="raza_2">CAsado/a </label>
                                        </div>
                                        <div>
                                                <input type="radio" name="raza" id="raza_3" value="enano" />
                                                <label for="raza_3">Divorciado/a </label>
                                        </div>
                                </fieldset>
                        </div>
                        <div>
                                <fieldset id="estado_civil">
                                        <legend>Estado civil herman </legend>
                                                <div>
                                                       <input type="checkbox" name="raza" id="raza_1" value="humano" />
                                                        <label for="raza_1">Soltero/a </label>
                                                        </div>
                                                        <div>  
                                                              <input type="checkbox" name="raza" id="raza_2" value="elfo" />
                                                              <label for="raza_2">CAsado/a </label>
                                                        </div>
                                                        <div>
                                                                <input type="checkbox" name="raza" id="raza_3" value="enano" />
                                                                <label for="raza_3">Divorciado/a </label>
                                                        </div>
                                </fieldset>
                        </div>
                        <div>
                                <datalist id="MiLista">
                                        <option value="0">GRUISTA </option>
                                        <option value="1">fONTANERO </option>
                                        <option value="2">ELECTRICISTA </option>
                                        <option value="3">SOLADOR </option>
                                <option value="4">CHAOADA </option>
                                <option value="5">FERRALLA </option>
                                <option value="6">PERON </option>
                                <option value="7">ENCARGAD </option>
                                </datalist>
                                <input  
                                        id="lista"
                                        type="text" 
                                        name="desplegable" 
                                        list="MiLista"
                                        placeholder="SELECIONA UN OFICO DE LA CONSTRUCCIÓN">
                     </div>
                            
                 <div>
                 <input type="submit" name="ENVIAR_FORMULARIO" id="ENVIAR">  
              </div>
        </fieldset>
    </form> 

Aquí tenemos el Css:

<style rel="stylesheet" type="text/css">          
                #CajaForm{
                        background-color: rgb(82, 59, 126);
                        margin: 5px 2%;
                        width: 55%;
                        padding:5em;
                        border: 5px solid black;
                        border-radius: 20px 10px;
                        box-shadow: rgb(82, 79, 79) 5px 15px 25px;
                    }
                #contenedorForm{margin-left: 1%;}
                #TituloFormm{ margin-bottom: 30px; font-size: 20px;}
                #estado_civil{width: 180px; margin: 15px;float: left;}
                #estado_civil div input {  width: 10%;}
                #estado_civil div label{background: red;width: 50%;}
                form fieldset div{margin: 1em 0;margin-top: 0.25em;}
                #Enviar{clear: both;}
                form fieldset div label{
                    float: left;width: 25%;
                   }
                code#azul{color:rgb(4, 4, 82);
                        font: bolder;  
                        content: '\f3cc'; 
                        font-size: 0.5em;}
                input{font-size:15px;}
                label,legend{color:black;}
                   
                </style>

Segundo ejemplo de formulario

Formulario 2

Este es el CSS con el que hemos hecho el formulario

form#form2 legend{
        background: #5f5e5e;
        width: 33%;
        margin: 10px;
        margin-left: 30%;
        border-radius: 2px 12px;
}form#form2 label{
        float:left; 
        width: 200px;
        padding-right: 24px;
} form#form2 input{
        float:left;
        width: calc(100%-200px);
}  form#form2 input [type=submit]{
        float: right;
        width: calc(100% - 20xpx);
                }
 

FORMULARIO PARA LOGARSE CON HTML Y CSS

En el sigueinte ejemplo hemos utilizado javaScript para que cuando se introduzca el usuario, login y pulsemos Logarse, nos regrese un mesaje con los datos escritos.

EJEMPLO 3 DE FORMULARIO


Con este javaScript conseguimos que nuestro formulario nos regrese un alert con los datos rellenos


<script>   
        window.addEventListener("load", function(){
                var login, user, boton;
                                                                                
                login= document.getElementById("LOGIN");
                user=  document.getElementById("USUARIO");
                boton = document.getElementById("form3")
                boton.addEventListener("submit", validar, false);
                function validar() { 
                        alert("loging:   " + login.value  + "       user:   " + user.value);                                        
                        user.style.background="red";
                        login.style.background="yellow";                             
                };
        }, false);
</script>
                                               
                                               

Con el siguiente script podemos confirmar que no quedan inputs sin rellenar y nos regrese un alert con los datos guardados


window.addEventListener("load", function(){
        var login, user, boton;
                                
                /* nombrar objetos oyentes */
                login= document.getElementById("LOGIN");
                user=  document.getElementById("USUARIO");
                boton = document.getElementById("form3");
                                           
                        /* poner a la escucha los objetos */
                user.addEventListener("input",aviso_relleno, false );
                login.addEventListener("input", aviso_relleno, false);
                boton.addEventListener("submit", validar, false);

                user.style.background="red";
                login.style.background="yellow";
        function validar() { 
                aviso_relleno();
                alert("loging:   " + login.value  + "       user:   " + user.value);  
                };
        function aviso_relleno(){
                if(login.value =="" || user.value==""){
                user.setCustomValidity("falta usuario o login");
                /* setCustomValidity("texto") avisos en formulario */
                }else{
                user.setCustomValidity("");/* reseteamos a no valor el set custom para que nos deje salir */
                user.style.background="green";
                login.style.background="green";
                };
      };
}, false);
                

Formulario con un output que nos regrese el resultado de un <input type="range">

En el siguiente formulario hemos utilizado css para cargarle un fondo y distribuir los elementos igual que en el anterior, luego con javaScrip hemos puesto a la escucha la barra y le hemos indicado que regrese en el output el valor de la barra

EJEMPLO FORM 4
Edad del cliente


 window.addEventListener("load", function(){
                                       
     var form4range;
                form4range= document.getElementById("EdadCL");
                                           
                /* al cambiar el estado del elemento */
                form4range.addEventListener("change", barra, false);
         function barra(){ 
                var salidaDatos= document.getElementById("EdadNumero");
                var edad= form4range.value-20;
   
                                
                

Construir un formulario y conectarlo a un localhost

La función principal de un formulario es la de guardar registros de una forma ordenada.Para ello necesitaremos conectar a una BBFF. En los formularios anteriores henos utilizao tan solo html, css y javaScript (FontEnd). Una vez tengamos alojada nuestra pagina en el servidor, puede ser virtual (en tu propio ordenador, como es mi caso) o de pago.

Porque cuando pulso submit en mi formulario aparece una pagina con el códio php

Php es un lenguaje del lado del servidor(BackEnd)porlo que nuestra pagina ha de estar alojada en el servidor. En mica caso utilizo el paqueta wamp por lo que tengo que buscar en mi ordenador la ruta C:\wamp64\www\ y alojar en esta carpeta mi carpeta con los archivos htlm, css, javaScript y php.En caso de estar la carpeta e un lugar que no sea el servidor no la reconocerá como código php. Una vez alojada tu carpeta en C:\wamp64\www\ tines que habrir tu buscador de internet y cargar en la zona de URL http://localhost/carpetaCreada/.

Una vez hemos creado nuestro formlario con html, css y javaScript

Por supuesto no podreis ver como funciona por detras por que el Backend, esta siempre oculto para el usuario pero os pegare el código php mas abajo por eso se dice que es del lado del servidor.

Formulario que carga con PHP

Este será nuestro CSS:

                /* 

form#form5 input[type="submit"]{width: 80px; margin-left: 40%;  margin-top:20px;}
form#form5{ border: solid 3px  black;
                 border-radius: 5px; width: 80%;  max-width: 550px;
                 height: 260px;   margin-left: 20%;  background: slategray;}
form#form5 label{ float: left; width: 25%;  margin-left: 2%;}
form#form5 input { float:left;   width: 65%;}
form#form5 legend{ text-align: center; margin:5px;}
                        */

Este será nuestro JavaScript con el que llenar la etiqueta datalist, lo podeis alojar en línea con un script dentro del datalist o linkarlo en una hoja de estilos esterna.

   window.addEventListener("load", function(){
                var BoxEstadoCivil= new Array(  'soltero/a', 
                                                'casado/a', 
                                                 'divorciado/a',
                                                 'vidudo/a',
                                                 'separado/a');
                var e_option ='';
                 for(i=0;i<BoxEstadoCivil.length;i++){
                    
                 e_option += '<option value="'+BoxEstadoCivil[i]+'"/>';
                document.getElementById("lista").innerHTML= e_option;
                        }
                    
                        
},false); 

Por ultimo nuestro php para conecta a la BBDD:



                echo "<h1>ESTAS DENTRO GRUAPO</h1>";
   
                                $Nombre= $_POST['Nombre'];
                                $Apellidos= $_POST['Apellidos'];
                                $Email= $_POST['Email'];
                                $EstadoCivil= $_POST['EstadoCivil'];
                            
                            
                             $link= mysqli_connect(
                            
                                $host = 'localhost',
                                $user = 'root',
                                $password = '',
                             );
                             if(mysqli_connect_errno()){
                                 echo "<br><br><h1 style = color: red> No te ha conectado al Host</h1>";
                                 exit();
                               };
                            
                               mysqli_select_db( 
                                   $link,
                                   $dbname= 'cursohtml'
                                )or die ("<h2 style= 'color : red'>upssssss la em fotut no esta la BBDD</h2>");
                                
                            $setquery=mysqli_query(
                                       $link,
                                       $query="INSERT INTO form5 
                                               VALUES('$Nombre',
                                                      '$Apellidos',
                                                      '$Email',
                                                      '$EstadoCivil')"
                                       ) or die ("<br> <h2 style= 'color : red'> la has cagado con tu consulta, hazlo otra vez so torpe");
                            
                                echo
                                " <br><a href='http://localhost/MisPaginasWeb/Practica_4/'
                                >Atras</a>";
                            



Buscar este blog

Sandisk y Western Digital