Ankündigung

Einklappen
Keine Ankündigung bisher.

Ajax: Aus der Datenbank weitere Einträge holen/anzeigen

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Ajax: Aus der Datenbank weitere Einträge holen/anzeigen

    Hallo Forum,

    ich komme an einer - für euch vermutlich ganz einfachen - Stelle nicht weiter. Mein Vorhaben: Ich gebe etwas in das Inputfenster ein und mir werden entsprechende Einträge (sowie Google) angeboten und ich wähle eins davon aus. Das funktioniert auch soweit problemlos. Nur möchte ich gerne, dass nach der Auswahl eines der angebotenen Einträge weitere Daten aus der Datenbank geholt und angezeigt werden. So ungefähr:

    Image 1.png

    Dazu bedarf es wahrscheinlich nur einer kleinen Modifikation der folgenden Datei:

    (readdata.php

    PHP-Code:

    <?php
    require_once("db.php");
    $db_handle = new DBController();
    if(!empty(
    $_POST["keyword"])) {
    $query ="SELECT * FROM country WHERE country_name like '" $_POST["keyword"] . "%' ORDER BY country_name LIMIT 0,6";
    $result $db_handle->runQuery($query);
    if(!empty(
    $result)) {
    ?>
    <ul id="country-list">
    <?php
    foreach($result as $country) {
    ?>
    <li onClick="selectCountry('<?php echo $country["country_name"]; ?>');"><?php echo $country["country_name"]; ?></li>
    <?php ?>
    </ul>
    <?php } } ?>
    (index.php)

    PHP-Code:

    <html>
    <
    head>
    <
    TITLE>jQuery AJAX Autocomplete with example</TITLE>
    <
    head>
    <
    script src="https://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>
    <script>
    $(document).ready(function(){
    $("#search-box").keyup(function(){
    $.ajax({
    type: "POST",
    url: "readdata.php",
    data:'keyword='+$(this).val(),
    beforeSend: function(){
    $("#search-box").css("background","#FFF url(LoaderIcon.gif) no-repeat 165px");
    },
    success: function(data){
    $("#suggesstion-box").show();
    $("#suggesstion-box").html(data);
    $("#search-box").css("background","#FFF");
    }
    });
    });
    });

    function selectCountry(val) {
    $("#search-box").val(val);
    $("#suggesstion-box").hide();
    }
    </script>
    </head>
    <body>
    <div class="frmSearch">
    <input type="text" id="search-box" placeholder="Country Name" />
    <div id="suggesstion-box"></div>
    </div>
    </body>
    </html> 
    (db.php)

    PHP-Code:

    <?php
    class DBController {
    private 
    $host "localhost";
    private 
    $user "username";
    private 
    $password "password";
    private 
    $database "database_name";
    private 
    $conn;

    function 
    __construct() {
    $this->conn $this->connectDB();
    }

    function 
    connectDB() {
    $conn mysqli_connect($this->host,$this->user,$this->password,$this->database);
    return 
    $conn;
    }

    function 
    runQuery($query) {
    $result mysqli_query($this->conn,$query);
    while(
    $row=mysqli_fetch_assoc($result)) {
    $resultset[] = $row;

    if(!empty(
    $resultset))
    return 
    $resultset;
    }

    function 
    numRows($query) {
    $result  mysqli_query($this->conn,$query);
    $rowcount mysqli_num_rows($result);
    return 
    $rowcount
    }
    }
    ?>

    Danke für die Hilfe.

  • #2
    Du musst in der Funktion selectCountry() nochmals einen Ajax-Request abschicken an ein Script, welches Dir diese Informationen zurückgibt. Anschliessend kannst du die darstellen.

    Kommentar


    • #3
      Warum verwendest du eine veraltete Jquery Version? https://jquery.com/
      PHP-Code:
      $query ="SELECT * FROM country WHERE country_name like '" $_POST["keyword"] . "%' ORDER BY country_name LIMIT 0,6"
      Hier solltest du unbedingt prepared statements verwenden, das ist kein kann sondern ein Muss, sonst hast du eine Sicherheitslücke.
      Daten aus Formularen sollte man immer misstrauen und vom Schlimmsten ausgehen, wenn die Daten erst ein mal weg sind ist nämlich das Gejammer gross.

      Das solltest du zuerst ändern, danach kommst du wieder.

      Kommentar


      • #4
        Zitat von protestix Beitrag anzeigen
        Warum verwendest du eine veraltete Jquery Version? https://jquery.com/
        PHP-Code:
        $query ="SELECT * FROM country WHERE country_name like '" $_POST["keyword"] . "%' ORDER BY country_name LIMIT 0,6"
        Hier solltest du unbedingt prepared statements verwenden, das ist kein kann sondern ein Muss, sonst hast du eine Sicherheitslücke.
        Daten aus Formularen sollte man immer misstrauen und vom Schlimmsten ausgehen, wenn die Daten erst ein mal weg sind ist nämlich das Gejammer gross.

        Das solltest du zuerst ändern, danach kommst du wieder.
        Hallo protesix,

        erstmal vielen Dank für den Hinweis. Ich musste mich etwas einlesen in das Thema. Es funktioniert jetzt fast perfekt. Das einzige kleine Problem ist manchmal, obwohl man einen vorgeschlagenen Eintrag auswählt, dass die vorgeschlagenen Einträge weiterhin angezeigt wird.



        dbcontroller.php


        PHP-Code:
        <?php
        class DBController {
            private 
        $host "localhost";
            private 
        $user "admin";
            private 
        $password "";
            private 
        $database "meine_db";
            private 
        $conn;

            function 
        __construct() {
                
        $this->conn $this->connectDB();
            }

            function 
        connectDB() {
                
        $conn mysqli_connect($this->host,$this->user,$this->password,$this->database);
                return 
        $conn;
            }

            function 
        runQuery($query) {
                
        $result mysqli_query($this->conn,$query);
                while(
        $row=mysqli_fetch_assoc($result)) {
                    
        $resultset[] = $row;
                }        
                if(!empty(
        $resultset))
                    return 
        $resultset;
            }

            function 
        numRows($query) {
                
        $result  mysqli_query($this->conn,$query);
                
        $rowcount mysqli_num_rows($result);
                return 
        $rowcount;    
            }
        }
        ?>

        index.php


        PHP-Code:
        <html>
        <
        head>
        <
        TITLE>jQuery AJAX</TITLE>
        <
        head>
        <
        style>
        body{width:610px;}
        /* .frmSearch {border: 1px solid #a8d4b1;background-color: #c6f7d0;margin: 2px 0px;padding:40px;border-radius:4px;} */
        #customer-list{float:left;list-style:none;margin-top:-3px;padding:0;position: absolute;}
        #customer-list li{padding: 10px; background: #f0f0f0; border-bottom: #bbb9b9 1px solid;}
        #customer-list li:hover{background:#ece3d2;cursor: pointer;}
        #search-box{padding: 10px;border: #040404 1px solid;border-radius:4px;}
        </style>

        <
        script src="https://code.jquery.com/jquery-latest.js" type="text/javascript"></script>

        <script>
        $(document).ready(function(){
            $("#search-box").keyup(function(){
                $.ajax({
                type: "POST",
                url: "readCustomer.php",
                data:'keyword='+$(this).val(),
                beforeSend: function(){
                    $("#search-box").css("background","#FFF url(LoaderIcon.gif) no-repeat 165px");
                },
                success: function(data){
                    $("#suggesstion-box").show();
                    $("#suggesstion-box").html(data);
                    $("#search-box").css("background","#FFF");
                }
                });
            });
        });

        function selectcustomer(val) {
        $("#search-box").val(val);
        $("#suggesstion-box").hide();
        }
        </script>
        </head>
        <body>
        <div class="frmSearch">
        <input type="text" autocomplete="off" id="search-box" placeholder="Kunde" size="60" />
        <div id="suggesstion-box"></div>
        </div>
        </body>
        </html> 

        readCustomer.php


        PHP-Code:
        <?php
        require_once("dbcontroller.php");
        $db_handle = new DBController();
        if(!empty(
        $_POST["keyword"])) {
        $query ="SELECT * FROM kunden WHERE kunde like '%" $_POST["keyword"] . "%' ORDER BY kunde LIMIT 0,6";


        $result $db_handle->runQuery($query);
        if(!empty(
        $result)) {
        ?>
        <ul id="customer-list">
        <?php
        foreach($result as $customer) {
        ?>
        <li autocomplete="off" onClick="selectcustomer('<?php echo $customer["kunde"] . ' · ' ; echo $customer["str"] . ' · ' ; echo $customer["postleitzahl"] . ' ' ; echo $customer["ort"]; ?>');"><?php echo $customer["kunde"] . ' · ' ; echo $customer["str"] . ' · ' ; echo $customer["postleitzahl"] . ' ' ; echo $customer["ort"]; ?></li>

        <?php ?>
        </ul>
        <?php } } ?>

        Kommentar

        Lädt...
        X