Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [PHP][AJAX][MySQL][JavaScript] Aktualizacja danych bez przeładowania strony
Forum PHP.pl > Forum > Przedszkole
szymek001
12.07.2012, 15:43:42
Witam, próbuję zrobić aktualizację danych w panelu administracyjnym za pomocą AJAX'a. Chcę by po kliknięciu buttona dane zostały zaktualizowane, a na stronie ma się pojawić nowy wynik.
Znalazłem ciekawy skrypt w technologii AJAX:
[PHP] pobierz, plaintext 
  1. <head>
  2. <script src="jquery.js"></script>
  3. <script>
  4.   function UpdateRecord(id)
  5.   {
  6.       jQuery.ajax({
  7.        type: "POST",
  8.        url: "update.php",
  9.        data: 'id='+id,
  10.        cache: false,
  11.        success: function(response)
  12.        {
  13.          alert("Record successfully updated");
  14.        }
  15.      });
  16.  }
  17. </script>
  18. </head>
  19. <body>
  20. <input type="button" id="button_id" value="Update" onClick="UpdateRecord(1);">
  21. </body>
[PHP] pobierz, plaintext

jednak nie potrafię w nim przesłać danych do pliku update.php. Oczywiście biblioteki jQuery są poprawnie podpięte.

--------------------------------------

Znalazłem też inny skrypt, który aktualizuje poprawnie dane w bazie:
[PHP] pobierz, plaintext 
  1. <script type="text/javascript">
  2. function updateuser() {
  3.     var ud_id = $('input[name="ud_id"]').val();
  4.     var ud_first = $('input[name="ud_first"]').val();
  5.     var ud_last = $('input[name="ud_last"]').val();
  6.  
  7.     if (window.XMLHttpRequest) {
  8.         xmlhttp = new XMLHttpRequest();
  9.     }
  10.     xmlhttp.onreadystatechange = function () {
  11.         if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
  12.             document.getElementById("txtuser").innerHTML = xmlhttp.responseText;
  13.         }
  14.     }
  15.     xmlhttp.open("GET", "ajaxupdate.php?ud_id=" + ud_id + "&ud_first="+ud_first+"&ud_last="+ud_last, true);
  16.     xmlhttp.send();
  17. }
  18. </script>
  19.  
  20. <form name="test">
  21.    ID Number: <input name="ud_id"><br>
  22.    First Name: <input type="text" name="ud_first"><br>
  23.    Last Name: <input type="text" name="ud_last"><br>
  24. <input type="button" onClick="updateuser()" value="Update">
  25. </form>
[PHP] pobierz, plaintext



ajaxupdate.php:
[PHP] pobierz, plaintext 
  1. <?php  include 'dbc.php';
  2.  
  3. $id=$_GET['ud_id'];
  4. $first=$_GET['ud_first'];
  5. $last=$_GET['ud_last'];
  6.  
  7.  
  8. $query="UPDATE users SET address='$first', country='$last' WHERE id='$id'";
  9. mysql_query($query);
  10. mysql_close();
  11. ?>
[PHP] pobierz, plaintext


Ten drugi niby działa i zmienia dane w bazie, nie potrzebuje biblioteki jQuery, jednak nie wiem jak dodać do niego komunikat o tym że dana wartość została zaktualizowana i jak po naciśnięciu przycisku odświeżyć te dane na stronie..
Dane które aktualizuje są w polach input type="text".


programistaarek
15.07.2016, 23:42:16 
[PHP] pobierz, plaintext 
  1. <?php  include 'dbc.php';
  2.  
  3. $id=$_GET['ud_id'];
  4. $first=$_GET['ud_first'];
  5. $last=$_GET['ud_last'];
  6.  
  7.  
  8. $query="UPDATE users SET address='$first', country='$last' WHERE id='$id'";
  9. echo "Zaktualizowano dane ";
  10. mysql_query($query);
  11. mysql_close();
  12. ?>
[PHP] pobierz, plaintext
szczemp
16.07.2016, 13:57:37
Cytat(szymek001 @ 12.07.2012, 16:43:42 ) *
Witam, próbuję zrobić aktualizację danych w panelu administracyjnym za pomocą AJAX'a. Chcę by po kliknięciu buttona dane zostały zaktualizowane, a na stronie ma się pojawić nowy wynik.
Znalazłem ciekawy skrypt w technologii AJAX:
[PHP] pobierz, plaintext 
  1. <head>
  2. <script src="jquery.js"></script>
  3. <script>
  4.   function UpdateRecord(id)
  5.   {
  6.       jQuery.ajax({
  7.        type: "POST",
  8.        url: "update.php",
  9.        data: 'id='+id,
  10.        cache: false,
  11.        success: function(response)
  12.        {
  13.          alert("Record successfully updated");
  14.        }
  15.      });
  16.  }
  17. </script>
  18. </head>
  19. <body>
  20. <input type="button" id="button_id" value="Update" onClick="UpdateRecord(1);">
  21. </body>
[PHP] pobierz, plaintext

jednak nie potrafię w nim przesłać danych do pliku update.php. Oczywiście biblioteki jQuery są poprawnie podpięte.

[HTML] pobierz, plaintext 
  1.         $.ajax({
  2.             method: 'post',
  3.             url: 'update.php',
  4.             data: {id: id_do_aktualizacji},
  5.             success: function (html) {
  6.                 alert('Record successfully updated');
  7.             },
  8.             error: function(jqXHR, textStatus, errorThrown) {
  9.                 console.log(textStatus, errorThrown);
  10.             }
  11.         });
[HTML] pobierz, plaintext
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.