Praticamente questo è il mio codice:
(Mi scuso in anticipo per il macello che avrò combinato, ma è la prima volta che uso un framework).
Praticamente nella vista(dopo aver abilitato i radio con javascript), la funzione popola tramite Ajax deve popolare la select con i nomi dei porti.
Grazie in anticipo
Controller:
Codice PHP:
<?php
class BoatsController extends AppController{
var $name='Boats';
var $helpers = array ('Html', 'Form', 'Javascript', 'Ajax');
var $components = array ('RequestHandler');
function index(){
//prendo i dati che mi servono
$citta = $this->Boat->find('all');
//passo i dati alla funzione del modello
$dati=$this->Boat->prendi($citta);
//passo l'array risultante alla vista
$this->set('dati',$dati);
$this->set('title_for_layout','Scegli il tipo di imbarcazione');
//$boats= fun();
}
}
?>
Model:
Codice PHP:
?php
class Boat extends AppModel{
// var $name='Boat'; //necessario per PHP4 ma non per PHP5
function prendi($citta){
$i=0;
foreach($citta as $riga){
$porto[$i]=$riga['Boat']['citta'];
$i++;
}
return $porto;
}
}
?>
Vista:
Codice PHP:
<link rel="stylesheet" type="text/css" href="app/webroot/css/forms.css" />
<script type="text/javascript" src="app/webroot/js/script.js"></script>
<script type="text/javascript" src="app/webroot/js/ajax.js"></script>
<div id="idD">
<?php echo $title_for_layout ?>
<form method="GET" name="modulo">
<input type="radio" name="tipo" value="motore" onclick="abilita('porto');abilita('risultati');popola(this.value,'porto')">
motore
<input type="radio" name="tipo" value="vela" onclick="abilita('porto');abilita('risultati');popola(this.value,'porto')">
vela
Scegli il porto di partenza
<select id="porto" disabled name="val">
</select>
</p>
Massimo numero di risultati
<!-- la funzione mostra() visualizza il secondo div contenente una
tabella con le imbarcazioni disponibili e visualizza() lo rende visibile -->
<select id="risultati" disabled onclick="mostra(this.value,'imbarcazioni');visualizza('idD2')">
<?php
for($i=1;$i<=6;$i++){ ?>
<option value=<?echo $i?>> <?echo $i ?>
<? }
?>
</select>
</p>
</form>
</div>
<div id="idD2">
<form method="get" action="dettagli.php" name="modulo2">
<h3>Imbarcazioni a disponibili</h3>
<table id="imbarcazioni">
</table>
</form>
</div>
Ajax:
var xmlHttp;
function popola(val,id){
xmlHttp=getXMLHttpRequest();
if(xmlHttp==null){
alert("Il tuo browser non supporta Ajax");
return;
}
var url;
url="boats_controller.php";
/*
/*
aggiunge la variabile che contiene la scelta tra motore e vela
*/
url=url+"?q="+val;
alert(url);
/*
contiene lo stato della risposta del server
*/
xmlHttp.onreadystatechange=stateFunction(id);
/*
apre una connessione verso il server
viene usato il metodo get
comunicazione asincrona(true)
*/
xmlHttp.open("GET",url,true);
/*
invia la richiesta al server
*/
xmlHttp.send(null);
}
function stateFunction(id){
/*
se la richiesta è stata completata viene popolata la select del porto
*/
if(xmlHttp.readyState==4){
/*
xmlDoc contiene la risposta del server
*/
xmlDoc=xmlHttp.responseText;
/*
elem è il riferimento all'oggetto select
*/
elem=document.getElementById(id);
/*
la risposta del server viene inserita in un array
*/
/*
ripulisce la select e i campi option
*/
document.getElementById(id).options.length=0;
array=xmlDoc.split(",");
/*
ciclo for per la creazione delle option
e l'inserimento all'interno della select
*/
for(i=0;i<array.length;i++){
/*
crea un oggetto di tipo option con text=array[i] e value=array[i]
false=non selezionato
*/
op= new Option(array[i],array[i],false,false);
/*
inserisce la option nella select
*/
elem.options[elem.options.length]=op;
}
}
}
/* restituisce un oggetto di tipo XMLHttpRequest */
function getXMLHttpRequest(){
var xmlHttp=null;
try{
xmlHttp= new XMLHttpRequest();
}catch(e){
try{
xmlHttp=new ActiveObject("Msxml12.XMLHTTP");
}catch(e){
xmlHttp= new ActiveObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}
File javascript(senza Ajax):
/*
* Abilita campi con id=val oppure name=val;
*/
function abilita(val){
elemID=document.getElementById(val);
elemName=document.getElementsByName(val);
if(elemID!=null)
elemID.disabled=false;
if(elemName!=null)
for(i=0;i<elemName.length;i++){
elemName[i].disabled=false;
}
}
/*
* Rende visibile l'elemento con id=val
*/
function visualizza(val){
document.getElementById(val).style.visibility="vis ible";
}
/*
* Mantiene in un cookie il valore val
*/
function conserva(val){
document.cookie="nome"+val;
}