Javascript változó átadása php-nak

Javascript változó átadása php-nak
2018-06-04T21:52:12+02:00
2018-06-05T10:40:05+02:00
2022-10-15T21:41:48+02:00
Ben800
Sziasztok !

A célom az lenne az alábbi kóddal, hogyha a User kitölt egy formot, akkor tudjuk melyiket töltötte ki, milyen eredménnyel, és úgy küldjük el sql-be a választ :)

<html> <head> <meta charset="UTF-8"> <title></title> <!-- Latest compiled and minified CSS --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <!-- Optional theme --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> <!-- Latest compiled and minified JavaScript --> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script src="form.js"></script> </head> <body> <?php $servername = "XXXXXX"; $username = "XXXXX"; $password = "XXXXXX"; $dbname = "XXXXX"; // Create connection $conn = new mysqli($servername, $username, $password, $dbname); // Check connection if ($conn->connect_error) { die("Connection failed: " . $conn->connect_error); } if(isset($_POST['variable1'])) { $result = $_POST['Game_1']; $GameID = $_POST['variable1']; $ClientID = 552533; $GetDate = date("Y-m-d-H:i:s"); $query = "INSERT INTO Betting(ClientID,Game_1,CreationDate) VALUES('".$ClientID."','$result','".$GetDate."')"; mysqli_query($conn, $query); } ?> <div style="width:997px"> <form method="POST" action="form.php"> <table class="table-bordered" width="997px" style="background-color: whitesmoke"> <tr><th></th> <th scope="col" colspan="4" style="text-align:center" >június 30. 17:00</th> <th scope="col" ></th> <th scope="col" ></th> <th scope="col" ></th> <th scope="col" ></th> </tr> <tr> <td scope="col" ></td> <td scope="col" style="text-align:center" >Győztes</td> <td scope="col" style="text-align:center" >Döntetlen</td> <td scope="col" style="text-align:center" >Győztes</td> <td scope="col" ></td> </tr> <tr> <td scope="col" ></td> <td scope="col" style="text-align:center"><input type="checkbox" id="myText" name="Game_1" value="Home"></td> <td scope="col" style="text-align:center"><input type="checkbox" id="myText" name="Game_1" value="Draw"></td> <td scope="col" style="text-align:center"><input type="checkbox" id="myText" name="Game_1" value="Away"></td> <td scope="col"></td> </tr> </table> <P style="text-align: center"><INPUT id="Bet_button" TYPE="SUBMIT" onclick="display()" VALUE="Tippelek" NAME="B1"></P> </form> </div> </body> </html> js: function display() { var somevar1 = document.getElementById("myText").name; $.ajax({ type:"POST", url: "form.php", data: {variable1: somevar1}, success: function(data){ alert("success!"); } })}; A problémám annyi volna hogy a javascript nem adja át php Post-ba a változó értékét. Debug alapján az értéket megkapja,de a success-t már nem írja ki...
Mutasd a teljes hozzászólást!
Hali!

Vagy csupán eldobja a változó értékét futás közben valami miatt, és ezért nem kapja meg ?? :/

Ha nem értelmezem tévesen a kódodat…

Általános űrlap-küldésnél mi történik (kb.)?
1. Kattintasz a küldés-gombra.
2. A böngésző elküldi az űrlap-elemeket a form action tulajdonságában meghatározott URL-nek.
3. Az URL-ben meghatározott szerver-oldali szkript csinál valamit.
4. A böngésző megjeleníti a szerver-oldali szkript eredményét (azaz, amit visszaadott a szkript, vagy ahova átirányította esetleg), felülírva a jelenlegi tartalmat.

Nálad mi történik?
1. Kattintasz a küldés-gombra.
2. Meghívódik egy JS-függvény (abban történik valami).
3. A böngésző elküldi az űrlap-elemeket a form action tulajdonságában meghatározott URL-nek (mivel semmi nem gátolja abban, hogy ezt ne tegye).
4. Az URL-ben meghatározott szerver-oldali szkript csinál valamit (függetlenül, hogy te Ajax-szal meghívsz más – jelen esetben ugyanazon – szkriptet).
5. A böngésző megjeleníti a szerver-oldali szkript eredményét (azaz, amit visszaadott a szkript, vagy ahova átirányította esetleg), felülírva a jelenlegi tartalmat.

A kiemelt részeket elemezd. Tehát, az rendben van, hogy Ajax-szal szeretnéd „elintézni” a dolgot (most tekintsünk el attól, hogy az Ajax-hívásban csak egy adatot küldesz el, a form-elemeket, nem), de akkor meg kell akadályozni a normál form-küldést. Célszerűen ne a submit-gombra kattintást, hanem a form submit-eseményét kezeld le (onsubmit, ha ezt nem jQuery-vel akarod), majd az eseménykezelőben tiltsd (preventDefault) a küldést.

Mutasd a teljes hozzászólást!

  • Hali!

    Gondolkodj el rajta, hogy mi lehet a gond. Ha a submit-ra kattintasz, mi történik azon kívül, hogy meghívódik a display() függvényed? Szerinted elküldi a form.php-nak a böngésző „normál” módban is a form-ot (nem Ajax-szal) vagy nem? Ha elküldi, akkor történik oldal-újratöltés (vagy a form.php eredményének megjelenítése) vagy nem? Ha történik ilyen, akkor van értelme az Ajax-szos hívásnak? Hogyan lehetne ezt elkerülni?

    Mutasd a teljes hozzászólást!
  • Hmmm nem hiszem hogy elküldené valami miatt, ugyanis Debug módban nem jut el a success-ig :/
    Ezt a megoldást stackoverflow-on találtam de nem működik sajna így.
    Esetleg van valami más módja annak hogy átadjam a változó értékét a php-mnak ??
    Mutasd a teljes hozzászólást!
  • Vagy csupán eldobja a változó értékét futás közben valami miatt, és ezért nem kapja meg ?? :/
    Mutasd a teljes hozzászólást!
  • Miután elolvastad és értelmezted netangel hozzászólását, gondolkodj el:
    mit is akarsz elküldeni a "form.php" fájlnak (name or value)...
    hogyan olvasod ki, hogy melyik checkbox van bejelölve és annak mi az értéke(i) (ha már JQ, akkor avval)...
    ha már másik fájlnak küldöd, akkor mit akarsz a DB-be menteni a küldő fájlodban...
    Megj: Azonos ID-k?
    Mutasd a teljes hozzászólást!
  • Kicsit alakítottam a kódodon. Gondolom a tippelés csak az egyikre lehetséges, akkor viszont radio gombot célszerű használni.

    teszt.html

    <html> <head> <meta charset="UTF-8"> <title></title> <!-- Latest compiled and minified CSS --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <!-- Optional theme --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> <!-- Latest compiled and minified JavaScript --> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script src="form.js"></script> <script type="text/javascript" language="JavaScript"> function display() { var somevar1 = $('input:radio[name=Game_1]:checked').val(); $.ajax({ type:"POST", url: "form.php", data: {variable1: somevar1}, success: function(data){ alert(data); } })}; </script> </head> <body> <div style="width:997px"> <form method="POST" action="form.php"> <table class="table-bordered" width="997px" style="background-color: whitesmoke"> <tr><th></th> <th scope="col" colspan="4" style="text-align:center" >június 30. 17:00</th> <th scope="col" ></th> <th scope="col" ></th> <th scope="col" ></th> <th scope="col" ></th> </tr> <tr> <td scope="col" ></td> <td scope="col" style="text-align:center" >Győz 1.</td> <td scope="col" style="text-align:center" >Döntetlen</td> <td scope="col" style="text-align:center" >Győz 2.</td> <td scope="col" ></td> </tr> <tr> <td scope="col" ></td> <td scope="col" style="text-align:center"><input type="radio" id="myText" name="Game_1" value="Home"></td> <td scope="col" style="text-align:center"><input type="radio" id="myText" name="Game_1" value="Draw"></td> <td scope="col" style="text-align:center"><input type="radio" id="myText" name="Game_1" value="Away"></td> <td scope="col"></td> </tr> </table> <P style="text-align: center"><INPUT id="Bet_button" TYPE="button" onclick="display()" VALUE="Tippelek" NAME="B1"></P> </form> </div> </body> </html>
    form.php (itt az adatbázisba író részt kivettem, csak egy kiíratás visszaadja a postolt értéket)

    <?php /* $servername = "XXXXXX"; $username = "XXXXX"; $password = "XXXXXX"; $dbname = "XXXXX"; // Create connection $conn = new mysqli($servername, $username, $password, $dbname); // Check connection if ($conn->connect_error) { die("Connection failed: " . $conn->connect_error); } if(isset($_POST['variable1'])) { $result = $_POST['Game_1']; $GameID = $_POST['variable1']; $ClientID = 552533; $GetDate = date("Y-m-d-H:i:s"); $query = "INSERT INTO Betting(ClientID,Game_1,CreationDate) VALUES('".$ClientID."','$result','".$GetDate."')"; mysqli_query($conn, $query); } */ var_dump($_POST); ?>
    Mutasd a teljes hozzászólást!
  • Hali!

    Vagy csupán eldobja a változó értékét futás közben valami miatt, és ezért nem kapja meg ?? :/

    Ha nem értelmezem tévesen a kódodat…

    Általános űrlap-küldésnél mi történik (kb.)?
    1. Kattintasz a küldés-gombra.
    2. A böngésző elküldi az űrlap-elemeket a form action tulajdonságában meghatározott URL-nek.
    3. Az URL-ben meghatározott szerver-oldali szkript csinál valamit.
    4. A böngésző megjeleníti a szerver-oldali szkript eredményét (azaz, amit visszaadott a szkript, vagy ahova átirányította esetleg), felülírva a jelenlegi tartalmat.

    Nálad mi történik?
    1. Kattintasz a küldés-gombra.
    2. Meghívódik egy JS-függvény (abban történik valami).
    3. A böngésző elküldi az űrlap-elemeket a form action tulajdonságában meghatározott URL-nek (mivel semmi nem gátolja abban, hogy ezt ne tegye).
    4. Az URL-ben meghatározott szerver-oldali szkript csinál valamit (függetlenül, hogy te Ajax-szal meghívsz más – jelen esetben ugyanazon – szkriptet).
    5. A böngésző megjeleníti a szerver-oldali szkript eredményét (azaz, amit visszaadott a szkript, vagy ahova átirányította esetleg), felülírva a jelenlegi tartalmat.

    A kiemelt részeket elemezd. Tehát, az rendben van, hogy Ajax-szal szeretnéd „elintézni” a dolgot (most tekintsünk el attól, hogy az Ajax-hívásban csak egy adatot küldesz el, a form-elemeket, nem), de akkor meg kell akadályozni a normál form-küldést. Célszerűen ne a submit-gombra kattintást, hanem a form submit-eseményét kezeld le (onsubmit, ha ezt nem jQuery-vel akarod), majd az eseménykezelőben tiltsd (preventDefault) a küldést.

    Mutasd a teljes hozzászólást!
  • Ettől a kódtól meg fogja tanulni, amit kell?
    Hát nagyot tévedtél (nézz utána korábbi topic-jainak)...
    Mutasd a teljes hozzászólást!
  • Végezetül részenről pár észrevétel:
    1. Az ilyen kódra szokták mondani => "több sebből vérzik", bár én azt mondanám inkább, hogy "nincs benne egy ép rész sem".
    2. Ha valaminek nekiálssz, akkor előtte logikusan gondolod végig mit is szeretnél elérni, milyen módon és pl ceruzával vesd papírra az elképzelésedet.
    3. Ezek után keress rá egy-egy kifejezésre, azaz részfeladatra, célra.
    4. Járj utána, tanulmányozd és értsd meg a kliens-szerver kapcsolatot (pl. FORM-küldés, ajax, stb).
    5. Ismerd meg a HTML tag-eket, azok célját, használatát.
    6. Ha valamilyen eseménynek 3 kimenete lehet (pl egy meccs), akkor radio tag, ha valamiből többet is választhatsz (olvasandó könyvek), akkor checkbox.
    7. Mikor mindezek már ismertek és mennek, jöhet a DB-kezelés megismerése.
    8. És így tovább...
    !!! Ezen észrevételek nem sértő szándékkal íródtak, hanem okulás céljából !!!
    Megj: Az itt segíteni próbáló emberek azért írnak-javasolnak-kérdeznek, hogy azt elolvasd, értelmezd és tételesen reagálj is rá, végül pedig az első helyes választ fogadd el és zárd le a topic-ot (pl: Css3 Lufi animáció).
    Mutasd a teljes hozzászólást!
  • A kérdező valószínűleg nem itt fogja megtanulni a programozás alapjait, de ha van kis ráérzése és összehasonlítja a két kódot, néhány tanulságot levonhat. Amiket Te szóban kifejtettél Neki azt én a program kódban tettem meg.
    Én nem vagyok itt bentlakó, így csak ritkán nézek be ide, nem ismerhetem a kérdező "előéletét".
    A "nagy tévedésem"-ért pedig elnézést kérek mindenkitől 
    Mutasd a teljes hozzászólást!
  • Szia!
    Ehhez a kávémnak is szüksége volt egy kávéra.

    Tehát először is tisztázd milyen adatok kellenek a felhasználótól.
    (Esemény / Játék azonosító, és az hogy mire tippel, meg persze hogy ki pl. SESSION -ból.)
    Előbbit hidden input mezőben tudod megadni, hogy mire szavaz checkbox helyet pl. radio -val,
    Az hogy ki teszi, az a regisztrált, bejelentkezett felhasználó SESSION -ba rögzített user ID -ja.

    Aztán nézzük a hibákat:
    JS -ben somevar1 -nek a name értéket adnád meg, nem a value.
    (Meg ha van jQuery, akkor már kevesebb kóddal is megoldható lenne vele: $("#myText").val())
    Aztán ezt elküldöd a PHP -nak, ahol objektum alapú kapcsolatott létrehozól,
    majd hagyományos mysqli_query() függvénnyel próbálod $conn->query() helyett.
    Illetve az SQL -t is szüvegként natívan űgy füzögeted össze, ami hát...
    Itt néz utána az SQL Injection -nak.

    Javaslom, kezd újra gondolni, az egész szerkezetét, működését...
    Mutasd a teljes hozzászólást!
Tetszett amit olvastál? Szeretnél a jövőben is értesülni a hasonló érdekességekről?
abcd