5. Leggere i form HTML
Leggere i form HTML
Vediamo di seguito alcuni metodi che ci consentiranno di leggere rapidamente
tutti i dati contenuti in una form, e di aggiungerli all'array params, pronti
per essere processati e inviati nella prossima richiesta AJAX.
Il metodo principale (e l'unico che richiameremo) è form_read.
Quest'ultimo si servirà di altri due metodi esterni solo nel caso in cui, nella
form HTML che dovrà leggere, ci sarà una select multipla.
Il primo metodo d'appoggio è getSelected, che
legge i valori selezionati nella select multipla e restituisce un'array contenente i suddetti valori. |
AjaxModule.prototype.getSelected = function(opt)
{
var selected = new Array();
var index = 0;
for (var intLoop = 0; intLoop < opt.length; intLoop++)
{
if ((opt[intLoop].selected) || (opt[intLoop].checked))
{
index = selected.length;
selected[index] = new Object;
selected[index].value = opt[intLoop].value;
selected[index].index = intLoop;
}
}
return selected;
}
AjaxModule.prototype.storeSelected = function(opt, p)
{
var sel = AjaxModule.prototype.getSelected(opt);
var strSel = "";
var cont = 0;
for (var item in sel)
{
cont++;
AjaxModule.prototype.params[p + "_" + cont] = sel[item].value;
}
AjaxModule.prototype.params["n_" + p] = cont;
}
AjaxModule.prototype.form_read = function(nome_form)
{
var oForm = document.getElementById(nome_form);
for (var i = 0; i < oForm.elements.length; i++)
{
var oField = oForm.elements[i];
switch (oField.type)
{
case "checkbox" :
case "radio" :
if (oField.checked)
AjaxModule.prototype.params[oField.id] = "1";
else AjaxModule.prototype.params[oField.id] = "0";
break;
case "text" :
case "hidden" :
case "password" :
case "textarea" :
case "select-one" :
AjaxModule.prototype.params[oField.id] = oField.value;
break;
case "select-multiple" :
AjaxModule.prototype.storeSelected(oField.options, oField.id);
break;
}
}
}
Per utilizzare questa nuova funzionalità è sufficiente assegnare un ID alla form che dobbiamo leggere ed utilizzare il seguente codice per estrapolarne i dati.
<script type="text/javascript" language="JavaScript">
imp.form_read('nome_form');
</script>
Una volta chiamato form_read, tutti i valori contenuti nel form HTML saranno pronti e disponibili in params e non dovrete fare altro che effettuare la richiesta al server attraverso il metodo makeRequest. Il codice di esempio, e il codice della classe AjaxModule, li trovate in allegato a questo post. E con questo abbiamo concluso il nostro tutorial. |
| Allegato | Dimensione |
|---|---|
| Esempio_AjaxModule.zip | 10.39 KB |
- Linguaggi:
- Tags:
