Diskuze: AJAX
V předchozím kvízu, Online test znalostí JavaScript, jsme si ověřili nabyté zkušenosti z kurzu.
OK dejme tedy jiný příklad... třeba anketa... Když já jako uživatel
kliknu na jednu z možností, přes AJAX se to odešle na server a mě se
překresli graf... Zajímalo by mě, jestli jinému uživateli, který má již
stránku načtenou před mým hlasováním, se změní graf také bez obnovení
stránky 
Martin Mandík:27.5.2015 15:11
Pořád by stránka jiného uživatele musela třeba tu každou 1s posílat
požadavek na server.
Nefunguje to tak, že ty něco uděláš, a v tom okamžiku to zaznamená i
druhý uživatel, bohužel, na to bys musel použít ty WebSockets.
hypnozc:31.5.2015 22:16
Ahoj, tak jsem to vyzkoušel v praxi, ale zdá se mi, že se stránka stejně
načítá znovu 
Ale data se mi
do DB uloží. Nevíš, kde je chyba?
index.php
<!DOCTYPE HTML>
<html>
<head>
<title>AJAX</title>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script>
$(document).ready(function(){
$("#saveBtn").click(function(){
var email = $("#exampleInputEmail").val();
$.ajax({
url: "indata.php",
method: "GET",
success: function(data){
alert("Success");
}
});
});
});
</script>
</head>
<body>
<form>
<div class="form-group">
<label for="exampleInputEmail1">Email address</label>
<input type="text" class="form-control" id="exampleInputEmail" placeholder="Enter email">
</div>
<button id="saveBtn" class="btn btn-default">Submit</button>
</form>
</body>
</html>indata.php
<?php
$email = $_GET['email'];
$con = mysql_connect('sql.endora.cz:3313','hypnoz','heslo');
mysql_select_db('sindy', $con);
$query = mysql_query("insert into ajax values('$email')");
?>
Tak už jsem to asi pochopil
<!DOCTYPE HTML>
<html>
<head>
<title>AJAX</title>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script>
$(document).ready(function(){
$("#saveBtn").click(function(){
var email = $("#exampleInputEmail").val();
$.ajax({
url: "indata.php",
data:"email="+email,
method: "POST",
success: function(data){
alert("Success");
$("#exampleInputEmail").val("");
}
});
return false;
});
});
</script>
</head>
<body>
<form>
<div class="form-group">
<label for="exampleInputEmail1">Email address</label>
<input type="text" class="form-control" id="exampleInputEmail" placeholder="Enter email">
</div>
<button id="saveBtn" class="btn btn-default">Submit</button>
</form>
</body>
</html>Tak mám hotovou aplikaci na ukládání a čtení dat pomocí AJAXu. Chci se zeptat, zda je zápis 100% správně včetně použití POST a GET u AJAXu. Dále se chci zeptat, jaký je rozdíl mezi WebSocketem a voláním funkce každou sekundu.
index.php
<!DOCTYPE HTML>
<html>
<head>
<title>AJAX</title>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script>
$(document).ready(function(){
$("#Save").click(function(){
if ($("#Input").val()==="")
return false;
var text = $("#Input").val();
$.ajax({
url: "indata.php",
data:"text="+text,
method: "POST",
success: function(data){
alert("Success");
$("#Input").val("");
}
});
return false;
});
setInterval(function(){
$.ajax({
url: "outdata.php",
method: "GET",
success: function(data){
if($("p").text()!==data)
$("p").text(data);
}
});
return false;
}
,1000);
});
</script>
</head>
<body>
<form>
<div class="form-group">
<input type="text" class="form-control" id="Input" placeholder="Enter text">
</div>
<button id="Save" class="btn btn-default">Save</button>
<p></p>
</form>
</body>
</html>indata.php
<?php
$text = $_POST['text'];
$con = mysql_connect('sql.endora.cz:3313','hypnoz','');
mysql_select_db('sindy', $con);
$query = mysql_query("INSERT INTO tabulka(data) values('$text')");
?>outdata.php
<?php
$con = mysql_connect('sql.endora.cz:3313','hypnoz','');
mysql_select_db('sindy', $con);
$query = mysql_query("SELECT data FROM tabulka ORDER BY id DESC");
echo mysql_result($query, 0);
?>ONLINE: http://webgl.8u.cz/
+5 Zkušeností
Zobrazeno 18 zpráv z 18.