Portada » Lenguaje PHP » Llenar select HTML con MySQL PHP: Ejemplos

Llenar select HTML con MySQL PHP: Ejemplos

La Llenar select HTML con MySQL PHP: Ejemplos. Si se desea que nuestra página web sea dinámica tenemos que utilizar PHP y MySQL, en este artículo veremos cómo vaciar el contenido de una tabla en base de datos a una etiqueta de tipo lista desplegable (select), haciendo uso de lenguaje de programación y una base de datos Mysql.

Si somos detallistas veremos que en cada paso del bucle while imprimimos una nueva opción de forma dinámica (<option></option>) dentro de la lista desplegable. De esta manera volcamos la información del gestor de base de datos.

Ver demo

Ver Demo

Llenar etiqueta select HTML con MySQL PHP

Ahora veamos lo que necesitamos para lograr tal propósito y algunos ejemplos completos para mostrar los registros de una tabla.

a) Primer Paso: Crear una tabla en la base de datos (países)

En el siguiente cuadro les dejare el contenido de la base de datos. En ella está la sentencia para la creación de una tabla y sus respectivos registros.

CREATE TABLE IF NOT EXISTS `paises` (
  `id` int(11) NOT NULL auto_increment,
  `paises` varchar(60) NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=MyISAM  DEFAULT CHARSET=latin1 AUTO_INCREMENT=6 ;

--
-- Volcar la base de datos para la tabla `Paises`
--

INSERT INTO `Paises` (`id`, `paises`) VALUES
(1, 'Ecuador'),
(2, 'Chile'),
(3, 'Peru'),
(4, 'Argentina'),
(5, 'Colombia');

b) Segundo Paso: la conexión con MySQL

A continuación, en una sola línea realizaremos la conexión con la base de datos MySQLi,  usando una variable llamada $mysqli

  $mysqli = new mysqli('localhost', 'root', 'root', 'base_datos');

c) Tercer Paso: Vincular con la tabla y extraer datos.

  • En este paso vamos a usar MySQLi para realizar la selección de la tabla.
  • Usaremos el ciclo WHILE para mostrar la información de la tabla paises.
  • Dentro del ciclo WHILE podemos colocar las opciones de nuestra lista desplegable. Por lo tanto, en este ciclo se mostrara la cantidad de registros existentes en nuestra tabla.
$query = $mysqli -> query ("SELECT * FROM paises");
                    
while ($valores = mysqli_fetch_array($query)) {
                        
  echo '<option value="'.$valores[id].'">'.$valores[paises].'</option>';
}

Aquí les muestro el ejemplo completo, la conexión, el código HTML, y la impresión de datos en una lista desplegable.

<?php
  $mysqli = new mysqli('localhost', 'demo', 'root', 'Base_datos');
?>
<html>
<head>
  <title>Demo de menú desplegable</title>
  <meta charset=utf-8" />
</head>
<body>
  <div align="center">                        
    <p>Seleccione un pais del siguiente menú:</p>
    <p>Paises:
      <select>
        <option value="0">Seleccione:</option>
        <?php
          $query = $mysqli -> query ("SELECT * FROM paises");
          while ($valores = mysqli_fetch_array($query)) {
            echo '<option value="'.$valores[id].'">'.$valores[paises].'</option>';
          }
        ?>
      </select>
      <button>Enviar</button>
    </p>
  </div>
</body>

</html>

LLenar SELECT usando PDO PHP

Usaremos la misma base de datos llamado «países» que tenemos líneas arriba o lo pueden descargar en la parte final del articulo

A) PDO conexión con MySQL

Este tipo de conexiones aumenta la seguridad de conexión con PHP y MySQL

$usuario = 'root';
$password = '';
$db = new PDO('mysql:host=localhost;dbname=php_llenarselect', $usuario, $password);

B) La consulta SQL usando PDO

Una vez que nos conectamos a MySQL podemos crear la estructura de la consulta PDO. Por lo tanto, invocaremos a la tabla que tiene los registros para mostrarlo en nuestro select.

$query = $db->prepare("SELECT * FROM paises");
$query->execute();
$data = $query->fetchAll();

C) Usando ciclo foreach

Hay varios ciclos para mostrar resultados, por ejemplo, el ciclo WHILE o FOREACH. Para este ejemplo usaremos foreach.

foreach ($data as $valores):
echo '<option value="'.$valores["id"].'">'.$valores["paises"].'</option>';
endforeach;

De esta manera usando un tipo de conexión más sólido. Además, también podemos mostrar resultados en nuestras etiquetas SELECT

Archivo completo del ejemplo en PDO

<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="favicon.ico">
<title>Llenar select HTML con MySQL PHP: Ejemplos - BaulPHP</title>

<link href="dist/css/bootstrap.min.css" rel="stylesheet">

<link href="assets/sticky-footer-navbar.css" rel="stylesheet">
</head>

<body>
<header> 

<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark"> <a class="navbar-brand" href="#">BaulPHP</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button>
<div class="collapse navbar-collapse" id="navbarCollapse">
<ul class="navbar-nav mr-auto">
<li class="nav-item active"> <a class="nav-link" href="index.php">Inicio <span class="sr-only">(current)</span></a> </li>
</ul>
<form class="form-inline mt-2 mt-md-0">
<input class="form-control mr-sm-2" type="text" placeholder="Buscar" aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Busqueda</button>
</form>
</div>
</nav>
</header>


<div class="container">
<h3 class="mt-5"><a href="" target="_blank">Llenar select HTML con MySQL PHP</a></h3>
<hr>
<div class="row">
<div class="col-12 col-md-12"> 


<?php
$usuario = 'root';
$password = '';
$db = new PDO('mysql:host=localhost;dbname=php_llenarselect', $usuario, $password);
?>
<div align="left">
<p>Seleccione un pais del siguiente menú:</p>
<form class="form-inline">
<div class="form-group mb-2">
<label for="staticEmail2">Paises:</label>
</div>
<div class="form-group mx-sm-3 mb-2">
<label for="paises" class="sr-only">Paises:</label>
<select class="form-control" >
<option value="">Seleccione:</option>
<?php
$query = $db->prepare("SELECT * FROM paises");
$query->execute();
$data = $query->fetchAll();

foreach ($data as $valores):
echo '<option value="'.$valores["id"].'">'.$valores["paises"].'</option>';
endforeach;
?>
</select>
</div>
<button class="btn btn-primary mb-2">Enviar</button>
</form>
</div>

</div>
</div>


</div>

<footer class="footer">
<div class="container"> <span class="text-muted">
<p>Códigos <a href="" target="_blank">BaulPHP</a></p>
</span> </div>
</footer>
<script src="assets/jquery-1.12.4-jquery.min.js"></script>

<script src="dist/js/bootstrap.min.js"></script>
</body>
</html>

Buscador en SELECT

Si buscan un buscador dentro de in select aquí les dejo un artículo que hablo sobre un buscador en Select usando SELECT2 con PHP, MySQL y PDO

Buscador en SELECT
Buscador en SELECT

Espero que el ejemplo les sea de utilidad y gracias por visitar mi blog, no se olviden de suscribirse para que reciban en su correo las últimas novedades de PHP.

Llenar select HTML con MySQL PHP Ejemplos
Llenar select HTML con MySQL PHP Ejemplos

CONCLUSIÓN: Llenar select HTML

Hemos aprendido a implementar la conexión PDO para mostrar resultaos en una etiqueta SELECT

El uso de etiquetas select es muy usado en el entorno de desarrollo de software web. Por lo tanto, el principal objetivo es que sean dinámicas a la hora de mostrar información.

La aplicación que presentamos es muy sencilla, su curva de implementación en muy fácil de instalar en nuestros sistemas web. Sin embargo, en este artículo mostraremos un ejemplo completo con MySQL.

DESCARGA

Ver Demo Descargar Código Fuente

¿De cuánta utilidad te ha parecido este contenido?

¡Haz clic en una estrella para puntuarlo!

Promedio de puntuación 5 / 5. Recuento de votos: 12

Hasta ahora, ¡no hay votos!. Sé el primero en puntuar este contenido.

Scroll al inicio
Esta web utiliza cookies propias para su correcto funcionamiento. Contiene enlaces a sitios web de terceros con políticas de privacidad ajenas que podrás aceptar o no cuando accedas a ellos. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos.
Privacidad