Problemi Chronoforms e java

[kingodino]

Salve ragazzi,
stavo cercando di creare un form con chronoforms che mi permetta di, selezionata la voce di un dropdown, mi visualizzi un'altro dropdown con le relative voci.
Mi crea però questi problemi:
1) Mi sposta i menu nel content (cioè sotto il form)
2) I menu a discesa mi funzionano solo per le prime due voci
3) Mi sparisce il resto del form (dopo le dropdown)
Il  codice è il seguente

Codice: [Seleziona]

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

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 150px;">Nome</label>
    <input class="cf_inputbox required" maxlength="150" size="30" title="" id="text_1" name="text_nome_operatore" type="text" />
 
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 150px;">Cognome</label>
    <input class="cf_inputbox required" maxlength="150" size="30" title="" id="text_2" name="text_cognome_operatore" type="text" />
 
  </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 di appartenenza</label>
    <select class="cf_inputbox" id="select_1" size="1" title=""  name="prov" onChange="updatethis(this.form);">
    <option value="">Clicca per scegliere</option>
      <option value="rc">Reggio Calabria</option>
<option value="vv">Vibo Valentia</option>
<option value="kr">Crotone</option>
<option value="cz">Catanzaro</option>
<option value="cs">Cosenza</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">Provincia di appartenenza :: Selezionare la Provincia di appartenenza</div>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div id="variabile1" style="display: none;">
<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 25px;">C.P.I.</label>
    <select class="cf_inputbox validate-selection" id="select_5" size="1" title=""  name="cpi" onChange="updatethis(this.form);">
    <option value="">Clicca per scegliere</option>
<option value="1">Reggio Calabria</option>
<option value="2">Gioia Tauro</option>
<option value="3">Locri</option>


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

<div id="variabile2" style="display: none;">
<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 25px;">C.P.I.</label>
    <select class="cf_inputbox validate-selection" id="select_6" size="1" title=""  name="cpi1" onChange="updatethis(this.form);">
<option value="">Clicca per scegliere</option>
<option value="6">Vibo Valentia</option>
<option value="7">Serra San Bruno</option>


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

<div id="variabile3" style="display: none;">
<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 25px;">C.P.I.</label>
    <select class="cf_inputbox validate-selection" id="select_7" size="1" title=""  name="cpi2" onChange="updatethis(this.form);">
<option value="">Clicca per scegliere</option>
<option value="4">Crotone</option>
<option value="5">Cirò Marina</option>


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


<div id="variabile4" style="display: none;">
<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 25px;">Tipo</label>
    <select class="cf_inputbox validate-selection" id="select_8" size="1" title=""  name="cpi3" onChange="updatethis(this.form);">
    <option value="">Clicca per scegliere</option>
<option value="8">Catanzaro</option>
<option value="9">Lametia Terme</option>
<option value="10">Soverato</option>

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

<div id="variabile5" style="display: none;">
<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 25px;">Tipo</label>
    <select class="cf_inputbox validate-selection" id="select_9" size="1" title=""  name="cpi4" onChange="updatethis(this.form);">
    <option value="">Clicca per scegliere</option>
<option value="11">Cosenza</option>
<option value="12">Castrovillari</option>
<option value="13">Corigliano Calabro</option>
<option value="14">Paola</option>
<option value="15">Rossano</option>


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

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 150px;">EMail</label>
    <input class="cf_inputbox required validate-email" maxlength="150" size="30" title="" id="text_5a" name="text_email_operatore1" type="text" />
 
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_checkbox">
    <label class="cf_label" style="width: 150px;">Dichiaro di aver letto l'informativa inerente la privacy</label>
    <div class="float_left">
      <input value="Si" title="" class="radio validate-one-required" id="check10" name="check09[]" type="checkbox" />
      <label for="check10" class="check_label">Si</label>
      <br />
     

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

<div class="form_item">
  <div class="form_element cf_button">
    <input value="INVIO" name="button_9" type="submit" />
  </div>
  <div class="cfclear">&nbsp;</div>
</div>


Codice: [Seleziona]

function updatethis(form){
var cip = form.elements['select_1'].value;

if (cip=="rc") {document.getElementById("variabile1").style.display = 'block';
document.getElementById("variabile2").style.display = 'none';
document.getElementById("variabile3").style.display = 'none';
document.getElementById("variabile4").style.display = 'none';
document.getElementById("variabile5").style.display = 'none';

}
else if (cip=="vv") {document.getElementById("variabile2").style.display = 'block';
document.getElementById("variabile1").style.display = 'none';
document.getElementById("variabile3").style.display = 'none';
document.getElementById("variabile4").style.display = 'none';
document.getElementById("variabile5").style.display = 'none';
}
else if (cip=="kr") {document.getElementById("variabile3").style.display = 'block';
document.getElementById("variabile1").style.display = 'none';
document.getElementById("variabile2").style.display = 'none';
document.getElementById("variabile4").style.display = 'none';
document.getElementById("variabile5").style.display = 'none';

}
else if (cip=="cz") {document.getElementById("variabile4").style.display = 'block';
document.getElementById("variabile1").style.display = 'none';
document.getElementById("variabile2").style.display = 'none';
document.getElementById("variabile3").style.display = 'none';
document.getElementById("variabile5").style.display = 'none';

}
else if (cip=="cs") {document.getElementById("variabile5").style.display = 'block';
document.getElementById("variabile1").style.display = 'none';
document.getElementById("variabile2").style.display = 'none';
document.getElementById("variabile3").style.display = 'none';
document.getElementById("variabile4").style.display = 'none';

}
}

Qualcuno cortesemente gli può dare un'occhiata?
Grazie

[vales]

Manca la chiusura di alcuni div di quelli che hai aggiunto per gestire le dropdown nascoste

Prova così:

Codice: [Seleziona]

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

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 150px;">Nome</label>
    <input class="cf_inputbox required" maxlength="150" size="30" title="" id="text_1" name="text_nome_operatore" type="text" />
 
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 150px;">Cognome</label>
    <input class="cf_inputbox required" maxlength="150" size="30" title="" id="text_2" name="text_cognome_operatore" type="text" />
 
  </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 di appartenenza</label>
    <select class="cf_inputbox" id="select_1" size="1" title=""  name="prov" onChange="updatethis(this.form);">
    <option value="">Clicca per scegliere</option>
      <option value="rc">Reggio Calabria</option>
<option value="vv">Vibo Valentia</option>
<option value="kr">Crotone</option>
<option value="cz">Catanzaro</option>
<option value="cs">Cosenza</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">Provincia di appartenenza :: Selezionare la Provincia di appartenenza</div>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div id="variabile1" style="display: none;">
<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 25px;">C.P.I.</label>
    <select class="cf_inputbox validate-selection" id="select_5" size="1" title=""  name="cpi" onChange="updatethis(this.form);">
    <option value="">Clicca per scegliere</option>
<option value="1">Reggio Calabria</option>
<option value="2">Gioia Tauro</option>
<option value="3">Locri</option>


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

<div id="variabile2" style="display: none;">
<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 25px;">C.P.I.</label>
    <select class="cf_inputbox validate-selection" id="select_6" size="1" title=""  name="cpi1" onChange="updatethis(this.form);">
<option value="">Clicca per scegliere</option>
<option value="6">Vibo Valentia</option>
<option value="7">Serra San Bruno</option>


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

<div id="variabile3" style="display: none;">
<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 25px;">C.P.I.</label>
    <select class="cf_inputbox validate-selection" id="select_7" size="1" title=""  name="cpi2" onChange="updatethis(this.form);">
<option value="">Clicca per scegliere</option>
<option value="4">Crotone</option>
<option value="5">Cirò Marina</option>


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

<div id="variabile4" style="display: none;">
<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 25px;">Tipo</label>
    <select class="cf_inputbox validate-selection" id="select_8" size="1" title=""  name="cpi3" onChange="updatethis(this.form);">
    <option value="">Clicca per scegliere</option>
<option value="8">Catanzaro</option>
<option value="9">Lametia Terme</option>
<option value="10">Soverato</option>

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

<div id="variabile5" style="display: none;">
<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 25px;">Tipo</label>
    <select class="cf_inputbox validate-selection" id="select_9" size="1" title=""  name="cpi4" onChange="updatethis(this.form);">
    <option value="">Clicca per scegliere</option>
<option value="11">Cosenza</option>
<option value="12">Castrovillari</option>
<option value="13">Corigliano Calabro</option>
<option value="14">Paola</option>
<option value="15">Rossano</option>


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

<div class="form_item">
  <div class="form_element cf_textbox">
    <label class="cf_label" style="width: 150px;">EMail</label>
    <input class="cf_inputbox required validate-email" maxlength="150" size="30" title="" id="text_5a" name="text_email_operatore1" type="text" />
 
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_checkbox">
    <label class="cf_label" style="width: 150px;">Dichiaro di aver letto l'informativa inerente la privacy</label>
    <div class="float_left">
      <input value="Si" title="" class="radio validate-one-required" id="check10" name="check09[]" type="checkbox" />
      <label for="check10" class="check_label">Si</label>
      <br />
     

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

<div class="form_item">
  <div class="form_element cf_button">
    <input value="INVIO" name="button_9" type="submit" />
  </div>
  <div class="cfclear">&nbsp;</div>
</div>


[kingodino]

  perfetto!!!!!!!!!!!!!!!!
L'unico inconveniente ( se così si puo chiamare) è che il dropdown nascosto non si allinea con l'altro....
per il resto SEI GRANDE

[vales]

Ho visto c'è un altro problemino, viene visualizzato il testo del tooltip della dropdown principale, questo nella mia prova.
Forse c'è del codice sporco anche li controlla.

Eventualmente riscrivi il tutto a volte chrono si annoda in modo inspiegabile ... per ora.

[kingodino]

Il tooltip non è prettamente necessario.
Ho fatto una prova e l'ho tolto ma non è cambiato nulla...

[vales]

penso sia l'allineamento delle label che normalmente è 150, forse lo hai modificato ?

[kingodino]

  GRAZIE come sempre il tuo parere è giusto!!!!!!