Form a geometria variabile

[elleoerre]

Salve, ho seguito quest'articolo http://www.joomla.it/articoli-della-community/3832-form-a-geometria-variabile-con-chronoforms.html solo che però fa riferimento a una vecchia versione di chronoforms per joomla 1.5.
Ho provato cmq a realizzarlo per la versione che sto usando io di chronoforms, la 4.0 RC3.5.2. Il codice javascript, dove va inserito? Io ho aggiunto una nuova action nell'evento Onload in cu ho inserito il codice javascript con la modifica della riga segnalata e dopo sono andato nella scheda code della form in questione e ho fatto le modifiche dovute con il risultato però che non funziona niente... Dove sbaglio?
Provo a postare qui il codice html della form, chissà che non sbaglio qualcosa:

Codice: [Seleziona]

<div class="ccms_form_element cfdiv_header" id="1_container_div" style=""><h1 style="text-align: center;"><span style="text-decoration: underline;"><strong>PASSAPORTI</strong></span></h1><div class="clear"></div></div><fieldset class="cf_container ccms_form_element " id="cf_container_20"><legend>Richiesta</legend><div class="ccms_form_element cfdiv_datetime" id="dataistanza1_container_div" style=""><label>Data Istanza</label><input maxlength="150" size="16" class="data_input validate['required'] cf_date_picker" title="" type="text" value="" name="dataistanza" />
<div class="clear"></div><div id="error-message-dataistanza"></div></div><div class="ccms_form_element cfdiv_radio" id="urgenza1_container_div" style=""><label>Urgenza</label><input type="hidden" name="urgenza" value="" alt="ghost" />
<div style="float:left; clear:none;"><input type="radio" name="urgenza" id="urgenza_0" title="" value="No" class="validate['required']" />
<label for="urgenza_0">No</label>
<input type="radio" name="urgenza" id="urgenza_1" title="" value="Si" class="validate['required']" />
<label for="urgenza_1">Si</label>
</div><div class="clear"></div><div id="error-message-urgenza"></div></div><div class="ccms_form_element cfdiv_radio" id="residenza1_container_div" style=""><label>Residenza</label><input type="hidden" name="residenza" value="" alt="ghost" />
<div style="float:left; clear:none;"><input type="radio" name="residenza" id="residenza_0" title="" value="Fiumicino" class="validate['required']" />
<label for="residenza_0">Fiumicino</label>
<input type="radio" name="residenza" id="residenza_1" title="" value="Roma" class="validate['required']" />
<label for="residenza_1">Roma</label>
<input type="radio" name="residenza" id="residenza_2" title="" value="Altro" class="validate['required']" />
<label for="residenza_2">Altro</label>
</div><div class="clear"></div><div id="error-message-residenza"></div></div><div class="ccms_form_element cfdiv_radio" id="pregiudizi1_container_div" style=""><label>Pregiudizi</label><input type="hidden" name="pregiudizi" value="" alt="ghost" />
<div style="float:left; clear:none;"><input type="radio" name="pregiudizi" id="pregiudizi_0" title="" value="No" class="validate['required']" />
<label for="pregiudizi_0">No</label>
<input type="radio" name="pregiudizi" id="pregiudizi_1" title="" value="Si" class="validate['required']" />
<label for="pregiudizi_1">Si</label>
</div><div class="clear"></div><div id="error-message-pregiudizi"></div></div></fieldset><fieldset class="cf_container ccms_form_element " id="cf_container_14"><legend>Rilascio</legend><div class="ccms_form_element cfdiv_radio" id="rilasciato1_container_div" style=""><label>Rilasciato</label><input type="hidden" name="rilasciato" value="" alt="ghost" />
<div style="float:left; clear:none;"><input type="radio" name="rilasciato" id="rilasciato_0" title="" value="No" class="validate['required']" rel="none" />
<label for="rilasciato_0">No</label>
<input type="radio" name="rilasciato" id="rilasciato_1" title="" value="Si" class="validate['required']" rel="mostra"/>
<label for="rilasciato_1">Si</label>
</div><div class="clear"></div><div id="error-message-rilasciato"></div></div><div class="ccms_form_element cfdiv_datetime" id="datarilascio1_container_div" style="" rel="mostra"><label>Data Rilascio</label><input maxlength="150" size="16" class="data_input cf_date_picker" title="" type="text" value="" name="datarilascio" />
<div class="clear"></div><div id="error-message-datarilascio"></div></div></fieldset><div class="ccms_form_element cfdiv_submit" id="input_submit_131_container_div" style="text-align:center"><input name="input_submit_13" class="" value="Invia" type="submit" />
<div class="clear"></div><div id="error-message-input_submit_13"></div></div>
Praticamente, quando carico la form, il campo che non dovrei vedere e cioè "Data Rilascio" non si vede e va bene così ma se nella radio precedente e cioè quella "Rilasciato" scelgo si, non mi compare nulla... 
Sapreste aiutarmi?

[elleoerre]

Posto un'immagine della form per comprenderla meglio e più velocemente:



[allegato eliminato automaticamente dopo un anno]

[elleoerre]

Ho notato un'altro strano comportamento della mia form, magari può esservi d'aiuto per capire il problema:
Nel momento in cui clicco sulla radio rilsciato, non cambia nulla come gia detto, ma se aggiorno la pagina con F5, se la radio era impostata su no, continua a non comparire il campo data rilascio, mentre se è impostato su si e aggiorno la pagina, il campo data rilascio mi compare...
Mi viene da pensare che ogni qualvolta clicco sulla radio, dovrebbe aggiornare la pagina, operazione che evidentemente non fa... Ma io di javascript non conosco praticamente nulla e non so come muovermi... Qualcuno mi può aiutare? Grazie

[elleoerre]

Ho fatto alcune modifiche alla form dopo aver fatto alcune ricerche sul sito della chronoengine. Praticamente ho sostituito il codice javascript con il seguente:

Codice: [Seleziona]

var checkbox_id, datetime_id, checkbox, datetime, div;
/* edit the next two lines to match the ids of the elements in your form */
checkbox_id = 'checkboxid';
datetime_id = 'datetimeid';

window.addEvent('domready', function() {
  checkbox = $(checkbox_id);
  datetime = $(datetime_id);
  div = $(datetime_id+'_container_div');
  div.dissolve();
  showHide();
  checkbox.addEvent('click', showHide);
});

function showHide() {
  if ( checkbox.checked ) {
    div.reveal();
    datetime.disabled = false;
  } else {
    div.dissolve();
    datetime.value = '';
    datetime.disabled = true;
  }
}
e poi ho sostituito la mia radiobox chiamata "rilasciato" con una checkbox che quando viene selezionata mi visualizza il campo nascosto "Data Rilascio"
Mi funziona perfettamente con l'unico handicap che però il datatime picker  quando viene visualizzato non è modificabile e non capisco il perchè. Se invece sostituisco il datetime picker con una semplice textbox, questa è invece modificabile e quindi la form funziona alla perfezione... Cosa cambia quindi con il datetime picker? qualcuno saprebbe aiutarmi??