Problem z odświeżaniem diva

0

Witam, mam problem z odświeżaniem elementu <div id="chatbox">, element się odświeża lecz nie wyświetla ostatniego rekordu w bazie. Po dodaniu kolejnego wyświetla sie poprzedni. Dopiero odświeżenie strony spowoduje wyświetlenie całej bazy, a chodzi mi o to by odświeżał jedynie ten element gdyż ma to być ala chatbox. W insert.php mam metodę w której dodaje wartości do bazy. W ``select.php mam metodę do pobierania wartości z bazy i wypisywanie. Chciałbym to zrobić na jednym przycisku po kliknięciu dodaje do bazy i wyświetla wynik w tym divie.

<!DOCTYPE html>
<html lang="pl">
<head>
    <title>Insert</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $("#button").click(function(){
                var tresc=$("#tresc").val();
                $.ajax({
                    url:'insert.php',
                    method:'POST',
                    data:{
                        tresc:tresc
                    }
                });
            });
              $("#button").click(function(){
              $("#wypisz").load("select.php");
            });
      });
    </script>
</head>
<body>
<div id="wypisz">

</div>
    <input type="text" name="tresc" id="tresc"> 
    <button type="submit" id="button">SAVE</button>   
    <button type="submit" id="button1">reload</button>  
</body>
</html>
0

Jeśli zasadniczo działa, tyle że do odczytuje o jeden post mniej, niż ich tam obecnie masz w bazie, to sprawdź, co dokładnie robi select.php, bo pewnie takie właśnie cofnięte o 1 dane dostarcza.

Ew. przetestuj funkcję dopisu do bazy i odczytu z bazy na osobnych przyciskach i odpal po sobie w odstępie ze 2 sekund, bo może próbujesz czytać coś, co się jeszcze nie zdążyło zapisać. Pewnie nie o to chodzi, ale tak dla pewności.

0 
<?php
require_once "connect.php";
$conn = mysqli_connect($host, $db_user, $db_password, $db_name);

if ($conn->connect_error) {
  die("Connection failed: " . $conn->connect_error);
}

$sql = "SELECT * FROM data"; 
$result = $conn->query($sql);

if ($result->num_rows > 0) {
 while($row = $result->fetch_assoc()) {

echo "<div>".$row['id']." ".$row['name']."<div>";

}
}
else 
{
  echo "0 results";
}
$conn->close();
?>

a to jest ten select moim zdaniem wyswietla prawidlowo, bo jesli odswieze przegladarke to wyswietla wszystko

0

select.php jest raczej ok. Czyli wychodzi, że chyba faktycznie problem z asynchronicznością.
Nie wiem, jak to tam działa w jQuery, ale w gołym JS możesz sobie ajaksowo wysłać dane na serwer, poczekać na odpowiedź serwera i dopiero wtedy wywołać kolejną akcję, czyli np. ajaksowy odczyt zapisanych danych.

Inne (sugerowane) rozwiązanie podczas robienia czegoś w rodzaju chata to websockets.

0

Coś nie tak jest z przypisaniem zdarzeń (masz dwa razy button). Chyba czas zacząć używać poważne nawy button-save, button-reload itd. Po ajax pewnie potrzebujesz obsłużyć fail (żeby dać znać użytkownikowi, że coś poszło nie tak) oraz done (aby zaktualizować widok).

0

Kod się nie zgadza z opisem, ale strzelam, że wykonujesz ajax i load bez czekania. Wtedy do serwera lecą dwa requesty i masz wyścig o dane. Najwyraźniej select.php się kończy szybciej niż insert i dostajesz dane sprzed zmiany. Wrzuć load do callbacka success (albo done, jak zostało zaproponowane wyżej), żeby się wykonał, gdy insert się zakończy.

1 użytkowników online, w tym zalogowanych: 0, gości: 1