Disabilitare tasto invio dopo il submit

**max1975_na** · 26-10-2011, 16:19

Salve a tutti...
Sono sicuro che capita spesso di incappare in chi ha un tic al dito con cui invia i form e ne invia 2 contemporaneamente..

Ho trovato in rete un esempio in javascript che permette di disabilitare il tasto invio dopo il suo click!

Ho un file js che mi fa dei controlli su dei campi obbligatori
e vorrei integrargli quella porzione di codiche che fa il controllo, sto provando da un po, ma il java mi è purtroppo sconoscito come concetto! chiedo il vostro aiuto per unire i file..

mio file:

codice:

function jsTrim(a) {
	lungh=a.length
	if (lungh==0) return a
	var i=0
	var appo=""

	while (a.charAt(i)==' ' && i<lungh) {
	i++
	}
	for(;i<lungh;i++) {
	appo=appo+a.charAt(i)
	}
	a=appo

	lungh=a.length

	if (lungh==0) return a

	appo=""
	i=lungh-1
	while (a.charAt(i)==' ' && i>=0) {
	i--
	}
	for(;i>=0;i--) {
	appo=a.charAt(i)+appo
	}
	a=appo

	return a
}

	function ValNull(item) {
	if (item == "") return false;
    return true;
	}

	function ValidLength(item, len) {
	return (item.length >= len);
	}
	function ValidNumber(item) {
	if (isNaN(item) == true) return false;
    return true;
	}

   function ValidEmail(item) {
   if (!ValidLength(item, 5)) return false;
   if (item.indexOf ('@', 0) == -1) return false;
   if (item.indexOf ('.', 0) == -1) return false;
   if (item.indexOf (':', 0) != -1) return false;
   if (item.indexOf ('#', 0) != -1) return false;
   if (item.indexOf ('/', 0) != -1) return false;
   if (item.indexOf ('ç', 0) != -1) return false;
   if (item.indexOf ('ÿ', 0) != -1) return false;
   if (item.indexOf ('ÿ', 0) != -1) return false;
   if (item.indexOf ('ý', 0) != -1) return false;
   if (item.indexOf ('ü', 0) != -1) return false;
   if (item.indexOf ('û', 0) != -1) return false;
   if (item.indexOf ('ú', 0) != -1) return false;
   if (item.indexOf ('ù', 0) != -1) return false;
   if (item.indexOf ('ö', 0) != -1) return false;
   if (item.indexOf ('õ', 0) != -1) return false;
   if (item.indexOf ('ô', 0) != -1) return false;
   if (item.indexOf ('ó', 0) != -1) return false;
   if (item.indexOf ('ò', 0) != -1) return false;
   if (item.indexOf ('ñ', 0) != -1) return false;
   if (item.indexOf ('ð', 0) != -1) return false;
   if (item.indexOf ('ï', 0) != -1) return false;
   if (item.indexOf ('î', 0) != -1) return false;
   if (item.indexOf ('ë', 0) != -1) return false;
   if (item.indexOf ('ê', 0) !=  -1) return false;
   return true;
   }

function check(){

	if (jsTrim(document.ricarica_form.gestore.value)=="0") {
  window.alert("Scegli il gestore!");
	document.ricarica_form.gestore.focus();
	return false;
	}
  if (jsTrim(document.ricarica_form.importo.value)=="0") {
  window.alert("Scegli l'importo della ricarica!");
	document.ricarica_form.importo.focus();
	return false;
	}
	if (jsTrim(document.ricarica_form.prefisso.value)=="") {
  window.alert("Inserire il prefisso!");
	document.ricarica_form.prefisso.focus();
	return false;
	}
  else{
		if (!ValidNumber(document.ricarica_form.prefisso.value)){
			window.alert("Il prefisso inserito non è un valore numerico!");
			document.ricarica_form.prefisso.focus();
			return	false;
			}
	}
if (jsTrim(document.ricarica_form.numero.value)=="") {
  window.alert("Inserire il telefono!");
	document.ricarica_form.numero.focus();
	return false;
	}
  else{
		if (!ValidNumber(document.ricarica_form.numero.value)){
			window.alert("Il telefono inserito non è un valore numerico!");
			document.ricarica_form.numero.focus();
			return	false;
			}
	}
return true;
	}

codice su altro form

codice:

function Invia()
{
    var testo = document.modulo.testo.value;
    if (testo == "")
    {
        alert("Il campo è obbligatorio!");
    }
    else
    {
        document.modulo.bottone.value = "Invio in corso...";
        document.modulo.bottone.disabled = true;
        window.setTimeout("Esegui()", 5000);
    }
}

function Esegui()
{
    document.modulo.method = "post";
    document.modulo.action = "esegui.asp";
    document.modulo.submit();
}

Logicamente mi servirebbe questa porzione di codice:

codice:

document.modulo.bottone.value = "Invio in corso...";
document.modulo.bottone.disabled = true;
window.setTimeout("Esegui()", 5000);

da integrare nel mio, ma nn so come ne dove...
poi mi chiedevo nella mia form devo eliminare i campi action="" e method="" per utilizzare quelli presenti nella funzione Esegui()

Spero di essermi spiegato correttamente ed in un Vs positivo riscontro

O comunque sono accettati altri consigli!!!

**Xinod** · 26-10-2011, 23:56

subito dopo
function check(){
aggiungi
document.modulo.bottone.disabled = true;

e prima di ogni return false (e volendo anche prima del return true)
document.modulo.bottone.disabled = false;

ciao

**max1975_na** · 27-10-2011, 11:49

Ciao xinod e grazie per la risposta...

devo però dirti che sembra non funzionare!
in primis, visto che il name del mio form è "ricarica_form" o sostituito
document..bottone.disabled = true;
document.modulo.bottone.disabled = false;
in
document.ricarica_form.bottone.disabled = true;
document.ricarica_form.bottone.disabled = false;

poi ho fatto come mi hai detto, posto solo la porzione che penso vada modificata

Codice PHP:


function check(){

document.ricarica_form.bottone.disabled = true;



    if (jsTrim(document.ricarica_form.gestore.value)=="0") {

  window.alert("Scegli il gestore!");

    document.ricarica_form.gestore.focus();

    return false;

    document.ricarica_form.bottone.disabled = false;

    }

  if (jsTrim(document.ricarica_form.importo.value)=="0") {

  window.alert("Scegli l'importo della ricarica!");

    document.ricarica_form.importo.focus();

    return false;

    document.ricarica_form.bottone.disabled = false;

    }

    if (jsTrim(document.ricarica_form.prefisso.value)=="") {

  window.alert("Inserire il prefisso!");

    document.ricarica_form.prefisso.focus();

    return false;

    document.ricarica_form.bottone.disabled = false;

    }

  else{

        if (!ValidNumber(document.ricarica_form.prefisso.value)){

            window.alert("Il prefisso inserito non è un valore numerico!");

            document.ricarica_form.prefisso.focus();

            return    false;

            document.ricarica_form.bottone.disabled = false;

            }

    }

if (jsTrim(document.ricarica_form.numero.value)=="") {

  window.alert("Inserire il telefono!");

    document.ricarica_form.numero.focus();

    return false;

    document.ricarica_form.bottone.disabled = false;

    }

  else{

        if (!ValidNumber(document.ricarica_form.numero.value)){

            window.alert("Il telefono inserito non è un valore numerico!");

            document.ricarica_form.numero.focus();

            return    false;

            document.ricarica_form.bottone.disabled = false;

            }

    }

return true;

document.ricarica_form.bottone.disabled = false;

Succede questo, al primo controllo, quindi sul gestore, da l'alert di campo vuoto e il bottone si disabilita.
se elimino il codice subito dopo function check(){ quindi

function check(){
//document.ricarica_form.bottone.disabled = true;

il form mi esegue gli altri controlli e se tutto corretto parte la pagina!
ma in locale è cosi veloche che nn riesco a capire se il tasto si disabilita

come posso provare?
Grazie

**Xinod** · 27-10-2011, 15:03

posta anche tutto l' html del form

**max1975_na** · 27-10-2011, 15:56

ecco quanto chiesto, il file option_ricariche.js non lo posto perche penso nn serva... mi gestisce la select gestore con quella importo

Codice PHP:


  <script type="text/javascript" src="js/ricarica_form.js"/></script>

  <script type="text/javascript" src="js/option_ricariche.js"/></script>



<form action="/includes/inc_send_ricarica.asp" method="post" name="ricarica_form" class="search_form general_form">



<fieldset>



<div class="forms">





<div class="row">

<label>Gestore:</label>

<div class="inputs">

<span class="input_wrapper blank">

<select name="gestore" id="combo_0" onChange="change(this);">

<option value="0">--Seleziona operatore--</option>

<option value="1">Tim</option>

<option value="2">Vodafone</option>

<option value="3">Wind</option>

<option value="4">Tre</option>



</select>

</span>

</div>

</div>







<div class="row">

<label>Taglio:</label>

<div class="inputs">

<span class="input_wrapper blank">

<select name="importo" id="combo_1" onChange="change(this)">

<option value="0">--Seleziona importo--</option>

</select>

</span>

</div>

</div>





<div class="row">

<label>Numero telefono:</label>

<div class="inputs">

<ul>[*]

<span class="input_wrapper mini_input">

<input class="text" name="prefisso" type="text" maxlength="3"/>

</span>



[*]

<span class="input_wrapper medium_input">

<input class="text" name="numero" type="text" maxlength="7"/>

</span>

[/list]

</div>

</div>





<div class="row">



<div class="buttons">

<ul>[*]<span class="button send_form_btn"><span><span>INVIA RICARICA</span></span><input onclick="javascript:return check(); " name="bottone" type="submit" /></span>[/list]

</div>

</div>



</div>



</fieldset>



<input type="hidden" name="credito_residuo" value="<%= strUsRicCredito %>">

<input type="hidden" name="credito_residuo_virtuale" value="<%= strUsRicCreditoVirtuale %>">

<input type="hidden" name="id_cliente" value="<%=strUsRicId%>">

<input type="hidden" name="tipo_listino" value="<%=strUsRicListino%>">

<input type="hidden" name="tipo_ricarica" value="2">

</form>

ricarica_form.js

codice:

function jsTrim(a) {
	lungh=a.length
	if (lungh==0) return a
	var i=0
	var appo=""

	while (a.charAt(i)==' ' && i<lungh) {
	i++
	}
	for(;i<lungh;i++) {
	appo=appo+a.charAt(i)
	}
	a=appo

	lungh=a.length

	if (lungh==0) return a

	appo=""
	i=lungh-1
	while (a.charAt(i)==' ' && i>=0) {
	i--
	}
	for(;i>=0;i--) {
	appo=a.charAt(i)+appo
	}
	a=appo

	return a
}

	function ValNull(item) {
	if (item == "") return false;
    return true;
	}

	function ValidLength(item, len) {
	return (item.length >= len);
	}
	function ValidNumber(item) {
	if (isNaN(item) == true) return false;
    return true;
	}

   function ValidEmail(item) {
   if (!ValidLength(item, 5)) return false;
   if (item.indexOf ('@', 0) == -1) return false;
   if (item.indexOf ('.', 0) == -1) return false;
   if (item.indexOf (':', 0) != -1) return false;
   if (item.indexOf ('#', 0) != -1) return false;
   if (item.indexOf ('/', 0) != -1) return false;
   if (item.indexOf ('ç', 0) != -1) return false;
   if (item.indexOf ('ÿ', 0) != -1) return false;
   if (item.indexOf ('ÿ', 0) != -1) return false;
   if (item.indexOf ('ý', 0) != -1) return false;
   if (item.indexOf ('ü', 0) != -1) return false;
   if (item.indexOf ('û', 0) != -1) return false;
   if (item.indexOf ('ú', 0) != -1) return false;
   if (item.indexOf ('ù', 0) != -1) return false;
   if (item.indexOf ('ö', 0) != -1) return false;
   if (item.indexOf ('õ', 0) != -1) return false;
   if (item.indexOf ('ô', 0) != -1) return false;
   if (item.indexOf ('ó', 0) != -1) return false;
   if (item.indexOf ('ò', 0) != -1) return false;
   if (item.indexOf ('ñ', 0) != -1) return false;
   if (item.indexOf ('ð', 0) != -1) return false;
   if (item.indexOf ('ï', 0) != -1) return false;
   if (item.indexOf ('î', 0) != -1) return false;
   if (item.indexOf ('ë', 0) != -1) return false;
   if (item.indexOf ('ê', 0) !=  -1) return false;
   return true;
   }

function check(){
//document.ricarica_form.bottone.disabled = true;

	if (jsTrim(document.ricarica_form.gestore.value)=="0") {
  window.alert("Scegli il gestore!");
	document.ricarica_form.gestore.focus();
	return false;
	document.ricarica_form.bottone.disabled = false;
	}
  if (jsTrim(document.ricarica_form.importo.value)=="0") {
  window.alert("Scegli l'importo della ricarica!");
	document.ricarica_form.importo.focus();
	return false;
	document.ricarica_form.bottone.disabled = false;
	}
	if (jsTrim(document.ricarica_form.prefisso.value)=="") {
  window.alert("Inserire il prefisso!");
	document.ricarica_form.prefisso.focus();
	return false;
	document.ricarica_form.bottone.disabled = false;
	}
  else{
		if (!ValidNumber(document.ricarica_form.prefisso.value)){
			window.alert("Il prefisso inserito non è un valore numerico!");
			document.ricarica_form.prefisso.focus();
			return	false;
			document.ricarica_form.bottone.disabled = false;
			}
	}
if (jsTrim(document.ricarica_form.numero.value)=="") {
  window.alert("Inserire il telefono!");
	document.ricarica_form.numero.focus();
	return false;
	document.ricarica_form.bottone.disabled = false;
	}
  else{
		if (!ValidNumber(document.ricarica_form.numero.value)){
			window.alert("Il telefono inserito non è un valore numerico!");
			document.ricarica_form.numero.focus();
			return	false;
			document.ricarica_form.bottone.disabled = false;
			}
	}
return true;
document.ricarica_form.bottone.disabled = false;
	}

grazie per l'interessamento

**max1975_na** · 29-10-2011, 12:13

Nessuna novità ?

**Xinod** · 29-10-2011, 12:37

i controlli su un form devi farli onsubmit sul form, non al click sul submit
altrimenti puo' funzionare cosi' come presentare problemi

<form ... onsubmit="return check()">
...
<input name="bottone" type="submit" />

poi mi sembra di avere detto prima del return false, non dopo

e prima di ogni return false (e volendo anche prima del return true)
document.modulo.bottone.disabled = false;

vedi anche se a parte questo la console segnala errori

**max1975_na** · 29-10-2011, 17:20

Nessun errore!
ho fatto come indicato, ma il form parte lo stesso al doppio click

Codice PHP:


<form action="... onsubmit="return check()" />



<input name="bottone" type="submit" />



function check(){

document.ricarica_form.bottone.disabled = true;



    if (jsTrim(document.ricarica_form.gestore.value)=="0") {

  window.alert("Scegli il gestore!");

    document.ricarica_form.gestore.focus();

    document.ricarica_form.bottone.disabled = false;

     return false;

    }

  if (jsTrim(document.ricarica_form.importo.value)=="0") {

  window.alert("Scegli l'importo della ricarica!");

    document.ricarica_form.importo.focus();

    document.ricarica_form.bottone.disabled = false;

     return false;

  }

    if (jsTrim(document.ricarica_form.prefisso.value)=="") {

  window.alert("Inserire il prefisso!");

    document.ricarica_form.prefisso.focus();

    document.ricarica_form.bottone.disabled = false;

     return false;

    }

  else{

    if (!ValidNumber(document.ricarica_form.prefisso.value)){

    window.alert("Il prefisso inserito non è un valore numerico!");

    document.ricarica_form.prefisso.focus();

    document.ricarica_form.bottone.disabled = false;

     return false;

    }

}

  if (jsTrim(document.ricarica_form.numero.value)=="") {

  window.alert("Inserire il telefono!");

    document.ricarica_form.numero.focus();

    document.ricarica_form.bottone.disabled = false;

     return false;

    }

  else{

  if (!ValidNumber(document.ricarica_form.numero.value)){

    window.alert("Il telefono inserito non è un valore numerico!");

    document.ricarica_form.numero.focus();

    document.ricarica_form.bottone.disabled = false;

     return false;

    }

}

document.ricarica_form.bottone.disabled = false;

return true;



    }

Posso provare un'altra soluzione!

**max1975_na** · 29-10-2011, 17:35

In rete ho cmq trovato un modulo che fa a l caso mio e che funziona... l'unico inconveniente è che mi fa il controllo solo su di un campo, e a me interessa aggiungere anche il controllo sui campi:
prefisso, numero (e verificare che siano numeri)

pensi sia piu facile instradarmi con quest'altro modulo

Codice PHP:


<form name="modulo">

<input type="text" name="testo">

<input type="button" name="bottone" value="Invia" onclick="Invia()">

</form>

Codice PHP:


function Invia()

{

    var testo = document.modulo.testo.value;

    if (testo == "")

    {

        alert("Il campo è obbligatorio!");

    }

    else

    {

        document.modulo.bottone.value = "Invio in corso...";

        document.modulo.bottone.disabled = true;

        window.setTimeout("Esegui()", 5000);

    }

}



function Esegui()

{

    document.modulo.method = "post";

    document.modulo.action = "esegui.asp";

    document.modulo.submit();

}

come aggiungo i miei campi allo script?
Come eseguo il controllo sul campo solo numeri?

**max1975_na** · 29-10-2011, 19:10

Risolto..
Se qualcuno avesse bisogno, sono a disposizione per lo script

Discussione: Disabilitare tasto invio dopo il submit

Strumenti discussione

Ricerca discussione

Visualizza

Disabilitare tasto invio dopo il submit

Permessi di invio