0

Estoy haciendo un formulario de relleno con dos select, pero quiero que en el segundo me salgan opciones dependiendo del resultado de lo que he seleccionado en el primero, asi va quedando:

   <div class="form-group">
<label>Categoria: </label>
<select class="form-control" name="categoria">
    <option>Seleccione... </option>
    <option value="Bolsa de Trabajo">Bolsa de Trabajo</option>
    <option value="Compra y Venta">Compra y Venta</option>
</select>

    <div class="form-group">
<label>Subcategoria: </label>
<select class="form-control" name="subcategoria">
        <?php
        if(categoria == null){
        ?>
        <option>Seleccione... </option>
        <?php
        }else if(categoria == "Bolsa de Trabajo"){
        ?>
        <option>Seleccione... </option>
        <option>Busco Empleo</option>
        <?php
        }else if(categoria == "Compra y Venta"){
        ?>
        <option>Seleccione... </option>
        <option>Busco Producto</option>
        <?php
        }
        ?>
 </select>       

por ejemplo si en el primer select selecciono compra y venta quiero que el segundo select salgan las opciones de busco trabajo como se muestra en el codigo, ¿que se debe corregir para que se pueda lograr? Saludos

1
  • aqui el error es que el php es compliado desde el servidor, por ende cuando carga el html el php ya ha cargado, entonces debes inplementar una funcion de js para que este a la escucha del evento del cambio
    – srJJ
    Commented el 17 jul. 2018 a las 0:48

1 respuesta 1

0

Bro, bueno aqui te voy a dejar algo de codigo, que creo que tiene lo que necesitas, de ahi para alla solo es cuestion de jugar con las posibilidades

tu codigo html seria asi...

<div class="form-group">
<label>Categoria: </label>
  <select class="form-control" id="categoria" name="categoria">
      <option>Seleccione... </option>
      <option  value="Bolsa de Trabajo">Bolsa de Trabajo</option>
      <option  value="Compra y Venta">Compra y Venta</option>
  </select>

  <div class="form-group">
  <label>Subcategoria: </label>
  <select id="Subcategoria" class="form-control" name="subcategoria">
      <option>Seleccione... </option>
   </select>
 </div>

y el codigo js seria este....

<script>
$(document).ready(function(){

  $("#categoria").change(function(){

     var seleccion = document.getElementById("Subcategoria");
     var opcion = document.createElement("option");

    if ( $("#categoria").val() == "Bolsa de Trabajo") {

        opcion.value= 1;
        opcion.text = "Busco Empleo";
        seleccion.add(opcion);

    }else if ( $("#categoria").val() == "Compra y Venta") {

        opcion.value= 1;
        opcion.text = "Busco Producto";
        seleccion.add(opcion);
    }

  });

});
</script>

espero te sirva y la marque como valida la respuesta. By: JJ

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.