Diferència entre revisions de la pàgina «Solució exercici6-ajax»
De wikiserver
(2 revisions intermèdies per 2 usuaris que no es mostren) | |||
Línia 1: | Línia 1: | ||
+ | //fitxer html | ||
+ | <source lang="java"> | ||
+ | <!DOCTYPE html> | ||
+ | <html lang="ca"> | ||
+ | |||
+ | <head> | ||
+ | <meta charset="UTF-8"> | ||
+ | <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
+ | <title>Exercici 6 AJAX</title> | ||
+ | </head> | ||
+ | |||
+ | <body> | ||
+ | <h1>Exercici 6 AJAX</h1> | ||
+ | <input type="text" id="input"></input> | ||
+ | <br>Suggeriments: | ||
+ | <div id="contingut"></div> | ||
+ | |||
+ | <script lang="javascript"> | ||
+ | var xhr = new XMLHttpRequest(); | ||
+ | |||
+ | var contingut = document.getElementById("contingut"); | ||
+ | var input = document.getElementById("input"); | ||
+ | |||
+ | input.oninput = function () { | ||
+ | xhr.open("GET", "ex6.php?q=" + input.value); | ||
+ | xhr.send(null); | ||
+ | }; | ||
+ | |||
+ | xhr.onreadystatechange = function () { | ||
+ | if (xhr.readyState == 4 && xhr.status == 200) { | ||
+ | contingut.innerHTML = xhr.responseText; | ||
+ | } | ||
+ | }; | ||
+ | </script> | ||
+ | </body> | ||
+ | |||
+ | </html> | ||
+ | </source> | ||
+ | |||
+ | //fitxer php | ||
+ | <source lang="java"> | ||
+ | <?php | ||
+ | // Array with names | ||
+ | $a = array("Anna", "Brittany", "Cinderella", "Diana", "Eva", "Fiona", "Gunda", "Hege", "Inga", "Johanna", "Kitty", "Linda", "Nina", "Ophelia", "Petunia", "Amanda", "Raquel", "Cindy", "Doris", "Eve", "Evita", "Sunniva", "Tove", "Unni", "Violet", "Liza", "Elizabeth", "Ellen", "Wenche", "Vicky"); | ||
+ | |||
+ | // get the q parameter from URL | ||
+ | $q = $_REQUEST["q"]; | ||
+ | |||
+ | $hint = ""; | ||
+ | |||
+ | // lookup all hints from array if $q is different from "" | ||
+ | if ($q !== "") { | ||
+ | $q = strtolower($q); | ||
+ | $len = strlen($q); | ||
+ | foreach ($a as $name) { | ||
+ | if (stristr($q, substr($name, 0, $len))) { | ||
+ | if ($hint === "") { | ||
+ | $hint = $name; | ||
+ | } else { | ||
+ | $hint .= "<br>$name"; | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | |||
+ | // Output "no suggestion" if no hint was found or output correct values | ||
+ | echo $hint === "" ? "no suggestion" : $hint; | ||
+ | |||
+ | </source> | ||
+ | |||
+ | <!-- | ||
<source lang="java"> | <source lang="java"> | ||
Línia 100: | Línia 171: | ||
// get the q parameter from URL | // get the q parameter from URL | ||
− | $q=$_REQUEST["q"]; $hint=""; | + | $q=$_REQUEST["q"]; |
+ | $hint=""; | ||
// lookup all hints from array if $q is different from "" | // lookup all hints from array if $q is different from "" | ||
if ($q !== "") | if ($q !== "") | ||
− | { $q=strtolower($q); $len=strlen($q); | + | { $q=strtolower($q); |
+ | $len=strlen($q); | ||
foreach($a as $name) | foreach($a as $name) | ||
{ if (stristr($q, substr($name,0,$len))) | { if (stristr($q, substr($name,0,$len))) | ||
Línia 120: | Línia 193: | ||
?> | ?> | ||
</source> | </source> | ||
+ | --> |
Revisió de 15:41, 9 abr 2024
//fitxer html
<!DOCTYPE html>
<html lang="ca">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Exercici 6 AJAX</title>
</head>
<body>
<h1>Exercici 6 AJAX</h1>
<input type="text" id="input"></input>
<br>Suggeriments:
<div id="contingut"></div>
<script lang="javascript">
var xhr = new XMLHttpRequest();
var contingut = document.getElementById("contingut");
var input = document.getElementById("input");
input.oninput = function () {
xhr.open("GET", "ex6.php?q=" + input.value);
xhr.send(null);
};
xhr.onreadystatechange = function () {
if (xhr.readyState == 4 && xhr.status == 200) {
contingut.innerHTML = xhr.responseText;
}
};
</script>
</body>
</html>
//fitxer php
<?php
// Array with names
$a = array("Anna", "Brittany", "Cinderella", "Diana", "Eva", "Fiona", "Gunda", "Hege", "Inga", "Johanna", "Kitty", "Linda", "Nina", "Ophelia", "Petunia", "Amanda", "Raquel", "Cindy", "Doris", "Eve", "Evita", "Sunniva", "Tove", "Unni", "Violet", "Liza", "Elizabeth", "Ellen", "Wenche", "Vicky");
// get the q parameter from URL
$q = $_REQUEST["q"];
$hint = "";
// lookup all hints from array if $q is different from ""
if ($q !== "") {
$q = strtolower($q);
$len = strlen($q);
foreach ($a as $name) {
if (stristr($q, substr($name, 0, $len))) {
if ($hint === "") {
$hint = $name;
} else {
$hint .= "<br>$name";
}
}
}
}
// Output "no suggestion" if no hint was found or output correct values
echo $hint === "" ? "no suggestion" : $hint;