Elemento seleccionado de la lista desplegable: datos de llamada / recuperación

I have a dropdown list on a web form containing dates. My Question: How can I call data for that selected item(date) from a MySQL database and display it to the user? And more specifically, if that selected date has no data in the data base, I want to be able to display that as well. I'm looking for a Javascript solution, and if possible a php solution(preferred).

¡Gracias!

preguntado el 09 de marzo de 12 a las 16:03

Do you have any example code that you have tried? It is a lot easier if you try first, then we can show you were to go? Have you done this google search "jQuery select dropdown" Lots of goodies -

yes I've done some research on the internet but I couldn't find any applicable ones, the only ones that I could find were ASP solutions -

3 Respuestas

If you don't want to have to refresh the page, you could use AJAX to make an asynchronous call to another PHP page, passing the selected date as a url parameter. This other PHP page could run the query on the database and return whatever values you need so your page is updated with the results of the query.

I recommend using jQuery's AJAX capabilities. He aquí un buen ejemplo.

respondido 09 mar '12, 16:03

Edit: These samples use PHP and CSS

The first step is to open a connection with the MySQL database. You will need some info from your hosting provider for this to work, but usually, it looks something like this:

<?php

    $connection = mysql_connect("", "root@localhost", "")
    or die("Couldn't connect: ".mysql_error());

    mysql_select_db("SOME_TABLE", $connection)
    or die( "Unable to select database");

Next, you'll retrieve the date data from whatever table you're using. You can use php's mysql_fetch_array function to select all the table info from the earlier select statement. The returned value equals a $row array with columns as indexes.

    $res = mysql_query("SELECT DATE FROM SOME_TABLE");

?>

The next step is to generate the drop down divs. I'm not completely sure how to check if a table is empty, but I think I got it right in the code below:

<!DOCTYPE html>
<html>
    <head>
        <title>Drop down!</title>
    </head>
    <body>

    <?php 

        $row = mysql_fetch_array($res,MYSQL_NUM);
        if($row == null) { //This I'm not positive about

    ?>

        <div class="dropdown">NUTHIN</div>

    <?php

             } else {

             while($row=mysql_fetch_array($res,MYSQL_NUM)){ ?>


    <div class="dropdown">
        <?php echo $row[0] ?>
    </div>

<?php } } ?>

    </body>
</html>

After you get all of this working, getting a drop-down menu to function is a cinch. In fact, it can be done purely with CSS. Here's an example:

<head>
<style>
#menu_group {
    position:relative;
    width:200px;
    background-color:#F00;
}
.menu_item {
    display:none;
    background-color:#FF0;

}

#menu_group:hover > .menu_item {
    display:block;
}
</style>

</head>
<body>

<div id="menu_group">Something
    <div class="menu_item">1</div>
    <div class="menu_item">2</div>
    <div class="menu_item">3</div>
</div>
</body>

Here's how it works: if the user hovers over an element with an id of menu_group, all child elements with a class name of menu_item will change their display propiedad de none (ala invisible) to block (visible block-level element).

Hope that all helped. I have no guarantees that this code will work flawlessly, except the CSS drop-down anyway.

respondido 09 mar '12, 16:03

Thank you so much, great answer. I would like to know why you used divs and CSS for your dropdown list, and not <form> and <input> tags? Or doesn't that really matter? - Diestro Dave

@DextrousDave I figured that you were constructing a main page link menu, or something similar. Regardless, it shouldn't matter too much. Just create the elements you need via a server-sided language, and then apply the css to those elements once you know they are working. - Jeffrey Sweeney

create a table with an id field, datetime and other relevant information. on the change event in javascript use an ajax call to your database (by DateTime) and render it onto your page

respondido 09 mar '12, 16:03

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.