Diferència entre revisions de la pàgina «Exercici 6»
De wikiserver
| Línia 1: | Línia 1: | ||
== Programa de servidor '''exercici6.php''' == | == Programa de servidor '''exercici6.php''' == | ||
| + | |||
| + | Obtingut de https://www.w3schools.com/xml/ajax_php.asp | ||
<source lang=php> | <source lang=php> | ||
| + | <?php | ||
| + | // Array with names | ||
| + | $a[] = "Anna"; | ||
| + | $a[] = "Brittany"; | ||
| + | $a[] = "Cinderella"; | ||
| + | $a[] = "Diana"; | ||
| + | $a[] = "Eva"; | ||
| + | $a[] = "Fiona"; | ||
| + | $a[] = "Gunda"; | ||
| + | $a[] = "Hege"; | ||
| + | $a[] = "Inga"; | ||
| + | $a[] = "Johanna"; | ||
| + | $a[] = "Kitty"; | ||
| + | $a[] = "Linda"; | ||
| + | $a[] = "Nina"; | ||
| + | $a[] = "Ophelia"; | ||
| + | $a[] = "Petunia"; | ||
| + | $a[] = "Amanda"; | ||
| + | $a[] = "Raquel"; | ||
| + | $a[] = "Cindy"; | ||
| + | $a[] = "Doris"; | ||
| + | $a[] = "Eve"; | ||
| + | $a[] = "Evita"; | ||
| + | $a[] = "Sunniva"; | ||
| + | $a[] = "Tove"; | ||
| + | $a[] = "Unni"; | ||
| + | $a[] = "Violet"; | ||
| + | $a[] = "Liza"; | ||
| + | $a[] = "Elizabeth"; | ||
| + | $a[] = "Ellen"; | ||
| + | $a[] = "Wenche"; | ||
| + | $a[] = "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> | ||
Revisió del 11:45, 7 abr 2022
Contingut
Programa de servidor exercici6.php
Obtingut de https://www.w3schools.com/xml/ajax_php.asp
<?php
// Array with names
$a[] = "Anna";
$a[] = "Brittany";
$a[] = "Cinderella";
$a[] = "Diana";
$a[] = "Eva";
$a[] = "Fiona";
$a[] = "Gunda";
$a[] = "Hege";
$a[] = "Inga";
$a[] = "Johanna";
$a[] = "Kitty";
$a[] = "Linda";
$a[] = "Nina";
$a[] = "Ophelia";
$a[] = "Petunia";
$a[] = "Amanda";
$a[] = "Raquel";
$a[] = "Cindy";
$a[] = "Doris";
$a[] = "Eve";
$a[] = "Evita";
$a[] = "Sunniva";
$a[] = "Tove";
$a[] = "Unni";
$a[] = "Violet";
$a[] = "Liza";
$a[] = "Elizabeth";
$a[] = "Ellen";
$a[] = "Wenche";
$a[] = "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;
?>Programa de client exercici6.html amb objecte XMLHtmlRequest
<html>
<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","exercici6.php?q="+input.value);
xhr.send(null);
};
xhr.onreadystatechange=function (){
if(xhr.readyState==4 && xhr.status==200) {
contingut.innerHTML=xhr.responseText;
}
};
</script>
</body>
</html>
Programa de client exercici6.html amb FETCH
<html>
<body>
<h1>exercici 6 AJAX</h1>
<input type="text" id="input"></input>
<br>Suggeriments:
<div id="contingut"></div>
<script lang="javascript">
var contingut=document.getElementById("contingut");
var input=document.getElementById("input");
input.oninput=function () {
fetch("exercici6.php?q="+input.value)
.then( function(response){
if(response.ok) {
return response.text()
} else {
throw "Error a la crida Ajax";
}
})
.then(function(responseText){
contingut.innerHTML=responseText;
})
.catch(function(err) {
console.log(err);
});
};
</script>
</body>
</html>Programa de client exercici6.html amb AXIOS
<html>
<body>
<h1>exercici 6 AJAX</h1>
<input type="text" id="input"></input>
<br>Suggeriments:
<div id="contingut"></div>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script lang="javascript">
var contingut=document.getElementById("contingut");
var input=document.getElementById("input");
input.oninput=function () {
axios.get("exercici6.php?q="+input.value)
.then(function(response){
contingut.innerHTML=response.data;
})
.catch(function(err) {
console.log(err);
});
};
</script>
</body>
</html>
