Foros del Web » Programando para Internet » PHP » CodeIgniter »

Cómo mostrar datos de una BBDD dependiendo del select seleccionado en HTML

Estas en el tema de Cómo mostrar datos de una BBDD dependiendo del select seleccionado en HTML en el foro de CodeIgniter en Foros del Web. Muy buenas! Pues escribo ya que tengo una dudilla y a ver si podéis ayudarme aquí! Estoy realizando un proyecto en CodeIgniter, es una página ...
  #1 (permalink)  
Antiguo 19/05/2014, 16:11
 
Fecha de Ingreso: mayo-2014
Mensajes: 1
Antigüedad: 9 años, 10 meses
Puntos: 0
Cómo mostrar datos de una BBDD dependiendo del select seleccionado en HTML

Muy buenas!

Pues escribo ya que tengo una dudilla y a ver si podéis ayudarme aquí!

Estoy realizando un proyecto en CodeIgniter, es una página web con Front y BackEnd. En esta última parte, de administración, es donde se interactua con la base de datos: inserción, modificación, eliminar datos...
La cuestión es que estoy en la parte de eliminar datos y tengo la vista HTML donde muestro un formulario con: select, textarea y botón eliminar.
Dentro de ese select me salen de opciones los diferentes productos que están en la BBDD. Hasta ahí bien.
Lo que me gustaría conseguir es que cuando se seleccione un producto de ese desplegable, en el textarea me salga el resto de información de ese producto (nombre y precio).

Vamos a ver:

Tengo esta página:



La opción 'Quitar Producto' tiene
Código:
<a href="quitProducto">Quitar Producto</a>
En mi archivo 'routes' tengo esto:

Código:
$route['quitProducto'] = "eliminarProducto";
Por lo que al clickar ahí, va al Controlador 'eliminarProducto'

CONTROLADOR ELIMINARPRODUCTO

Código:
<?php

class EliminarProducto extends CI_Controller {

  function __construct() {
    parent::__construct();
    $this->load->model('eliminarProductoModel');
    //$this->load->model('insertarProductoModel');
  }

  public function index() {
  	//$id = 2;
    $data['productos'] = $this->eliminarProductoModel->getProductos();
    //$data['query'] = $this->insertarProductoModel->ejecutar($id);
    $this->load->view('quitarProducto',$data);
  }
}
En este controlador cargo el modelo 'eliminarProductoModel', y como 'index' es el único método de este controlador, es el que se ejecutará al clickar en 'Quitar Producto'.
Este método (index) guarda en un array ($data['productos']) lo que me devuelve el método 'getProductos();' del modelo 'eliminarProductoModel'.

MODELO ELIMINARPRODUCTOMODEL

Código:
<?php
Class EliminarProductoModel extends CI_Model {

  	public function __construct() {
  		parent::__construct();
  		$this->load->database();
    }

    function ejecutar($sql) {
    	$query = $this->db->query($sql);
        return $query;
    }

    function getProductos() {
      $query = $this->db->query('SELECT id_producto, nombre_producto, precio_producto FROM productos');
      return $query->result();
    }
}
Como véis, lo que devuelve el método 'getProductos()' son todos los productos que tengo en mi base de datos.
Le pasa estos datos al controlador que lo ha llamado (CONTROLADOR ELIMINARPRODUCTO, el que he puesto antes) y este lo que hace es, con su único método index, al terminar de recibir estos datos de los productos, carga finalmente la vista a la que le pasa esos datos ($this->load->view('quitarProducto',$data); visto más arriba).

Entonces se me carga esta vista:



Como podeis ver, en la lista desplegable (select option..) me salen los productos que tengo en mi base de datos.
El código de esta vista es el siguiente:

VISTA QUITARPRODUCTO

Código:
<!DOCTYPE html>
<html lang="en">

<head>

	<meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">

    <title>Somnis Nou Barris</title>

	<link rel="stylesheet" href="<?php echo base_url(); ?>css/estilos.css">

	<script type="text/javascript" src="<?php echo base_url(); ?>js/jquery-1.10.2.min.js"></script>

</head>

<body>
    <center>
	<h2>Eliminar Producto</h2>
    <?php echo form_open('eliminarProducto2'); ?>
        <select name="product" id="product">
            <?php
            foreach($productos as $prods) {
                echo '<option value="'.$prods->id_producto.'">'.$prods->nombre_producto.'</option>';
            }
            ?>
        </select>
        <br><br><br>
        <textarea id="info" disabled></textarea>
        <br />
        <input class="botones" type="submit" value="Eliminar"/>
    </form>
    </center>
</body>

<script>
var controller = 'obtenerdatosProd';
var base_url = '<?php echo base_url(); ?>';

$("#product").change(function() {
    var id = $("#product").val();
    $.ajax({
        'url': base_url+controller+'/index',
        'success' : function(data) {
            var info = $('#info');
            var texto = "CACA";
            info.text(texto);
        }
    }).done(function(data) {
        alert( "Data Send:");
    }).fail(function() {
        alert( "Data Not Send" );
    });
});
</script>
</html>
Como podeis comprobar, dentro del formulario está el select donde pongo los productos que tengo en la base de datos (recibo los datos por parámetro desde el CONTROLADOR ELIMINARPRODUCTO, ya que al cargar la vista le paso la variable $data['productos'] junto al nombre de esta vista).
Justo debajo podeis ver el textarea en el cual quiero que salga la información del producto seleccionado.

En el código de la vista, debajo del todo, podeis ver el script que es jQuery, donde uso lo de $.ajax para poder hacer lo que quiero.
En la variable 'url' le paso el controlador que quiero que ejecute, en este caso es base_url+controller+'/index', lo que es lo mismo que localhost/miapp/obtenerdatosProd/index. obtenerdatosProd es un controlador que va a ser parecido al que he puesto primero (eliminarProducto), ya que se conectará con el mismo modelo usado anteriormente (u otro parecido) que me seleccionará todos los campos de la tabla productos de mi base de datos, pero filtraré por ID dependiendo del producto que esté seleccionado en la lista despegable (select option..).
Con 'success' le digo que cuando se haya ejecutado, me ponga en el textarea un texto.
En este momento el texto es 'CACA'. Lo bueno es que cada vez que selecciono un producto diferente funciona el ajax y me pone en el textarea 'CACA' y me sale un alert que dice 'Data send.' ( .done(function(data) {alert( "Data Send:");}) ), por lo que se que la función funciona!!!

Pero lo que no consigo es pasar el ID del producto seleccionado en el select option al controlador que le digo en 'url': localhost/miapp/obtenerdatosProd/index, ya que ese controlador hará:

CONTROLADOR OBTENERDATOSPROD

Código:
<?php

class ObtenerdatosProd extends CI_Controller {

  function __construct() {
    parent::__construct();
  }

  public function index(comorecibirid) {
  	$id = 2;
  	$this->load->model('eliminarProductoModel');
  	$data['query'] = $this->eliminarProductoModel->getProductosId($id);
    $this->load->view('quitarProducto', $data);
  }
}
El modelo que usa este controlador es el mismo de antes, pero llama a la función getProductosId($id); Ese $id es el que debo recibir del select option de la vista.
La función de ese modelo es sencila:

Código:
    function getProductosId($id) {
      $query = $this->db->query('SELECT id_producto, nombre_producto, precio_producto FROM productos WHERE id=".$id."');
      return $query->result();
    }
Una vez el controlador obtenerdatosPro recibe los datos de este método del modelo, carga la vista otra vez pero pasándole los datos:
($this->load->view('quitarProducto', $data);)

El problema es: cómo envio el id del producto seleccionado del select option en el $.ajax al controlador obtenerdatosPro?? Supongo que por la 'url', pero lo he intentado de muchas maneras: con $id, &id, /id... Pero nunca funciona...
Y cuando funcione: cómo hago para tratar con los datos que devuelve este controlador en el ajax y ponerlos en el textarea?


Siento ser tan pesado, espero haberme explicado bien y a ver si alguien me ilumina!!

Muchas gracias a tod@s!

Saludos

Etiquetas: bbdd, dependiendo, html, seleccionado, select
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 23:24.