Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [AJAX][jquery] Skrypt wykonuje się tylko raz ?
Forum PHP.pl > Forum > Przedszkole
oomaster
Witam,

Dlaczego ten kod wykonuje się tylko raz ? W założeniu ma działać bez przeładowania strony a co za tym idzie działać milion razy jak tylko go się poprosi smile.gif A on raz wykonuje swoją misje wzorowo a już drugi raz ani drgnie !

[JAVASCRIPT] pobierz, plaintext
  1. $(document).ready(
  2. function()
  3. {
  4.  
  5. $("#but").click(function(){
  6. $.ajax({
  7. type: "POST",
  8. url: "data.php",
  9. beforeSend: function(html){
  10. $("#info").html("Loading...");
  11. },
  12. success: function(html){
  13. $("#info").html("OK dodałem").fadeOut(5000);
  14. },
  15. error: function(html){
  16. $("#info").html("Wystąpił bład").fadeOut(5000);
  17. }
  18. });
  19.  
  20. });
  21. });
[JAVASCRIPT] pobierz, plaintext

  1. <form method="POST">
  2. <input type="text" name="ist"></input>
  3. <input type="button" id="but" value="xyz"/>
  4. </form>
  5. <div id="info"></div>
nospor
a skad wiesz ze sie drugi raz nie wykonuje?
oomaster
Po sprawdzeniu funkcją complete wychodzi na to ,że żądanie się wykonuje lecz komunikaty się już nie pojawiają. Dlaczego ?
nospor
Komunikat ustawiasz zawsze taki sam. Trudno bys zauwazyl roznice jesli za drugim razem ustawiassz taki sam komunikat co juz jest
oomaster
Z tym ,że chciałbym aby pokazywało się znowu ładowanie i ok lub error smile.gif

Ale mam 2 mniejszy problem, nie mogę zmiennych wyłuskać ?!

w skrypcie data.php mam:
  1. <?
  2. $_GET["in1"];
  3. ?>

a w kodzie używam:
  1. <input type="text" name="in1"></input>

[JAVASCRIPT] pobierz, plaintext
  1. data: {in1: $in1},
  2. dataType: "html",
[JAVASCRIPT] pobierz, plaintext


czy to jest dobry sposób na przesyłanie z formalarza do skrypt danych ? bo jakoś mi nie działa.
evolucja
Nie znam się na tym, ale na pierwszy rzut oka w tym może być błąd:
7 linijka to
  1. type: "POST",

a dane chcesz odebrać getem smile.gif
oomaster
Spoko zapomniałem o tym ale wkleję może pełen kod to ktoś zorientowany będzie wiedział może dlaczego się nie przesyła z formularza do skryptu:

[JAVASCRIPT] pobierz, plaintext
  1. $(document).ready(
  2. function()
  3. {
  4. $.ajax({
  5. type: "GET",
  6. url: "data.php",
  7. data: {in1: $in1},
  8. dataType: "html",
  9. beforeSend: function(html){
  10. $("#info").html("Loading...");
  11. },
  12. success: function(html){
  13. $("#info").html("OK dodałem").fadeOut(5000);
  14. },
  15. error: function(html){
  16. $("#info").html("Wystąpił bład").fadeOut(5000);
  17. },
  18. complete: function(html){
  19. alert("Żądanie zostało zakończone");
  20. }
  21.  
  22. });
  23.  
  24. });
[JAVASCRIPT] pobierz, plaintext

  1. <form method="POST" id="form" style="display: inline;">
  2. <input type="text" name="in1" />
  3. <input type="button" id="but" value="xyz"/>
  4. </form>
  5. <div id="info" style="display: inline;"></div>

  1. <?php
  2. include_once("db.inc.php");
  3.  
  4. $id= $_GET["in1"];
  5.  
  6. $sql = "INSERT INTO test SET nazwa='$id' ";
  7. if (mysql_query($sql)) {
  8. echo "ok";
  9. } else {
  10. exit('error');
  11. }
  12. ?>


rekord się dodaje lecz zamiast tekstu z zmiennej id pojawia się $id samo jak tekst :/
mortus
Dlatego, że w linijce 7 powinno być:
[JAVASCRIPT] pobierz, plaintext
  1. data: { "in1" : in1 }
[JAVASCRIPT] pobierz, plaintext
gdzie in1 jest zmienną Javascript, a nie zmienną PHP. Oczywiście zmienną php również można wstawić:
  1. data : { "in1" : <?php echo $in1; ?> }


Wytłumaczę jeszcze dlaczego Twój kod nie chce działać. Otóż pierwsze in1 we wspomnianej linijce 7 traktowane jest przez JavaScript jako zmienna, a jako że prawdopodobnie nigdzie takiej zmiennej nie zadeklarowałeś, masz błąd (gdybyś nawet zadeklarował zmienną in1 i przypisał jej wartość, to i tak nie miałoby to sensu). Jeśli masz możliwość to zainstaluj sobie Firebug-a pod Firefox-a, bo to z pewnością ułatwi Ci pracę z JavaScript.
oomaster
Teraz znowu nie działa :/

Firebug wywala to:
Cytat
syntax error
[Break on this error] data : { "in1" : },\n


[JAVASCRIPT] pobierz, plaintext
  1. $("#but").click(function(){
  2. $.ajax({
  3. type: "GET",
  4. url: "data.php",
  5. dataType: "html",
  6. data : { "in1" : <?php echo $in1; ?> }
  7. beforeSend: function(html){
  8. $("#info").html("<img src=gfx/load.gif>");
  9. },
  10. success: function(html){
  11. $("#info").html("<p class=alt>OK</p>").fadeOut(5000);
  12. },
  13. error: function(html){
  14. $("#info").html("<p class=alt>ERROR!</p>").fadeOut(5000);
  15. },
  16. complete: function(html){
  17. alert("Żądanie zostało zakończone");
  18. }
  19.  
  20. });
  21.  
  22. });
[JAVASCRIPT] pobierz, plaintext
mortus
Muszę zapytać, co to jest $in1 i czy plik ma rozszerzenie .php? Na pierwszy rzut oka wygląda na to, że nie ma czegoś takiego jak $in1. Możesz wkleić więcej kodu (głównie chodzi mi o początek, aż do tego skryptu włącznie)?
oomaster
w sekcji head:

[JAVASCRIPT] pobierz, plaintext
  1. <script type="text/javascript">
  2. $(document).ready(
  3. function()
  4. {
  5. $("#link").click(
  6. function()
  7. {
  8. $("div#more").slideToggle("fast");
  9. }).toggle(function() {
  10. $("#foto").attr('src', 'gfx/up.gif');
  11. $('#more').slideDown();
  12. }, function() {
  13. $("#foto").attr('src', 'gfx/down.gif');
  14. $('#more').slideUp();
  15. });
  16.  
  17. $("#but").click(function(){
  18. $.ajax({
  19. type: "GET",
  20. url: "data.php",
  21. data : { "in1" : <?php echo $in1; ?> },
  22. dataType: "html",
  23. beforeSend: function(html){
  24. $("#info").html("<img src=gfx/load.gif>");
  25. },
  26. success: function(html){
  27. $("#info").html("<p class=alt>OK</p>").fadeOut(5000);
  28. },
  29. error: function(html){
  30. $("#info").html("<p class=alt>ERROR!</p>").fadeOut(5000);
  31. },
  32. complete: function(html){
  33. alert("Żądanie zostało zakończone");
  34. }
  35.  
  36. });
  37.  
  38. });
  39. });
  40. </script>
[JAVASCRIPT] pobierz, plaintext

w body:
  1. <form method="POST" id="form" style="display: inline;">
  2. <select name="in1" size="1" class="inals">
  3. <option value="1">-</option>
  4. <option value="2">raz</option>
  5. <option value="3">dwa</option></select>
  6. <input type="button" id="but" value="Dodaj" class="inal"/>
  7. </form>
  8. <div id="info" style="display: inline;"></div>


plik data.php

  1. <?php
  2. include_once("db.inc.php");
  3. usleep(1000000 * .5);
  4.  
  5. $id= $_GET["in1"];
  6.  
  7. $sql = "INSERT INTO test SET nazwa='$id'";
  8. if (mysql_query($sql)) {
  9. echo "ok";
  10. } else {
  11. exit('error');
  12. }
  13. ?>
mortus
Czyli in1 to wartość pobierana z formularza? Zatem linia 21 powinna wyglądać tak:
[JAVASCRIPT] pobierz, plaintext
  1. data: { "in1" : in1 },
[JAVASCRIPT] pobierz, plaintext
A wcześniej (np. linijkę wcześniej) pobieramy wartość select-a:
[JAVASCRIPT] pobierz, plaintext
  1. var in1 = $("input[name=in1]").val();
[JAVASCRIPT] pobierz, plaintext
oomaster
dzieje się coś z tym ,że zamiast np. wpisywać 1 wpisuje undefined dlaczego ?
mortus
Musisz do domyślnej opcji dodać atrybut selected
  1. <option value="1" selected="selected">-</option>
oomaster
Niestety to nie działa
mortus
Niedopatrzenie, to nie jest przecież input, tylko select. Zatem
[JAVASCRIPT] pobierz, plaintext
  1. var in1 = $("select[name=in1]").val();
[JAVASCRIPT] pobierz, plaintext
i powinno działać.
oomaster
Mając:
var in1 = $("select[name=in1]").val();

Skrypt zamiast przesyłać różne zmienne do pliku dane.php przesyła zawsze tą samą, nie zależnie co wybiorę dlaczego ?

Co jest źle w kodzie ?
[JAVASCRIPT] pobierz, plaintext
  1. $(document).ready(
  2. function()
  3. {
  4. var in1 = $("select[name=in1]").val();
  5. $("#but").click(function(){
  6. $.ajax({
  7. type: "GET",
  8. url: "data.php",
  9. data : { "in1" : in1 },
  10. dataType: "html",
  11. beforeSend: function(html){
  12. $("#info").html("load");
  13. },
  14. success: function(html){
  15. $("#info").html("OK");
  16. },
  17. error: function(html){
  18. $("#info").html("ERROR!");
  19. },
  20. complete: function(html){
  21. alert("Żądanie zostało zakończone");
  22. }
  23.  
  24. });
  25.  
  26. });
  27. });
[JAVASCRIPT] pobierz, plaintext

  1. <form method="POST" id="form" style="display: inline;">
  2. <select name="in1" size="1" class="inals">
  3. <option value="1">------</option>
  4. <option value="2">dwa</option>
  5. <option value="3">trzy</option></select>
  6. <input type="button" id="but" value="Dodaj" class="inal"/>
  7. </form>
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.