es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

La opción seleccionada desaparece en el menú desplegable PHP – Sin AJAX.

18 Jun, 2023 Programación

Lo que sea que elija en el menú desplegable desaparece de mi pantalla inmediatamente después. ¿Alguna idea de cómo resolver esto?

<?php
    include "includes/Get_clubs.inc.php";
?>

<body>
    <div class="club-wijzigen">
        <form action="<?php echo htmlspecialchars($SERVER['PHP_SELF']) ?>" method="post">
            <div class="club-wijzigen-main-left">
                <label class="club-wijzigen-label-1">Club :</label>

            <select id="club_list" name="club_naam" class="club-list" onchange="this.form.submit()">
                <option value="">--- Seleccionar ---</option>
                <?php
                    foreach ($result_array_all_clubs as $club) {   //  Data from "includes/Get_clubs.inc.php"
                        $club_name = $club['Naam'];
                        $club_nr = $club['Stamnummer'];
                        echo "<option value='" . $club_nr . "'>" . $club_name . "";
                    }
                ?>
            </select>

       </div>
  </form>
</div></body>
<?php
    if(isset($POST["club_naam"])){
        $clubname_chosen = $POST["club_naam"];
        echo "<br>CLUB ELEGIDA: " . $clubname_chosen . "<br>";
?>

El problema es, supongo, que la página se recarga cada vez que se elige una nueva opción en el menú desplegable, lo que significa que el menú desplegable se está rellenando de nuevo.

Busqué respuestas, pero no encontré nada sin AJAX. Intenté:

<option value=""><?php echo $club_name ?></option>

y

<option value="?php echo $club_name ?>"></option>

pero sin éxito. ¡Toda ayuda sería muy apreciada!

Tags:  , , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Parece que el problema está en el evento onchange del elemento select. Actualmente, está configurado en “this.form.submit()”, lo que recarga la página cada vez que se elige una nueva opción.

    Una solución podría ser usar AJAX para actualizar la página sin recargarla. Otra solución podría ser eliminar el evento onchange y agregar un botón de envío en su lugar.

    Aquí hay un ejemplo de solución usando un botón de envío:

    <?php 
include "includes/Get_clubs.inc.php";
?>

<body>
    <div class="club-wijzigen">
        <form action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']) ?>" method="post">
            <div class="club-wijzigen-main-left">
                <label class="club-wijzigen-label-1">Club :</label>

                <select id="club_list" name="club_naam" class="club-list">
                    <option value="">--- Seleccionar ---</option>
                    <?php foreach ($result_array_all_clubs as $club) : ?>
                        <?php 
                            $club_name = $club['Naam'];
                            $club_nr = $club['Stamnummer'];
                        ?>
                        <option value="<?php echo $club_nr ?>"><?php echo $club_name ?></option>
                    <?php endforeach ?>
                </select>

                <button type="submit">Enviar</button>
           </div>
        </form>

        <?php 
            if(isset($_POST["club_naam"])){
                $clubname_chosen = $_POST["club_naam"];
                echo "<br>CLUB ELEGIDO: " . $clubname_chosen . "<br>";
            }
        ?>
   </div>
</body>

    Tenga en cuenta que el evento onchange se ha eliminado del elemento select y se ha agregado un botón de envío al final del formulario. Cuando el usuario selecciona una opción del menú desplegable, puede hacer clic en el botón de envío para actualizar la página con el club elegido.

    ¡Espero que esto ayude! Háganme saber si tienen más preguntas.

Comments are closed.