NOVINKA - Online rekvalifikační kurz Python programátor. Oblíbená a studenty ověřená rekvalifikace - nyní i online.
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.

Diskuze: JS promměná do PHP (POST??)?

V předchozím kvízu, Online test znalostí JavaScript, jsme si ověřili nabyté zkušenosti z kurzu.

Jak se ti líbí článek?
Před uložením hodnocení, popiš prosím autorovi, co je špatněZnaků 0 z 50-500
Jak se ti kurz líbí?
Tvé hodnocení kurzuZnaků 0 z 50-500
Aktivity
Avatar
Madunax
Člen
Avatar
Madunax:1.3.2018 14:53

Kde je problém? Chtěl bych pracovat s $_POST["password"], která má hodnotu výstupu té funkce prompt(), na stejné stránce v PHP.

<!DOCTYPE html>

<html>
        <head>
                <title>Hlavní stránka</title>

                <meta charset="utf8">

                <script type="application/javascript" src="jquery.js"></script>
        </head>

        <body>
                <input type="submit" id="submit" value="///admin///">
                <p id="result"></p>

                <div id="container">
                        <a href="">
                                <div class="object">
                                        lol
                                </div>
                        </a>

                        <a href="">
                                <div class="object">
                                        lol
                                </div>
                        </a>

                        <a href="">
                                <div class="object">
                                        lol
                                </div>
                        </a>

                        <a href="">
                                <div class="object">
                                        lol
                                </div>
                        </a>

                        <a href="">
                                <div class="object">
                                        lol
                                </div>
                        </a>

                        <a href="">
                                <div class="object">
                                        lol
                                </div>
                        </a>

                        <a href="">
                                <div class="object">
                                        lol
                                </div>
                        </a>

                        <a href="">
                                <div class="object">
                                        lol
                                </div>
                        </a>

                        <a href="">
                                <div class="object">
                                        lol
                                </div>
                        </a>
                </div>

                <style type="text/css">
                        a
                        {
                                text-decoration: none;
                        }

                        #container
                        {
                                width: 25vw;
                                margin: auto;
                                margin-top: 15vh;
                                text-align: center;
                        }

                        .object
                        {
                                width: 7vw; height: 7vh;
                                text-align: center;
                                display: inline-block;
                                line-height: 7vh;
                        }

                                .object:hover
                                {
                                        background: lightgrey;
                                }
                </style>

                <script type="text/javascript">
                        $(document).ready(function()
                        {
                        $("#submit").click(function()
                        {
                                var password = prompt("zadej hesloo: ");

                                $.ajax(
                                {
                                    type: "POST",
                                    url: "index.php",
                                    data: {name: password},
                                    success: function()
                                    {
                                        var echo = "<?php echo $_POST['name'] ?>";
                                document.getElementById("result").innerHTML = echo;
                                    }
                                });

                                return false;

                        });
                        });
                </script>
        </body>
</html>
 
Odpovědět
1.3.2018 14:53
Avatar
Šimon Rataj
Člen
Avatar
Šimon Rataj:2.3.2018 16:33

PHP bude fungovat až při opětovném načtení stránky.
Tohle dej na začátek stránky (ještě před DOCTYPE).

<?php
  if(isset($_POST['password']))
    die($_POST['password']);
?>

A s tím javascriptem by to mohlo být takhle:

success: function(data) {
  $('#result').html(data);
}
Editováno 2.3.2018 16:33
 
Nahoru Odpovědět
2.3.2018 16:33
Avatar
Šimon Rataj
Člen
Avatar
Odpovídá na Šimon Rataj
Šimon Rataj:2.3.2018 20:03

Na tom třetím řádku v php má být die($_POST['na­me']);

 
Nahoru Odpovědět
2.3.2018 20:03
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:20.4.2018 14:10

Neni mi jasne uplne, co chces docilit. Takhle to funguje.

server -> uzivatel
php server vygeneruje html -> odesle uzivateli -> prohlizec prijme, zobrazi html, spusti js

uzivatel -> server
uzivatel klikne na tlacitko / odkaz -> formular se odesle na server do php -> (server -> uzivatel)

Pokud chces do js ziskavat data, funkce se jmenuje httprequest. Ano, v jquery je to obalene funkci ajax. A jedna se o synchronni nebo asynchronni prenost. Bud js kod ceka na vysledek nebo spusti casovac neco jako setTimeout, ktery ceka na dokonceni. Cili, vetsinou ma funkce parametry:

funkce(url, parametry, navratova_funkce_call_back)
funkce('http://...soubor.php', 'a=1&b=2', zpracuj)
function zpracuj (data) {alert(data); element.innerHTML = data;}

Idealne, najdi si googlem nejaky priklad. google = ajax jquery simple example
V jquery pouzivaji vice nazvu, tusim ajax, load, post, get

// $ obvykle znamena, ze musis prilinkovat do kodu jquery knihovnu, pridat nekam do html tag:
// <script src="https://code.jquery.com/jquery-1.11.3.js"></script>
// idealne si zkopirovat soubor 'jquery-1.11.3.js' na svuj web, at to netahas z cizich stranek
$.ajax({
  url: "test.html",
  cache: false,
  success: function(html){
    $("#results").append(html);
    //document.getElementById("result").innerHTML = html
  }
});

http://api.jquery.com/jQuery.ajax/

 
Nahoru Odpovědět
20.4.2018 14:10
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 4 zpráv z 4.