Solució exercici3-ajax - Historial de revisió

Mfernandez a 16:32, 12 abr 2024

2024-04-12T16:32:36Z

Mfernandez a 14:30, 9 abr 2024

2024-04-09T14:30:33Z

Mfernandez a 14:29, 9 abr 2024

2024-04-09T14:29:01Z

Mfernandez a 14:28, 9 abr 2024

2024-04-09T14:28:21Z

Mfernandez a 14:26, 9 abr 2024

2024-04-09T14:26:52Z

Mfernandez a 14:19, 9 abr 2024

2024-04-09T14:19:18Z

Jnoguera a 17:05, 24 març 2015

2015-03-24T17:05:26Z

Jnoguera a 14:46, 17 març 2015

2015-03-17T14:46:23Z

Asalinas: Es crea la pàgina amb «Fitxer javascript:

 var xhr;  function peticionAjax(codigo, ciudad){      if (window.ActiveXObject) { //Iexplorer             xhr = new ActiveXObject("Microsoft.XMLH…».

2014-03-20T19:42:48Z

Es crea la pàgina amb «Fitxer javascript: <pre> var xhr; function peticionAjax(codigo, ciudad){ if (window.ActiveXObject) { //Iexplorer xhr = new ActiveXObject("Microsoft.XMLH…».

Pàgina nova

Fitxer javascript:
<pre>
var xhr;

function peticionAjax(codigo, ciudad){
if (window.ActiveXObject) { //Iexplorer
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
else if (window.XMLHttpRequest) { //Tots els altres navegadors que soporten ajax
xhr = new XMLHttpRequest();
}
else {
throw new Error("Ajax is not supported by this browser");
}

xhr.open('POST', 'ciudades.php');
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xhr.onreadystatechange = function() {
if (this.readyState == 4) {
if (this.status >= 200 && this.status < 300) {
if(document.getElementById("barrios")){
document.body.removeChild(document.getElementById("barrios"));
}
document.write(this.responseText);
}
}
}

var content = "codigo=" + codigo;
if(ciudad != null){
content = content + "&ciudad=" +ciudad;
}
xhr.send(content);
}

function inici(){
peticionAjax("ciudades");
}

function ajax(city){
peticionAjax("BARRIOS",city);
}

window.onload = inici;
</pre>

Fitxer HTML:
<pre>
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="exercici3.js"></script>
</head>
<body>

</body>
</html>
</pre>

Fitxer PHP:
<pre>
<?php
function checkPost(){
if(isset($_REQUEST["codigo"])){
switch (strtoupper($_REQUEST["codigo"])){
case "CIUDADES":
echo selectCiudades();
exit();
break;
case "BARRIOS":
if(isset($_REQUEST["ciudad"])){
echo selectBarrios(strtoupper($_REQUEST["ciudad"]));
exit();
}
break;
default:
}
}
echo "error";
}
function selectCiudades(){
$html = "";
$html = $html . "<select id='ciudades' onchange='ajax(this.value);'>";
$html = $html . "<option>----------</option>";
$html = $html . "<option value ='BARCELONA'>BARCELONA</option>";
$html = $html . "<option value ='MADRID'>MADRID</option>";
$html = $html . "<option value ='SEVILLA'> SEVILLA</option>";
$html = $html . "<option value ='CORUÑA'>LA CORUÑA</option>";
$html = $html . "</select>";
return $html;
}

function selectBarrios($ciudades){
switch ($ciudades){
case "BARCELONA":
return getBarcelona();
break;
case "MADRID":
return getMadrid();
break;
case "SEVILLA":
return getSevilla();
break;
case "CORUÑA":
return getCoruna();
break;
default :
return "";
}
}

function getBarcelona(){
$html = "";
$html = $html . "<select id='barrios'>";
$html = $html . "<option>----------</option>";
$html = $html . "<option>EIXAMPLE</option>";
$html = $html . "<option>GRACIA</option>";
$html = $html . "<option>LES CORTS</option>";
$html = $html . "<option>RAVAL</option>";
$html = $html . "<option>GLORIAS</option>";
$html = $html . "</select>";
return $html;
}

function getMadrid(){
$html = "";
$html = $html . "<select id='barrios'>";
$html = $html . "<option>----------</option>";
$html = $html . "<option>CHUECA</option>";
$html = $html . "<option>MALASAÑA</option>";
$html = $html . "<option>SALAMANCA</option>";
$html = $html . "<option>COSLADA</option>";
$html = $html . "</select>";
return $html;
}

function getSevilla(){
$html = "";
$html = $html . "<select id='barrios'>";
$html = $html . "<option>----------</option>";
$html = $html . "<option>TRIANA</option>";
$html = $html . "<option>MACARENA</option>";
$html = $html . "<option>ALAMEDA</option>";
$html = $html . "<option>BAMI</option>";
$html = $html . "</select>";
return $html;
}

function getCoruna(){
$html = "";
$html = $html . "<select id='barrios'>";
$html = $html . "<option>----------</option>";
$html = $html . "<option>ZALAETA</option>";
$html = $html . "<option>ENSANCHE</option>";
$html = $html . "<option>CUATRO CAMINOS</option>";
$html = $html . "<option>ORILLAMAR</option>";
$html = $html . "</select>";
return $html;
}

checkPost();
?>
</pre>

@@ Línia 52: / Línia 52: @@
                      var nodeText = document.createTextNode(_barri);
                      nouElement.appendChild(nodeText);
-                     barri.appendChild(nouItem);
+                     barri.appendChild(nouElement);
                  })
+             }

@@ Línia 38: / Línia 38: @@
          var xhr = new XMLHttpRequest();
          ciutat.onchange = function () {
-             xhr.open("GET", "ex4.php?q=" + ciutat.value);
+             xhr.open("GET", "exercici4.php?q=" + ciutat.value);
              xhr.send(null);
          };

@@ Línia 1: / Línia 1: @@
 Fitxer html:
 <!DOCTYPE html>
@@ Línia 60: / Línia 62: @@
 </html>
 <!--

@@ Línia 1: / Línia 1: @@
 <!--
 //hacer en firefox
--->
 Fitxer javascript:
 <source lang="java">
@@ Línia 167: / Línia 229: @@
 ?>
 </source>

@@ Línia 1: / Línia 1: @@
 //hacer en firefox
+-->
 Fitxer javascript:
 <source lang="java">

← Versió més antiga		Revisió del 17:05, 24 març 2015
Línia 1:		Línia 1:
		+	//hacer en firefox
		+
	Fitxer javascript:		Fitxer javascript:
	<source lang="java">		<source lang="java">

@@ Línia 1: / Línia 1: @@
 Fitxer javascript:
-<pre>
+<source lang="java">
 var xhr;
@@ Línia 44: / Línia 44: @@
 window.onload = inici;
-</pre>
+</source>
 Fitxer HTML:
-<pre>
+<source lang="html">
 <!DOCTYPE html>
 <html>
@@ Línia 60: / Línia 60: @@
      </body>
 </html>
-</pre>
+</source>
 Fitxer PHP:
-<pre>
+<source lang="php">
 <?php
 function checkPost(){
@@ Línia 166: / Línia 166: @@
 checkPost();
 ?>
-</pre>
+</source>