Ejemplo 4.- Etiquetas, hojas de estilo y AJAX

Crear un archivo php llamado “ejemplo4”.

  1.- Se usarán distintas etiquetas, como caja de textos, botones,         listas, tablas.

  2.- Se creará una hoja de estilos “CSS” y se aplicará el estilo a las         etiquetas usadas.

  3.-Aplicaremos AJAX  para futuras validaciones.

 

NOTA.- Les pido disculpas por que WordPress me modifica el contenido al insertarlo. Les dejo el enlace para que puedan descargar los archivos. Gracias

<html>
<head>
<link rel=”stylesheet” type=”text/css” href=”hoja_estilo.css”/>   //  Manda a llamar la hoja de estilos la cual le dará formato a los objetos
<script type=”text/javascript” src=”jquery.js”></script>   //Manda a llamar “jquery.js” para hacer uso de funciones de AJAX ya predeterminadas
</head>
<body>
<h1>Encabezado</h1>
<input type=”button” value=”Aceptar” />
<p>Esto es un Parrafo.</p>
Nombre: <input type=”text” id=”nombre” name=”nombre”/>
<br>
Apellido: <input type=”text” id=”apellido” name=”apellido”/>
<ol>
<li><a href=”arduinoserver.php” id=”link1″>Primer Elemento</a></li>
<li>Segundo Elemento</li>
<li>Tercer Elemento</li>
</ol>
<table>
<tr>
<td>Celda 1</td>
<td>Celda 2</td>
<td>Celda 3</td>
</tr>
<tr>
<td>Celda 4</td>
<td>Celda 5</td>
<td>Celda 6</td>
</tr>
<tr>
<td>Celda 7</td>
<td>Celda 8</td>
<td>Celda 9</td>
</tr>
</table>
</body>
<script type=”text/javascript”>
// var nombre=” Jose Alfonso Brito Rojas”;
//var nombre=prompt(“Cual es tu nombre?????”);
// alert(“Bienvenido “+nombre);
$(document).ready(function(){
$(“.lista”).mouseleave(function(){
alert(“Haz un click en ‘lista'”);
click($(“#link”).valueOf());
});
});
$(“#apellido”).focus(function(){
if ($(“#nombre”).val()==””) alert(“El nombre esta vacio”);}
);
</script>
</html>–>

Ejemplo 3.- Crear Clases y llamarlas

1.- Crear un archivo php llamado “funciones-class”.

<?php

    class funciones{

        private $num1;

        private $num2;

        public function __construct($fnum1, $fnum2){

            $this->num1=$fnum1;

            $this->num2=$fnum2;

        }

         public function suma(){

            return $this->num1+$this->num2;

        }

        public function resta(){

            return $this->num1-$this->num2;

        }

        public function mult(){

            return $this->num1*$this->num2;

        }

        public function div(){

            return $this->num1/$this->num2;

        }

    }

?>

2.- Crear un archivo php llamado “ejemplo3-class”.

<?php

    include_once ‘funciones-class.php’; //se incluye la libreria donde esta la clase

    $funciones = new funciones(1,2);  // Se declara un nuevo objeto insertando los datos que deseamos procesar.

    echo ‘1+2= ‘.$funciones->suma();

    echo ‘<br>’;

    echo ‘1-2= ‘.$funciones->resta();

    echo ‘<br>’;

    echo ‘1*2= ‘.$funciones->mult();

    echo ‘<br>’;

    echo ‘1/2= ‘.$funciones->div();

?>

Php-Ajax-Mysql

Ejemplo 2.- Crear Funciones y llamarlas

1.- Crear un archivo php llamado “funciones”.

<?php

function suma($a,$b){

    $resultado = $a+$b;

    return $resultado;        //regresa Resultado

}

function resta($a,$b){

    $resultado = $a-$b;

    return $resultado;        //regresa Resultado

}

function multi($a,$b){

    $resultado = $a*$b;

    return $resultado;        //regresa Resultado

}

function div($a,$b){

    $resultado = $a/$b;

    return $resultado;        //regresa Resultado

}

function modulo($a,$b){

    $resultado = $a%$b;

    return $resultado;        //regresa Resultado

}

?>

 

2.- Crear un archivo php llamado “ejemplo2”.

 

<?php

    include ‘funciones.php’; //se manda a llamar el archivo donde están alojadas nuestras funciones

    echo suma(98,89);   //manda a imprimir a pantalla la el resultado de la Suma de los 2 valores  de 98+89

    echo “<br>”;                 //Salto de Linea

    echo multi(suma(2,2),2);  //manda a imprimir el resultado de     (2+2)*2

?>

Php-Ajax-Mysql

Ejemplo 1.- Declaración de Variables y Forma de Mostrar su Contenido en PHP

Crear un archivo php llamado “Ejemplo1”.

<?php

/*Para declarar una Variable es necesario anteponer el Signo monetario “$”  posteriormente el nombre de la variable.

PHP  no tiene variables numéricas, string, ni nada por el estilo, solamente es una variable, al menos que se desee diseñar un

Arreglo “arrray” unidimensional, bidimensional.

*/

$nombre=”Alfonso”;                              //asigno a la variable $nombre el valor de “Alfonso”

$$nombre =”variable Alfonso”;       //convierte a el nombre de  “Alfonso” como el nombre variable. osea   que  $$nombre es lo mismo que $Alfonso
//por lo tanto $$nombre=$Alfonso=”variable Alfonso”.

echo “Hola Ing. “.$nombre;               //con el echo imprimimos la cadena que deseamos. Para imprimir la variable es cuestion de concatenar anteponiendo un “.”

echo “<br>”;

echo “Que tal “.$Alfonso;

echo “<br>”;

$num1=91;

$num2=91;

$suma=$num1+$num2;

echo $num1.” + “.$num2.” = “.$suma;

?>

 

Php-Ajax-Mysql

CURSO de PHP, AJAX y MySQL

Php-Ajax-Mysql

Objetivo principal del Curso

El alumno adquirirá conocimientos para el diseño de un Sistema WEB (PHP y MySQL) con otra herramienta de procesamiento tipo CLIENTE y no en el SERVER (AJAX).

 

Por qué aprender AJAX???

  • Ciertamente PHP a sido una herramienta de desarrollo de Sistemas WEB muy generoso, pero siempre se ejecutan en el SERVER.
  • PHP es poderoso ya que el Servidor WEB procesa el contenido php y muestra únicamente contenido HTML.
  • En simples palabras, al querer ver el código fuente desde tu navegador, no podrás ver las instrucciones de php, solo HTML.
  • Lo novedoso de AJAX, mencionando unos ejemplos es que puede ejecutar archivos tipo WEB en 2do plano (CLIENTE), ósea, sin necesidad de ABRIRLO y REDIRECCIONAR o bien refrescar la ventana. También carga contenido en etiquetas ya abiertas (ejemplo: etiquetas <div></div>) sin necesidad de recargar la pagina.

Requerimientos de Software

  • XAMPP, NGINX o cualquier Servidor WEB
    • En el curso usaremos XAMPP:
      • –Contiene un servidor WEB APACHE, phpmyadmin, servidor FTP, PHP, email, etc. Que corre de manera localhost.
  • NetBeans IDE 7.X
    • Ambiente de Desarrollo, en nuestro caso, PHP, HTML y AJAX.

Qué es PHP???

  • PHP (acrónimo de PHP: Hypertext Preprocessor) es un lenguaje de código abierto muy popular especialmente adecuado para desarrollo web y que puede ser incrustado en HTML.
  • Una respuesta corta y concisa, pero, ¿qué significa realmente? Un ejemplo nos aclarará las cosas:
  • Ejemplo #1 Un ejemplo introductorio
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”
“http://www.w3.org/TR/html4/loose.dtd”>
<html>
<head>
<title>Example</title>
</head>
<body>
<?php
echo “Hola, ¡soy un script PHP!”;
?>
</body>
</html>

Estructuración principal de HTML y PHP

  • Estructura
    • Apertura <html> , Cierre </html>
      • –Es la etiqueta que le dice al servidor que abrirá y decodificará contenido HTML
  • Encabezado
    • Apertura <head> , Cierre </head>
      • –Es la etiqueta que mostrará el contenido del encabezado ejemplo:
        • –Titulos de las paginas, formatos o estilos, las METAS (palabras claves las cuales los motores de busqueda como google encontrará tu WEB), etc.
  • Cuerpo
    • Apertura <body>, Cierre </body>
      • –Es la etiqueta la cual decodificará otros tipos de etiquetas como formularios, tablas, cajas de textos ( inputs ), etc.
  • PHP
    • Apertura <?php, Cierre ?>


Crear un Proyecto en NetBeans

  1. Crear un proyecto en File/New Project…
  2. Categories: -> PHP
  3. Project: -> PHP Application
  4. Después Next
  5. Project Name: curso
  6. La ruta quedará de la siguiente forma C:\xampp\htdocs\curso.
  7. PHP Version: -> PHP 5.3
  8. Default Encoding: -> UTF-8

Ejemplo de Crear un Archivo .PHP

1.-El proyecto de “curso”, contiene 2 carpetas.
a) Dar click con el botón derecho del mouse a Source File.
b )Ir a New -> PHP File…
2.-File Name: -> ejemplo1
3.-Finish

Cada uno de los ejemplos están en distintas paginas para que puedas verlos ordenadamente. Siguenos