Riempire caselle dropdown collegate fra loro in Chronoforms.

[vales]

Uno dei problemi da risolvere in un form è spesso il riempimento di caselle dropdown con i valori memorizzati in tabelle di database. Spesso insieme a questa necessità c'è anche quella che la seconda casella dropdown sia in funzione della scelta operata nella prima casella.

Esempio di questo sono il valori delle sezioni e categorie di Joomla dove le seconde appartengono ad una sezione oppure il caso classico di provincie e comuni.

In questi casi occorre che nella prima casella compiuta la scelta della sezione o provincia e nella seconda casella siano resi disponibili i valori delle categorie appartenenti alla sezione oppure i comuni appartenenti alla provincia.

Si può fare questa cosa il vari modi con l'uso misto di PHP, javascript o Ajax. Dopo aver ricercato a giro varie soluzioni ho optato per questa, adattata a Chonoforms, che mi sembra molto flessibile e gestibile in varie varianti.

Si tratta di un codice Javascript generato con l'aiuto di PHP per le parti dinamiche che variano a seconda della scelta.
Il codici seguenti sono stati collaudati sia con Chronoforms e con Chronoconnectivity in alcune applicazioni che ho realizzato (es. Albo Pretorio On Line discusso in altro topic del forum).

Ecco il blocchi di codice funzionanti per le tabelle sezioni e categorie di Joomla, ma che potranno essere adattati ad altri casi.

Codice da inserire nella sezione Form Html

Codice: [Seleziona]

<!-- inizio codice campi form -->

<div class="form_item">
        <div class="form_element cf_dropdown">
          <div style="clear:both;"><label class="cf_label">Sezioni</label>
           
<select name="id_sezione"  onfocus="fillCategory();" onChange="SelectCategoria();" class="cf_inputbox validate-selection"  ><Option value="">Seleziona</option>

</select> Categorie

       <select id="id_categoria" name="categoria" class="cf_inputbox validate-selection" ><Option value="">Seleziona</option>
       
</select>
       
 </div>   
    </div>
  <div class="cfclear">&nbsp;</div>
</div>



<div class="form_item">
  <div class="form_element cf_button">
    <input value="Invia" name="button_1" type="submit" /><input type="reset" name="reset" value="Reset"/>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

Codice da inserire nella sezione Form Javascript

Codice: [Seleziona]

<?php
//questo è il codice da inserire nella TAB Form Code sezione javascript 

echo "function fillCategory(){ ";
 // questa funzione è usata per riempire le sezioni al caricamento 

echo "removeAllOptions(document.ChronoContact_nome_vostro_form.id_sezione);";


$db =& JFactory::getDBO();
$query = "
    SELECT `id`,`title`
    FROM `#__sections`
    ORDER BY `title` ";
    $db->setQuery($query);
    $nomes = $db->loadAssocList();
    
      foreach ( $nomes as $nt1 ) {
       echo "\n addOption(document.ChronoContact_nome_vostro_form.id_sezione, '".$nt1['id']."', '".$nt1['title']."'); ";
      
      }
      
echo "\n}"; // fine della funzione Javascript - end of JS function
?>


function SelectCategoria(){
// Funzione chiamata dopo la selezione della Sezione

removeAllOptions(document.ChronoContact_nome_vostro_form.id_categoria);
//addOption(document.ChronoContact_nome_vostro_form.id_categoria, "", "Seleziona", "");

// Raccoglie tutti gli elementi della categoria per id

<?php
    
    $query= "
           SELECT distinct(id) FROM `#__sections`";
           $db->setQuery($query);
       $nomes = $db->loadAssocList();
           $nome_options = "";
                                              // inizio ciclo sezioni
               foreach ( $nomes as $nt2 ) {
       
             echo "\n if(document.ChronoContact_nome_vostro_form.id_sezione.value == '".$nt2['id']."'){ ";
     
      $query= "
         SELECT `id`,`title` FROM `#__categories` WHERE `section` ='".$nt2['id']."' ORDER BY `title`" ;
         $db->setQuery($query);
     $nomes = $db->loadAssocList();
         $nome_options = "";
                                               //inizio ciclo categorie
               foreach ( $nomes as $nt3 ) {

echo "\n addOption(document.ChronoContact_nome_vostro_form.id_categoria,'".$nt3['id']."', '".$nt3['title']."'); ";

} // fine ciclo categorie
echo "\n}"; // fine della if Javascript 

} // fine loop sezioni
?>

}
// fine della funzione javascripts
//////////////////

function removeAllOptions(selectbox)
{
    var i;
    for(i=selectbox.options.length-1;i>=1;i--)
    {
        selectbox.options[i]=null;
        //selectbox.remove(i);
    }
}


function addOption(selectbox, value, text )
{
    var optn = document.createElement("OPTION");
    optn.text = text;
    optn.value = value;

    selectbox.options.add(optn);
}


Il codice restituirà i valori id rispettivamente delle tabelle jos_sections e jos_categories nelle variabili del form id_sezione ed id_categoria che sono i campi name delle due caselle.

Il codice è commentato in alcune parti e credo sia facilmente comprensibile.
L'unica cosa da cambiare 6 volte è nome_vostro_form con il nome del form che sarà da voi creato.

Buon uso a tutti.

P.S. Verificato con Firefox, Internet Explorer e Crome.

[vales]

Inserite alcune modifiche al codice del precedente post per la compatibilità con Internet Explorer.

[Papalla]

Molto interessante. Dovrei risolvere la stessa cosa ma senza caricare i dati da DB.

Es: Il primo dropdown ha 3 valori: peso, misure, colori.
Il secondo dropdown deve contenere valori a seconda della scelta fatta nel primo.
Se nel primo si è scelto "peso", il secondo conterrà "Kg e Gr"; se è stato scelto "misure", conterrà "metri e cm.", se "colori" conterrà "bianco, rosso, verde".
Non è possibile inserire queste info direttamente nel codice form anzichè nel DB?

[fmburkina]

Grazie, appena possibile lo provo

[vales]

Molto interessante. Dovrei risolvere la stessa cosa ma senza caricare i dati da DB.

Es: Il primo dropdown ha 3 valori: peso, misure, colori.
Il secondo dropdown deve contenere valori a seconda della scelta fatta nel primo.
Se nel primo si è scelto "peso", il secondo conterrà "Kg e Gr"; se è stato scelto "misure", conterrà "metri e cm.", se "colori" conterrà "bianco, rosso, verde".
Non è possibile inserire queste info direttamente nel codice form anzichè nel DB?

Chi non vuole utilizzare il database uno sguardo al codice javascripts creato nella pagina sorgente credo sia più semplice di una lunga spiegazione.

Il seguente codice genera 3 sezioni con varie categorie per sezione.

Codice: [Seleziona]

//questo è il codice da inserire nella TAB Form Code sezione javascript

function fillCategory(){
removeAllOptions(document.getElementById('ChronoContact_atto_10').cod_sezione);


 addOption(document.getElementById('ChronoContact_atto_10').cod_sezione, '1', 'sezione 1');
 addOption(document.getElementById('ChronoContact_atto_10').cod_sezione, '2', 'sezione 2');
 addOption(document.getElementById('ChronoContact_atto_10').cod_sezione, '3', 'sezione 3');
}

function SelectSubCat(){
// Funzione chiamata dopo la selezione della Sezione - ON or after selection of category this function will work

removeAllOptions(document.getElementById('ChronoContact_atto_10').cod_categoria);
//addOption(document.getElementById('ChronoContact_atto_10').cod_categoria, "", "Seleziona", "");

// Raccoglie tutti gli elementi della categoria per id - Collect all element of subcategory for various id


 if (document.getElementById('ChronoContact_atto_10').cod_sezione.value == '1'){
 addOption(document.getElementById('ChronoContact_atto_10').cod_categoria,'1', 'categoria 1 sez 1');
 addOption(document.getElementById('ChronoContact_atto_10').cod_categoria,'2', 'categoria 2 sez 1');
 addOption(document.getElementById('ChronoContact_atto_10').cod_categoria,'6', 'categoria 3 sez 1');
 addOption(document.getElementById('ChronoContact_atto_10').cod_categoria,'7', 'categoria 4 sez 1');
}
 if (document.getElementById('ChronoContact_atto_10').cod_sezione.value == '2'){
 addOption(document.getElementById('ChronoContact_atto_10').cod_categoria,'3', 'categoria 1 sez 2');
 addOption(document.getElementById('ChronoContact_atto_10').cod_categoria,'4', 'categoria 2 sez 2');
 addOption(document.getElementById('ChronoContact_atto_10').cod_categoria,'5', 'categoria 3 sez 2');
}
 if (document.getElementById('ChronoContact_atto_10').cod_sezione.value == '3'){
 addOption(document.getElementById('ChronoContact_atto_10').cod_categoria,'9', 'categoria 1 sez 3');
 addOption(document.getElementById('ChronoContact_atto_10').cod_categoria,'10', 'categoria 2 sez 3');
}



}
//////////////////

function removeAllOptions(selectbox)
{
   var i;
   for(i=selectbox.options.length-1;i>=1;i--)
   {
      selectbox.options[i]=null;
      //selectbox.remove(i);
   }
}


function addOption(selectbox, value, text )
{
   var optn = document.createElement("option");
       
        optn.text = text;
   optn.value = value;

   selectbox.options.add(optn);
          //selectbox.appendChild(optn,where);

}

Anche qui essendo il codice dedicato al mio form di nome atto_10 dovete sostituire atto_10 con il nome del vostro form ed ovviamente anche i nomi dei campi in Form HTML  del primo posto vanno sostituiti con i vostri.

[neo_revolution]

Ragazzi chi mi può aiutare non sono riuscito a farlo funzionare anche mettendo gli stessi nome.
vi sarei molto grato se mi aiutaste
grazi

[vales]

C'erano delle imprecisioni nella versione senza uso del database.

Le versioni dei codici corrette sono queste:

Codice da inserire in Form HTML

Codice: [Seleziona]

<!-- inizio codice campi form -->

<div class="form_item">
        <div class="form_element cf_dropdown">
          <div style="clear:both;"><label class="cf_label">Sezioni</label>
           
<select id="id_sezione" name="sezione" onfocus="fillCategory();" onChange="SelectCategoria();" class="cf_inputbox validate-selection"  ><Option value="">Seleziona</option>

</select> Categorie

       <select id="id_categoria" name="categoria" class="cf_inputbox validate-selection" ><Option value="">Seleziona</option>
       
</select>
       
 </div>   
    </div>
  <div class="cfclear">&nbsp;</div>
</div>



<div class="form_item">
  <div class="form_element cf_button">
    <input value="Invia" name="button_1" type="submit" /><input type="reset" name="reset" value="Reset"/>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

codice da inserire in Form Javascript

Codice: [Seleziona]

//questo è il codice da inserire nella TAB Form Code sezione javascript

function fillCategory(){
removeAllOptions(document.getElementById('ChronoContact_provadropdown').sezione);


 addOption(document.getElementById('ChronoContact_provadropdown').sezione, '1', 'sezione 1');
 addOption(document.getElementById('ChronoContact_provadropdown').sezione, '2', 'sezione 2');
 addOption(document.getElementById('ChronoContact_provadropdown').sezione, '3', 'sezione 3');
}

function SelectCategoria(){
// Funzione chiamata dopo la selezione della Sezione - ON or after selection of category this function will work

removeAllOptions(document.getElementById('ChronoContact_provadropdown').categoria);
//addOption(document.getElementById('ChronoContact_provadropdown').categoria, "", "Seleziona", "");

// Raccoglie tutti gli elementi della categoria per id - Collect all element of subcategory for various id


 if (document.getElementById('ChronoContact_provadropdown').sezione.value == '1'){
 addOption(document.getElementById('ChronoContact_provadropdown').categoria,'1', 'categoria 1 sez 1');
 addOption(document.getElementById('ChronoContact_provadropdown').categoria,'2', 'categoria 2 sez 1');
 addOption(document.getElementById('ChronoContact_provadropdown').categoria,'6', 'categoria 3 sez 1');
 addOption(document.getElementById('ChronoContact_provadropdown').categoria,'7', 'categoria 4 sez 1');
}
 if (document.getElementById('ChronoContact_provadropdown').sezione.value == '2'){
 addOption(document.getElementById('ChronoContact_provadropdown').categoria,'3', 'categoria 1 sez 2');
 addOption(document.getElementById('ChronoContact_provadropdown').categoria,'4', 'categoria 2 sez 2');
 addOption(document.getElementById('ChronoContact_provadropdown').categoria,'5', 'categoria 3 sez 2');
}
 if (document.getElementById('ChronoContact_provadropdown').sezione.value == '3'){
 addOption(document.getElementById('ChronoContact_provadropdown').categoria,'9', 'categoria 1 sez 3');
 addOption(document.getElementById('ChronoContact_provadropdown').categoria,'10', 'categoria 2 sez 3');
}



}
//////////////////

function removeAllOptions(selectbox)
{
   var i;
   for(i=selectbox.options.length-1;i>=1;i--)
   {
      selectbox.options[i]=null;
      //selectbox.remove(i);
   }
}


function addOption(selectbox, value, text )
{
   var optn = document.createElement("option");
       
        optn.text = text;
   optn.value = value;

   selectbox.options.add(optn);
          //selectbox.appendChild(optn,where);

}


Anche in questo caso il codice è dedicato al mio form di nome provadropdown, quindi dovete sostituire provadropdown con il nome del vostro form ed ovviamente anche i nomi dei campi in Form HTML  e Form javascript vanno sostituiti con i vostri.

[Papalla]

Grazie Vales, sei fantastico !

[francesco87]

Ciao vales, sto preparando una form per l'inserimento di un indirizzo . Ora ho tre dropdown che devo prendere dal database regioni province e comuni. Ho seguito il tuo codice sembra che ho fatto tutto correttamnte il javascript è presente anche nella pagina che viene renderizzata ma non vedo nulla ti allego il codice .

la parte che sta nella sezione html

Codice: [Seleziona]

<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 150px;">Regione</label>
    <select onfocus="fillCategory();"  onChange="SelectRegione();" class="form" id="id_regione"   name="id_regione">
    <option value="">Seleziona</option>
     
    </select>
   
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 150px;">Provincia</label>
    <select class="cf_inputbox validate-selection" id="provincia" size="1" title=""  name="provincia">
    <option value="">Seleziona</option>
     
    </select>
   
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 150px;">Comune</label>
    <select class="cf_inputbox validate-selection" id="select_14" size="1" title=""  name="comune">
    <option value="">Seleziona</option>
     
    </select>
   
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

nella sezione javascrip ho inserito

Codice: [Seleziona]

<?php
//questo è il codice da inserire nella TAB Form Code sezione javascript 

echo "\n function fillCategory(){ ";
echo "\n removeAllOptions(document.getElementById('ChronoContact_personale_segi').id_regione);";
 // questa funzione è usata per riempire le sezioni al caricament

$db =& JFactory::getDBO();
$query = "
    SELECT `idregione`,`nomeregione`
    FROM `regioni`
    ORDER BY `nomeregione` ";
    $db->setQuery($query);
    $nomes = $db->loadAssocList();
    
      foreach ( $nomes as $nt1 ) {
      
      echo "\n addOption(document.ChronoContact_personale_segi.i d_regione, '".$nt1['idregione']."', '".$nt1['nomeregione']."'); ";
      }
      
echo "\n}"; // fine della funzione Javascript - end of JS function
?>
function SelectRegione(){
// Funzione chiamata dopo la selezione della Sezione

//removeAllOptions(document.ChronoContact_personale_segi.i d_regione);
//addOption(document.ChronoContact_personale_segi.r egione, "", "Seleziona", "");

// Raccoglie tutti gli elementi della categoria per id

<?php
    
    $query= "
           SELECT distinct(idregione) FROM `regioni`";
           $db->setQuery($query);
       $nomes = $db->loadAssocList();
           $nome_options = "";
                                              // inizio ciclo sezioni
               foreach ( $nomes as $nt2 ) {
       
             echo "\n if(document.ChronoContact_personale_segi.i d_regione.value == '".$nt2['idregione']."'){ ";
     
      $query= "
         SELECT `idprovincia`,`nomeprovincia` FROM `province` WHERE `idregione` ='".$nt2['idregione']."' ORDER BY `nomeprovincia`" ;
         $db->setQuery($query);
     $nomes = $db->loadAssocList();
         $nome_options = "";
                                               //inizio ciclo categorie
               foreach ( $nomes as $nt3 ) {

echo "\n addOption(document.ChronoContact_personale_segi.p rovincia,'".$nt3['idprovincia']."', '".$nt3['nomeprovincia']."'); ";

} // fine ciclo categorie
echo "\n}"; // fine della if Javascript 

} // fine loop sezioni
?>

}
// fine della funzione javascripts
//////////////////

function removeAllOptions(selectbox)
{
    var i;
    for(i=selectbox.options.length-1;i>=1;i--)
    {
        selectbox.options=null;
        //selectbox.remove(i);
    }
}


function addOption(selectbox, value, text )
{
    var optn = document.createElement("OPTION");
    optn.text = text;
    optn.value = value;

    selectbox.options.add(optn);
}

tutte le query funzionano a dovere ma non vedo nulla. Spero che tu mi possa aiutare perchè non riesco a capire dove sbaglio.

Grazie infinite in anticipo;)

[Rikk.58]

M'interessa pure a me se vai avanti aggiorna il topic. Grazie

[vales]

@francesco87 benvenuto in Joomla,
c'è voluto un po' ma ho trovato una soluzione, se hai già risolto bene lo stesso e servirà ad altri.

Ho cambiato completamente impostazione. Questa soluzione richiede di avere disponibili delle tabella in sql di regioni provincie e comuni (se cercate per regioni provincie comuni sql le trovate).

Questo il codice per Form HTML

Codice: [Seleziona]

<?php

$db =& JFactory::getDBO(); 

$query = "
  SELECT  `id`, `regione`
   FROM `#__regioni` ORDER BY `regione`"; 

$db->setQuery($query);
$nomes = $db->loadAssocList();
$option_reg="";
  foreach ( $nomes as $v ) {
  $selected="";
  $id =  $v['id'];
  $regione = $v['regione'];
  if ($id==JRequest::getVar('regione',0,'GET','INT')) {
  $selected="selected=\"selected\"";
  }

$option_reg.="<option value=\"$id\" $selected>$regione</option>\n";

}


$query = "
  SELECT  `id`, `provincia`
   FROM `#__province` WHERE `id_regione`=".JRequest::getVar('regione',0,'GET','INT')." ORDER BY `provincia`"; 

$db->setQuery($query);
$nomes = $db->loadAssocList();
$option_pro="";
  foreach ( $nomes as $v ) {
  $selected="";
  $id =  $v['id'];
  $province = $v['provincia'];
  if ($id==JRequest::getVar('provincia',0,'GET','INT')) {
  $selected="selected='selected'";
  }

$option_pro.="<option value=\"$id\" $selected>$province</option>\n";

}


$query = "
  SELECT  `id`, `comune`
   FROM `#__comuni` WHERE `id_provincia`=".JRequest::getVar('provincia',0,'GET','INT')." ORDER BY `comune`"; 

$db->setQuery($query);
$nomes = $db->loadAssocList();
$option_com="";
  foreach ( $nomes as $v ) {
  $id =  $v['id'];
  $comune = $v['comune'];

$option_com.="<option value=\"$id\" $selected>$comune</option>\n";

}

?>


<div class="form_item">
        <div class="form_element cf_dropdown">
          <div style="clear:both;"><label class="cf_label">Regioni</label>
           
<select id="regione" name="regione"  onchange="province(this.form);" class="cf_inputbox validate-selection"  ><option value="" selected="selected">Seleziona</option>

<?php echo $option_reg; ?>

</select>

 </div>   
    </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
        <div class="form_element cf_dropdown">
          <div style="clear:both;"><label class="cf_label">Provincie</label>

       <select id="provincia" name="provincia" onchange="reload(this.form);" class="cf_inputbox validate-selection" ><option value="" selected="selected">Seleziona</option>

<?php echo $option_pro; ?>
       
</select>
       
 </div>   
    </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
        <div class="form_element cf_dropdown">
          <div style="clear:both;"><label class="cf_label">Comuni</label>

       <select id="comune" name="comune" class="cf_inputbox validate-selection" ><option value="" selected="selected">Seleziona</option>

<?php echo $option_com; ?>
       
</select>
       
 </div>   
    </div>
  <div class="cfclear">&nbsp;</div>
</div>
questo il codice per Form Javascript

Codice: [Seleziona]

function province(form)
{
var reg=form.regione.options[form.regione.options.selectedIndex].value;
self.location='index.php?option=com_chronocontact&chronoformname=reg_prov_com&regione=' + reg ;
}

function reload(form)
{
var prov=form.provincia.options[form.provincia.options.selectedIndex].value;
var reg=form.regione.options[form.regione.options.selectedIndex].value;
self.location='index.php?option=com_chronocontact&chronoformname=reg_prov_com&provincia=' + prov + '&regione=' + reg;
}

Ovviamente vanno adattati i nomi delle tabelle ed i nomi dei campi   in caso di differenze rispetto a quelli proposti nell'esempio.

le mie tabelle sono costruite così:

Codice: [Seleziona]

CREATE TABLE `regioni` (
  `id` int(11) unsigned NOT NULL,
  `regione` text NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=MyISAM  DEFAULT CHARSET=utf8 ;


CREATE TABLE `province` (
  `id` int(10) unsigned NOT NULL,
  `id_regione` int(10) unsigned NOT NULL,
  `provincia` text NOT NULL,
  `sigla` varchar(2) NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=MyISAM  DEFAULT CHARSET=utf8 ;


CREATE TABLE `comuni` (
  `id` int(10) unsigned NOT NULL auto_increment,
  `id_regione` int(10) unsigned NOT NULL,
  `id_provincia` int(10) unsigned NOT NULL,
  `comune` text NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=MyISAM  DEFAULT CHARSET=utf8 ;

[oracledba]

Al posto di 3 tabelle ho una sola tabella che contiene tutte le informazioni.
Vorrei far scegliere il cap all'utente e senza dover fare una nuova query  riempire il campo dropdown città e quello provincia.
Si può fare?

Grazie

[vales]

se hai tutto in una tabella dovresti usare adattandolo solo il codice sia php che html come quello delle regioni.

Dovresti ,al secondo passaggio quando il form ricarica i valori, sulla base della scelta precedente, assegnare i valori città e provincia a dei campi nascosti del form.

[oracledba]

Quindi il codice java non devo usarlo.
Faccio qualche prova.
Possibile che nessuno ha avuto la neessità di fare un form di registrazione dove l'utente deve compilare un'anagrafica?
Suggerisco ai Guru di creare un plugin o un codice standard per queste cose.
Grazie
Carlo

[vales]

Si devi usarlo perchè dopo la prima scelta il javascript rilancia il form e carica i campi selezionati.

Ovviamente basta quello della select regioni.

[oracledba]

Dopo averci sbattuta la testa per giorni sono arrivato a questa soluzione perchè non riesco a far funzionare i campi hiden

Codice: [Seleziona]

<?php
/*-- inizio codice campi form -*/


$db =& JFactory::getDBO(); 

/*-- collegamento al DB -*/
/*-- ricerca stato -*/

$query = "
  SELECT  `id`, `name`
   FROM `#__stati` ORDER BY `name`"; 



$db->setQuery($query);
$nomes = $db->loadAssocList();
$option_sta="";
  foreach ( $nomes as $v ) {
  $selected="";
  $id =  $v['id'];
  $stato = $v['name'];

  if (JRequest::getVar('stato',0,'GET','INT')==null&&$id==353){
     $selected="selected";
  } else if ($id==JRequest::getVar('stato',0,'GET','INT')) {
     $selected="selected";
  }

$option_sta.="<option value=\"$id\" $selected>$stato</option>\n";

}

/*-- ricerca regione -*/

$query = "
  SELECT  `id`, `name`
   FROM `#__regione` ORDER BY `name`"; 



$db->setQuery($query);
$nomes = $db->loadAssocList();
$option_reg="";
  foreach ( $nomes as $v ) {
  $selected="";
  $id =  $v['id'];
  $regione = $v['name'];
  if ($id==JRequest::getVar('regione',0,'GET','INT')) {
  $selected="selected=\"selected\"";
  }

$option_reg.="<option value=\"$id\" $selected>$regione</option>\n";

}

/*-- ricerca provincia -*/

$query = "
  SELECT  `id`, `name`
   FROM `#__provincia`  ORDER BY `name`"; 

$db->setQuery($query);
$nomes = $db->loadAssocList();
$option_pro="";
  foreach ( $nomes as $v ) {
  $selected="";
  $id =  $v['id'];
  $provincia = $v['name'];
  if ($id==JRequest::getVar('provincia',0,'GET','INT')) {
  $selected="selected='selected'";
  }

$option_pro.="<option value=\"$id\" $selected>$provincia</option>\n";

}

/*-- ricerca provincia -*/


$query = "

  SELECT  `id`, `name`
   FROM `#__comuni` WHERE `provincia_id`=".JRequest::getVar('provincia',0,'GET','INT')." ORDER BY `name`"; 


$db->setQuery($query);
$nomes = $db->loadAssocList();
$option_com="";
  foreach ( $nomes as $v ) {
  $selected="";
  $id =  $v['id'];
  $comune = $v['name'];
  if ($id==JRequest::getVar('comune',0,'GET','INT')) {
  $selected="selected='selected'";}

$option_com.="<option value=\"$id\" $selected>$comune</option>\n";


}
/*-- ricerca comune -*/

$query = "

 SELECT  `id`, `cap`
   FROM `#__localita` WHERE `comune_id`=".JRequest::getVar('comune',0,'GET','INT')." GROUP BY `cap`"; 

$db->setQuery($query);
$nomes = $db->loadAssocList();
$option_cap="";
  foreach ( $nomes as $v ) {
  $id =  $v['id'];
  $cap = $v['cap'];
$option_cap.="<option value=\"$id\" $selected>$cap</option>\n";

}
/*-- ricerca cap -*/


?>

<!-- fine codice php -->


<div class="form_item">
  <div class="form_element cf_heading">
    <h1 class="cf_text">Scheda Anagrafica </h1>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_multiholder" style="margin-left:0px!important;">
  <label class="cf_label" style="display: none;">tab1</label>
    <table cellspacing="0" cellpadding="0" width="95%" title="" class="multi_container">
        <tbody width="100%">
            <tr width="100%">
                <td style="width: auto; vertical-align: middle; text-align: left;">
<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 80px;">Cognome </label>
    <input class="cf_inputbox" maxlength="40" size="10" title="" id="text_3" name="cognome" type="text" value="<?echo JRequest::getVar('cognome','','GET','STRING')  ?>"/>
 
  </div>
  <div class="cfclear">&nbsp;</div>
</div>
</td>
<td style="width: auto; vertical-align: middle; text-align: left;">
<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 80px;">Nome</label>
    <input class="cf_inputbox" maxlength="40" size="10" title="" id="text_5" name="nome" type="text" value="<?echo JRequest::getVar('nome','','GET','STRING')  ?>"/>
 
  </div>
  <div class="cfclear">&nbsp;</div>
</div>
</td>

            </tr>
        </tbody>
    </table>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_datetimepicker">
    <label class="cf_label" style="width: 80px;">Nato/a il</label>
    <input class="cf_datetime" title="" size="1" id="date_34" name="date_34" type="text" value="<?echo JRequest::getVar('date_34','','GET','STRING')  ?>"/>
   
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<!-- disegno primo dropdown -->
<div class="form_item">
        <div class="form_element cf_dropdown">
          <div style="clear:both;"><label class="cf_label" style="width: 80px;" >Stato</label>
           
<select id="stato" name="stato"  onchange="regione(this.form);" class="cf_inputbox validate-selection"  ><option value="" selected="selected">Seleziona</option>

<?php echo $option_sta; ?>

</select>

 </div>   
    </div>
  <div class="cfclear">&nbsp;</div>
</div>
<!-- fine disegno primo dropdown -->


<!-- disegno secondo dropdown -->

<div class="form_item">
        <div class="form_element cf_dropdown">
          <div style="clear:both;"><label class="cf_label">Provincia</label>

       <select id="provincia" name="provincia" onchange="reload(this.form);" class="cf_inputbox validate-selection" ><option value="" selected="selected">Seleziona</option>

<?php echo $option_pro; ?>
       
</select>
       
 </div>   
    </div>
  <div class="cfclear">&nbsp;</div>
</div>

<!-- fine disegno secondo dropdown -->

<!-- disegno terzo dropdown -->


<div class="form_item">
        <div class="form_element cf_dropdown">
          <div style="clear:both;"><label class="cf_label" style="width: 80px;">Comune</label>

       <select id="comune" name="comune" onchange="reload(this.form);" class="cf_inputbox validate-selection" ><option value="" selected="selected">Seleziona</option>

<?php echo $option_com; ?>
       
</select>
       
 </div>   
    </div>
  <div class="cfclear">&nbsp;</div>
</div>

<!-- fine disegno terzo dropdown -->

<!-- disegno quarto dropdown -->


<div class="form_item">
        <div class="form_element cf_dropdown">
          <div style="clear:both;"><label class="cf_label">cap</label>

       <select id="cap" name="cap" class="cf_inputbox validate-selection" ><option value="" selected="selected">Seleziona</option>

<?php echo $option_cap; ?>
       
</select>
       
 </div>   
    </div>
  <div class="cfclear">&nbsp;</div>
</div>


<!-- fine disegno quarto dropdown -->


<div class="form_item">
  <div class="form_element cf_multiholder" style="margin-left:0px!important;">
  <label class="cf_label" style="display: none;">tab2</label>
    <table cellspacing="0" cellpadding="0" width="95%" title="" class="multi_container">
        <tbody width="100%">
            <tr width="100%">
                <td style="width: auto; vertical-align: middle; text-align: left;">
<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 80px;">Altezza</label>
    <select class="cf_inputbox" id="select_16" size="1" title=""  name="altezza">
    <option value="">seleziona dalla lista</option>
      <option value="150">150</option>
<option value="151">151</option>
<option value="152">152</option>
<option value="153">153</option>
<option value="154">154</option>
<option value="155">155</option>
<option value="156">156</option>
<option value="157">157</option>
<option value="158">158</option>
<option value="159">159</option>
<option value="160">160</option>
<option value="161">161</option>
<option value="162">162</option>
<option value="163">163</option>
<option value="164">164</option>
<option value="165">165</option>
<option value="166">166</option>
<option value="167">167</option>
<option value="168">168</option>
<option value="169">169</option>
<option value="170">170</option>
<option value="171">171</option>
<option value="172">172</option>
<option value="173">173</option>
<option value="174">174</option>
<option value="175">175</option>
<option value="176">176</option>
<option value="177">177</option>
<option value="178">178</option>
<option value="179">179</option>
<option value="180">180</option>
<option value="181">181</option>
<option value="182">182</option>
<option value="183">183</option>
<option value="184">184</option>
<option value="185">185</option>
<option value="186">186</option>
<option value="187">187</option>
<option value="188">188</option>
<option value="189">189</option>
<option value="190">190</option>
<option value="191">191</option>
<option value="192">192</option>
<option value="193">193</option>
<option value="194">194</option>
<option value="195">195</option>
<option value="196">196</option>
<option value="197">197</option>
<option value="198">198</option>
<option value="199">199</option>
<option value="200">200</option>
<option value="201">201</option>
<option value="202">202</option>
<option value="203">203</option>
<option value="204">204</option>
<option value="205">205</option>
<option value="206">206</option>
<option value="207">207</option>
<option value="208">208</option>
<option value="209">209</option>
<option value="210">210</option>
<option value="211">211</option>
<option value="212">212</option>
<option value="213">213</option>
<option value="214">214</option>
<option value="215">215</option>

    </select>
    <a class="tooltiplink" onclick="return false;"><img height="16" border="0" width="16" class="tooltipimg" alt="" src="components/com_chronocontact/css/images/tooltip.png"/></a>
<div class="tooltipdiv">Altezza :: seleziona la tua altezza in cm.</div>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>
</td>
<td style="width: auto; vertical-align: middle; text-align: left;">
<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 80px;">Peso</label>
    <select class="cf_inputbox" id="select_17" size="1" title=""  name="peso">
    <option value="">seleziona dalla lista</option>
      <option value="40">40</option>
<option value="41">41</option>
<option value="42">42</option>
<option value="43">43</option>
<option value="44">44</option>
<option value="45">45</option>
<option value="46">46</option>
<option value="47">47</option>
<option value="48">48</option>
<option value="49">49</option>
<option value="50">50</option>
<option value="51">51</option>
<option value="52">52</option>
<option value="53">53</option>
<option value="54">54</option>
<option value="55">55</option>
<option value="56">56</option>
<option value="57">57</option>
<option value="58">58</option>
<option value="59">59</option>
<option value="60">60</option>
<option value="61">61</option>
<option value="62">62</option>
<option value="63">63</option>
<option value="64">64</option>
<option value="65">65</option>
<option value="66">66</option>
<option value="67">67</option>
<option value="68">68</option>
<option value="69">69</option>
<option value="70">70</option>
<option value="71">71</option>
<option value="72">72</option>
<option value="73">73</option>
<option value="74">74</option>
<option value="75">75</option>
<option value="76">76</option>
<option value="77">77</option>
<option value="78">78</option>
<option value="79">79</option>
<option value="80">80</option>
<option value="81">81</option>
<option value="82">82</option>
<option value="83">83</option>
<option value="84">84</option>
<option value="85">85</option>
<option value="86">86</option>
<option value="87">87</option>
<option value="88">88</option>
<option value="89">89</option>
<option value="90">90</option>
<option value="91">91</option>
<option value="92">92</option>
<option value="93">93</option>
<option value="94">94</option>
<option value="95">95</option>
<option value="96">96</option>
<option value="97">97</option>
<option value="98">98</option>
<option value="99">99</option>
<option value="100">100</option>
<option value="101">101</option>
<option value="102">102</option>
<option value="103">103</option>
<option value="104">104</option>
<option value="105">105</option>
<option value="106">106</option>
<option value="107">107</option>
<option value="108">108</option>
<option value="109">109</option>
<option value="110">110</option>
<option value="111">111</option>
<option value="112">112</option>
<option value="113">113</option>
<option value="114">114</option>
<option value="115">115</option>
<option value="116">116</option>
<option value="117">117</option>
<option value="118">118</option>
<option value="119">119</option>
<option value="120">120</option>
<option value="121">121</option>
<option value="122">122</option>
<option value="123">123</option>
<option value="124">124</option>
<option value="125">125</option>
<option value="126">126</option>
<option value="127">127</option>
<option value="128">128</option>
<option value="129">129</option>
<option value="130">130</option>
<option value="131">131</option>
<option value="132">132</option>
<option value="133">133</option>
<option value="134">134</option>
<option value="135">135</option>
<option value="136">136</option>
<option value="137">137</option>
<option value="138">138</option>
<option value="139">139</option>
<option value="140">140</option>
<option value="141">141</option>
<option value="142">142</option>
<option value="143">143</option>
<option value="144">144</option>
<option value="145">145</option>
<option value="146">146</option>
<option value="147">147</option>
<option value="148">148</option>
<option value="149">149</option>
<option value="150">150</option>

    </select>
    <a class="tooltiplink" onclick="return false;"><img height="16" border="0" width="16" class="tooltipimg" alt="" src="components/com_chronocontact/css/images/tooltip.png"/></a>
<div class="tooltipdiv">Peso :: seleziona il tuo peso in kg</div>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>
</td>
<td style="width: auto; vertical-align: middle; text-align: left;">
<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 80px;">Gruppo s.</label>
    <select class="cf_inputbox" id="select_18" size="1" title=""  name="gruppo_sangue">
    <option value="">seleziona dalla lista</option>
      <option value="Gruppo 0 Rh-">Gruppo 0 Rh-</option>
<option value="Gruppo 0 Rh+">Gruppo 0 Rh+</option>
<option value="Gruppo A Rh-">Gruppo A Rh-</option>
<option value="Gruppo A Rh+">Gruppo A Rh+</option>
<option value="Gruppo B Rh-">Gruppo B Rh-</option>
<option value="Gruppo B Rh+">Gruppo B Rh+</option>
<option value="Gruppo AB Rh-">Gruppo AB Rh-</option>
<option value="Gruppo AB Rh+">Gruppo AB Rh+</option>

    </select>
    <a class="tooltiplink" onclick="return false;"><img height="16" border="0" width="16" class="tooltipimg" alt="" src="components/com_chronocontact/css/images/tooltip.png"/></a>
<div class="tooltipdiv">Gruppo s. :: seleziona il tuo gruppo sanguigno</div>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>
</td>

            </tr>
        </tbody>
    </table>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_multiholder" style="margin-left:0px!important;">
  <label class="cf_label" style="display: none;">tab3</label>
    <table cellspacing="0" cellpadding="0" width="95%" title="" class="multi_container">
        <tbody width="100%">
            <tr width="100%">
                <td style="width: auto; vertical-align: middle; text-align: left;">
<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 150px;">Patente civile</label>
    <select class="cf_inputbox" id="select_13" size="1" title=""  name="select_13">
    <option value="">seleziona dalla lista</option>
      <option value="Nessuna">Nessuna</option>
<option value="Patente A1">Patente A1</option>
<option value="Patente A">Patente A</option>
<option value="Patente B">Patente B</option>
<option value="Patente B+E">Patente B+E</option>
<option value="Patente C">Patente C</option>
<option value="Patente C+E">Patente C+E</option>
<option value="Patente D">Patente D</option>
<option value="Patente D+E">Patente D+E</option>

    </select>
    <a class="tooltiplink" onclick="return false;"><img height="16" border="0" width="16" class="tooltipimg" alt="" src="components/com_chronocontact/css/images/tooltip.png"/></a>
<div class="tooltipdiv">Patente civile :: seleziona il tipo di patente civile in tuo possesso</div>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>
</td>
<td style="width: auto; vertical-align: middle; text-align: left;">
<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 150px;">Eventuali abilitazioni</label>
    <select class="cf_inputbox" id="select_14" size="1" title=""  name="select_14">
    <option value="">seleziona dalla lista</option>
      <option value="nessuna">nessuna</option>
<option value="C.I.G.C.">C.I.G.C.</option>
<option value="C.A.P. KA">C.A.P. KA</option>
<option value="C.A.P. KB">C.A.P. KB</option>
<option value="C.Q.C.">C.Q.C.</option>
<option value="C.F.P.">C.F.P.</option>
<option value="A.D.R.">A.D.R.</option>
<option value="altro tipo">altro tipo</option>

    </select>
    <a class="tooltiplink" onclick="return false;"><img height="16" border="0" width="16" class="tooltipimg" alt="" src="components/com_chronocontact/css/images/tooltip.png"/></a>
<div class="tooltipdiv">Eventuali abilitazioni :: Abilitazioni alla guida</div>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>
</td>

            </tr>
        </tbody>
    </table>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_multiholder" style="margin-left:0px!important;">
  <label class="cf_label" style="display: none;">tab4</label>
    <table cellspacing="0" cellpadding="0" width="95%" title="" class="multi_container">
        <tbody width="100%">
            <tr width="100%">
                <td style="width: auto; vertical-align: middle; text-align: left;">
<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 80px;">Casa</label>
    <input class="cf_inputbox validate-number" maxlength="20" size="10" title="" id="text_16" name="text_16" type="text" />
  <a class="tooltiplink" onclick="return false;"><img height="16" border="0" width="16" class="tooltipimg" alt="" src="components/com_chronocontact/css/images/tooltip.png"/></a>
<div class="tooltipdiv">Casa :: numero di telefono comprensivo di prefisso</div>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>
</td>
<td style="width: auto; vertical-align: middle; text-align: left;">
<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 80px;">Ufficio</label>
    <input class="cf_inputbox validate-number" maxlength="20" size="10" title="" id="text_18" name="text_18" type="text" />
  <a class="tooltiplink" onclick="return false;"><img height="16" border="0" width="16" class="tooltipimg" alt="" src="components/com_chronocontact/css/images/tooltip.png"/></a>
<div class="tooltipdiv">Ufficio :: digita il numero di telefono del posto del tuo ufficio comprensivo di prefisso</div>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>
</td>
<td style="width: auto; vertical-align: middle; text-align: left;">
<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 80px;">Cellulare 1</label>
    <input class="cf_inputbox validate-number" maxlength="20" size="10" title="" id="text_19" name="text_19" type="text" />
  <a class="tooltiplink" onclick="return false;"><img height="16" border="0" width="16" class="tooltipimg" alt="" src="components/com_chronocontact/css/images/tooltip.png"/></a>
<div class="tooltipdiv">Cellulare 1 :: digita il numero del tuo cellulare personale</div>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>
</td>
<td style="width: auto; vertical-align: middle; text-align: left;">
<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 80px;">Cellulare 2</label>
    <input class="cf_inputbox validate-number" maxlength="20" size="10" title="" id="text_20" name="text_20" type="text" />
  <a class="tooltiplink" onclick="return false;"><img height="16" border="0" width="16" class="tooltipimg" alt="" src="components/com_chronocontact/css/images/tooltip.png"/></a>
<div class="tooltipdiv">Cellulare 2 :: digita il numero del tuo cellulare di servizio</div>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>
</td>
<td style="width: auto; vertical-align: middle; text-align: left;">
<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 80px;">Altro</label>
    <input class="cf_inputbox validate-digits" maxlength="20" size="10" title="" id="text_28" name="text_28" type="text" />
  <a class="tooltiplink" onclick="return false;"><img height="16" border="0" width="16" class="tooltipimg" alt="" src="components/com_chronocontact/css/images/tooltip.png"/></a>
<div class="tooltipdiv">Altro :: digita il numero di altri telefoni su cui rintracciarti</div>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>
</td>

            </tr>
        </tbody>
    </table>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_text"> <span class="cf_text">Residenza</span> </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_multiholder" style="margin-left:0px!important;">
  <label class="cf_label" style="display: none;">tab5</label>
    <table cellspacing="0" cellpadding="0" width="95%" title="" class="multi_container">
        <tbody width="100%">
            <tr width="100%">
                <td style="width: auto; vertical-align: middle; text-align: left;">
<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 80px;">Provincia</label>
    <input class="cf_inputbox" maxlength="150" size="30" title="" id="text_23" name="text_23" type="text" />
  <a class="tooltiplink" onclick="return false;"><img height="16" border="0" width="16" class="tooltipimg" alt="" src="components/com_chronocontact/css/images/tooltip.png"/></a>
<div class="tooltipdiv">Provincia :: digita la provincia in cui si trova la tua abitazione</div>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>
</td>
<td style="width: auto; vertical-align: middle; text-align: left;">
<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 80px;">Città</label>
    <input class="cf_inputbox" maxlength="150" size="30" title="" id="text_24" name="text_24" type="text" />
  <a class="tooltiplink" onclick="return false;"><img height="16" border="0" width="16" class="tooltipimg" alt="" src="components/com_chronocontact/css/images/tooltip.png"/></a>
<div class="tooltipdiv">Città :: digita la città in cui si trova la tua abitazione</div>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>
</td>

            </tr>
        </tbody>
    </table>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_multiholder" style="margin-left:0px!important;">
  <label class="cf_label" style="display: none;">tab6</label>
    <table cellspacing="0" cellpadding="0" width="95%" title="" class="multi_container">
        <tbody width="100%">
            <tr width="100%">
                <td style="width: auto; vertical-align: middle; text-align: left;">
<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 80px;">Cap</label>
    <input class="cf_inputbox" maxlength="5" size="10" title="" id="text_29" name="text_29" type="text" />
  <a class="tooltiplink" onclick="return false;"><img height="16" border="0" width="16" class="tooltipimg" alt="" src="components/com_chronocontact/css/images/tooltip.png"/></a>
<div class="tooltipdiv">Cap :: digita il cap della tua città</div>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>
</td>
<td style="width: auto; vertical-align: middle; text-align: left;">
<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 80px;">Indirizzo</label>
    <input class="cf_inputbox required" maxlength="150" size="30" title="" id="text_22" name="text_22" type="text" />
  <a class="tooltiplink" onclick="return false;"><img height="16" border="0" width="16" class="tooltipimg" alt="" src="components/com_chronocontact/css/images/tooltip.png"/></a>
<div class="tooltipdiv">Indirizzo :: digita l'indirizzo della tua abitazione</div>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>
</td>

            </tr>
        </tbody>
    </table>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 80px;">@mail</label>
    <input class="cf_inputbox" maxlength="150" size="30" title="" id="text_26" name="text_26" type="text" />
  <a class="tooltiplink" onclick="return false;"><img height="16" border="0" width="16" class="tooltipimg" alt="" src="components/com_chronocontact/css/images/tooltip.png"/></a>
<div class="tooltipdiv">@mail :: digita un indirizzo e-mail su cui invieremo le nostre comunicazioni</div>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_button">
    <input value="Conferma" name="button_2" type="submit" /><input type="reset" name="reset" value="Reset"/>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>


------------- Java

function regione(form)
{
var sta=form.stato.options[form.stato.options.selectedIndex].value;
self.location='index.php?option=com_chronocontact&chronoformname=modulo_cri_pag_1&stato=' + sta ;
}


function comune(form)
{
var com=form.provincia.options[form.provincia.options.selectedIndex].value;
self.location='index.php?option=com_chronocontact&chronoformname=modulo_cri_pag_1&provincia=' + pro ;
}



function reload(form)
{
var cognome=form.cognome.value;
var nome=form.nome.value;
var date_34=form.date_34.value;

var cap=form.cap.options[form.cap.options.selectedIndex].value;
var com=form.comune.options[form.comune.options.selectedIndex].value;
var prov=form.provincia.options[form.provincia.options.selectedIndex].value;
var sta=form.stato.options[form.stato.options.selectedIndex].value;
self.location='index.php?option=com_chronocontact&chronoformname=modulo_cri_pag_1&comune=' + com + '&stato=' + sta + '&provincia=' + prov + '&cap=' + cap + '&cognome=' + cognome + '&nome=' + nome + '&date_34=' + date_34;
}

funziona perfettamente ma la riga dell'url diventa lunghissima.
Come posso modificarlo per passare i campi del form in campi hiden?
Mi basta un esempio per il campo hiden ed uno per il campo div dove disegno il form.
Grazie

[vales]

Un campo nascosto lo puoi definire così:

Codice: [Seleziona]

<input type="hidden" name="nome_campo" value="abc123" />

poi tieni conto che i valori trasmessi nell'URL sono di tipo GET mentre gli altri sono POST.

[oracledba]

E' proprio il problema del POST e GET che non riesco a capire.
Vorrei evitare di passare tutto sulla riga dell'url e nello stesso tempo avere i campi a disposizione nel caso l'utente volesse tornare indietro nella pagina.
Il form che sto creando è appunto un multipagina che attiverò tramite l'apposita funzione di Chronoform.
Mi puoi fare un esempio pratico partendo dal mio codice su come dovrei modificare per non scrivere tutto sull'url?
Grazie 1000 Vales

[Franceschino]

Salve, mi sembra di capire che avete già trattato il problema delle drop down list collegate (regioni, province, comuni). Io prendo le voci delle regioni province e comuni dall html e non dal db. Con due funzioncine javascript ho cercato di far uscire le province corrispondenti alla regione selezionata e i comuni per la provincia... ora la prima funzione nn dà problemi mentre quella per i comuni sì. Siccome sono nuovo di Joomla, di javascript e di php propbabilmente ci sono moooolte cose che ignoro.
Innanzitutto non capisco come si inseriscono le funzioni nel form javascript, se con la normale sintassi javascript per le funzioni o per forza con la addEvent che è una funzione che ho letto sul manuale di chronoForm.
Riporto il codice della funzione JS sperando che qualcuno mi possa aiutare. Grazie in anticipo 
ps. perchè alla fine della funzione chiude con le parentesi tonde e il ;  ?

$('provincia1').addEvent('blur', function() {
 var provincia1 = $('provincia1').value;
 var optgroup = 0;
 for ( var x = 1; x <= num_province; x++ ) {
 if ( provincia1 == ('pr_'+x).value ) {
   $('pr_'+x).disabled = false;
   $('pr_'+x).setStyle('display', 'block');
 } else {
  $('pr_'+x).disabled = true;
  $('pr_'+x).setStyle('display', 'none');
 }
}
});
});

[Franceschino]

Inserisco anche l'html perchè altrimenti forse la cosa è un pò incomprensibile...

<div id='comune' class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 80px;">Comune</label>
    <select class="contentbox" id='comune1' name='comune1' style='width:160px;'>
       
         <optgroup label="" id="pr_1" disabled="disabled" >
        <option value='comuneA'>comuneA</option>
        <option value='comuneB'>comuneB</option>
        <option value='comuneC'>comuneC</option>
        <option value='comuneD'>comuneD</option>
        </optgroup>

        <optgroup label="" id="pr_2" disabled="disabled" >
        <option value='comuneE'>comuneE</option>
        <option value='comuneF'>comuneF</option>
        <option value='comundeG'>comuneG</option>
        <option value='comuneH'>comuneH</option>
        </optgroup>
         -
         - e così via per tutte le province
         -
      </select>
  </div>