Gestione del tasto invio del modulo contatti
Autor: Paolo M.
Besucht 875,
Followers 2,
Geteilt 0
Chiedo aiuto per capire se è possibile, anche (e probabilmente soprattutto) via codice aggiuntivo, gestire il modulo contatti per fare altre cose oltre a quelle preimpostate dall'oggetto.
Il modulo contatti mi pare molto comodo per costruire form strutturati, ma se ad esempio volessi generare un pdf con i dati raccolti ? oppure richiamare una funzione diversa al submit ? o ancora, aggiungere altre azioni prima dell'invio della mail...
apro questo post per un confronto a 360° con lo staff e gli altri utenti
Gepostet am
... essendoci mail_form e mail_form, ...da parte mia, come al solito mio, per poter valutare mi serve il LINK di una pagina online funzionante,. magari fatta per il Test...
... se lo farai casomai ci risentiremo domani in giornata...
.
ciao
.
Autor
diciamo che per fare qualche prova un form vale l'altro,
https://www.evolusystem.com/test-firma.html
in questo ad esempio, ho aggiunto dei tasti accanto al tasto invia per fare altre cose, ma se volessi toglierlo proprio il tasto invia ? oppure far partire più funzioni con il tasto invia ? tipo l'esportazione del pdf e poi l'invio della mail, o viceversa..
ovviamente per un form così piccolo si fa prima a farlo a mano, ma con form più articolati..
... no! ...non è proprio così; ...il tuo è diverso da altri...
... il pulsante invio è affiancato da altri pulsanti, non è l'ultimo, e non è centrato in una riga propria...
... pertanto e comunque ho sopperito con altra mia invenzione per ottenerne il controllo...
... questo è il codice di base per assegnare condizioni ed azioni al posto del pulsante INVIA di base, e nel caso servisse attivare le condizioni di controllo di questo, allora riattivarlo come ultima condizione dopo aver verificato le altre condizioni extra...
... le condizioni extra che si desiderano vanno inserite nella sezione ALERT "//K3>;":
<script>
$(document).ready(function () {//K>;
/** --- controllo esclusivo EXTRA x pulsante INVIO x WSx5[265997] 12-7-2024 by KolAsim --**/
//---inizio K-------
objectK = "#imObjectForm_1_form"; // ID del FORM;
//-------------------------
StopInvioTastieraK = "cliccare il pulsante INVIO del mail_form";
$(objectK + ' input:not(textarea) ').keydown(function(event){//K1>;
if(event.keyCode == 13) {//K2>;
alert(StopInvioTastieraK)
return false;
}//K2<<;
});//K1<<;
//-------------------------------
// codice supplementare - separa, sposta e centra INVIO ;
$(objectK+'_submit').wrap('<div id="schermoK" style="position:relative;background-color:yellow;'+
'width:50px; left: 50%; transform: translate(-50%, 0);cursor:pointer"><hr></div>');
$("#schermoK").appendTo(objectK);
//------div_custom EXTRA K --------------------------
$("<div id='divK' />").css({position: "absolute", width: "100%", height: "100%", right: 0,
top: 0, zIndex: 1000000}).appendTo($(objectK+'_submit').parent());
$("#divK").click(function(){//K3>;
//Assegnare qui al posto di ALERT tutte le azioni, le condizioni e le funzioni di controllo del caso e per riattivare i controlli del pulsante INVIO di base;
alert("Azione su click INVIO custom K\nAssegnare qui le azioni e le condizioni del caso")
})//K3<<;
//---fine K-------
});//K<<;
</script>
.
ciao
.
Autor
Fantastico, quindi questo blocca anche la pressione del tasto "invio" che dovrebbe essere il keycode 13 ?
Appena posso faccio alcune prove, per ora ti ringrazio infinitamente !!
PS. ma ti si può contattare per lavoro ?
... sì ssì...
... la mia partecipazione per quanto mi è possibile è solo qui nel Forum WSx5......
... se avrai bisogno di chiarimenti, ti farai risentire...
.
ciao
.
Autor
qualcosa non va: ho messo il codice così com'è prima della chiusura del tag BODY,
la pressione del tasto invio ora è inibita, compare solo il messaggio,
però lo script non separa il tasto invio dagli altri.
ho provato comunque a cambiare "#divK" con #imObjectForm_1_buttonswrap e in questo modo qualsiasi tasto venga clickato compare l'alert "azione su click INVIO....", però quando chiudo l'alert comunque lui poi esegue il comando di default..
Autor
che poi a me quei tasti in più non servono, ora li ho spostati per lasciare da solo il tasto invio...
... per la logica da me ideata non va bene quella modifica che hai fatto al codice...
... il compito del mio codice è intercettare gli eventi EXTRA prima dell'azione sul pulsante INVIO di base...
... una volta verificate le azioni EXTRA nella funzione "K3>;" come ultimo evento va riabilitata l'azione sul pulsante INVIO per riattivare i controlli di questo sulle regolarità del form...
.... dovresti postare l'esempio con il mio codice integrale per poter valutare...
... ma(!), ...anzi, ...sarebbe meglio se modifichi il form e metti il pulsante INVIO come ultimo oggetto del form, e togliendo pure il mio codice per poter rivalutare...
... come nota, ...il codice andrebbe nella sezione Esperto nella 3^opzione (/HEAD)...
.
Autor
Ok, ho dato una sistemata spostando i tasti e ho tolto il codice che mi avevi gentilmente fornito.
Forse avevo interpretato male io il funzionamento: k1 k2 fermavano il tasto "enter", k3 bloccava il tasto invio ?
in realtà premendo invio lui visualizzava l'alert, ma poi, una volta chiuso l'alert, effettuava il normale submit del form. Io invece avevo capito che lo bloccava proprio fino a nuove istruzioni...
rimetto il link: https://www.evolusystem.com/test-firma.html
... OK ... provalo ... dovrebbe essere intuitivo; ... ho nascosto la cella input della firma perchè era attivabile e valido con qualsiasi carattere; ... in caso si servissero chiarimenti, avvisami...
<script>
//---inizio K-------
$(document).ready(function () {//K>;
/** --- controllo esclusivo EXTRA x pulsante INVIO x WSx5[265997] 17-7-2024 by KolAsim --**/
objectK = "#imObjectForm_1_form"; // ID del FORM;
//----------------------------------------------
alert1K = "alert1K\ncliccare il pulsante INVIO del mail_form";
alert2K = "alert2K\nAzione su click INVIO custom K\nAssegnare qui le azioni e le condizioni del caso";
alert3K = "alert3K\nATTENZIONE!!\nAdesso aziono la funzione controlloK() per attivare il pulsante INVIO";
//----------------------
$(objectK + ' input:not(textarea) ').keydown(function(event){//K1>;
if(event.keyCode == 13) {//K2>;
alert(alert1K)
return false;
};//K2<<;
});//K1<<;
//------div_custom EXTRA K ---------
divK = $('<div id="divK" style="position:absolute; width:60px; height: 40px;'+
'z-index: 10;left: 50%;cursor:pointer;transform:translate(0,-50%);'+
'margin-left:-30px;margin-top:-20px;"></div>')
$(objectK+"_submit").parent().append(divK);
//----------------------
$("#divK").click(function(){//K3>;
//Assegnare qui al posto degli ALERT tutte le azioni, le condizioni e le funzioni di controllo del caso e per riattivare i controlli del pulsante INVIO di base;
alert(alert2K); // una volta capito il funzionamento disattivare l'alert anteponendo //;
alert(alert3K); // una volta capito il funzionamento disattivare l'alert anteponendo //;
controlloK() ;
});//K3<<;
//----------------------
$("#imObjectForm_1_3_container").css("visibility","hidden").css("height","1px");//nascondo cella input-data x firma;
$(objectK+"_submit").click(function(){//K4>;
setTimeout(function(){//K5>;
if ( $("#imTip2").is(':visible')) { //K6>; // #imTip2 = etichetta controllo cella input firma;
$("#signature-pad").css("border","solid 1px red"); // #signature-pad = contenitore firma;
$("#imTip2").css("visibility","visible").css("margin-top","-7px")
}//K6<<;
else {//K7>;
$("#signature-pad").css("border","solid black 1px");
};//K7<<;
}, 500);//K5<<;
});//K4<<;
})//K<<;
//----------f K7------------
function controlloK(){//K7>;
$(objectK+"_submit").click()
};//K7<<;
//---fine K-------
</script>
.
Autor
Grazie ancora per il tuo contributo !
si, il campo firma l'avevo solo lasciato visibile per vedere funzionare il codice, ma ovviamente andava poi nascosto.
ho incollato il codice così com'è nella sezione esperto, prima della chiusura del tag "head", però continuo a riscontrare che il tasto "invia" funziona regolarmente.
Il tasto "enter" è bloccato e fa partire l'alert, ma il tasto "invia" del form non fa partire nessun alert, ma esegue l'azione di default, ossia invia la mail dopo aver controllato i campi obbligatori.
...provando direttamente il mio codice in simulazione mi funziona...
...!... non vorrei che possa dipendere dal fatto che il codice si attivi prima del completamento del caricamento della pagina...!...
... sostituisci il codice attuale con questo codice; ...è lo stesso ma vi ho applicato un ritardo di 3 secondi (3000ms) per l'attivazione del codice...
<script>
//---inizio K-------
$(document).ready(function () {//K>;
/** --- controllo esclusivo EXTRA x pulsante INVIO x WSx5[265997] 18-7-2024 by KolAsim --**/
objectK = "#imObjectForm_1_form"; // ID del FORM;
setTimeout(function(){ //K0>;
//----------------------------------------------
alert1K = "alert1K\ncliccare il pulsante INVIO del mail_form";
alert2K = "alert2K\nAzione su click INVIO custom K\nAssegnare qui le azioni e le condizioni del caso";
alert3K = "alert3K\nATTENZIONE!!\nAdesso aziono la funzione controlloK() per attivare il pulsante INVIO";
//----------------------
$(objectK + ' input:not(textarea) ').keydown(function(event){//K1>;
if(event.keyCode == 13) {//K2>;
alert(alert1K)
return false;
};//K2<<;
});//K1<<;
//------div_custom EXTRA K ---------
divK = $('<div id="divK" style="position:absolute; width:60px; height: 40px;'+
'z-index: 10;left: 50%;cursor:pointer;transform:translate(0,-50%);'+
'margin-left:-30px;margin-top:-20px;"></div>')
$(objectK+"_submit").parent().append(divK);
//----------------------
$("#divK").click(function(){//K3>;
//Assegnare qui al posto degli ALERT tutte le azioni, le condizioni e le funzioni di controllo del caso e per riattivare i controlli del pulsante INVIO di base;
alert(alert2K); // una volta capito il funzionamento disattivare l'alert anteponendo //;
alert(alert3K); // una volta capito il funzionamento disattivare l'alert anteponendo //;
controlloK() ;
});//K3<<;
//----------------------
$("#imObjectForm_1_3_container").css("visibility","hidden").css("height","1px");//nascondo cella input-data x firma;
$(objectK+"_submit").click(function(){//K4>;
setTimeout(function(){//K5>;
if ( $("#imTip2").is(':visible')) { //K6>; // #imTip2 = etichetta controllo cella input firma;
$("#signature-pad").css("border","solid 1px red"); // #signature-pad = contenitore firma;
$("#imTip2").css("visibility","visible").css("margin-top","-7px")
}//K6<<;
else {//K7>;
$("#signature-pad").css("border","solid black 1px");
};//K7<<;
}, 500);//K5<<;
});//K4<<;
}, 3000);//K0<<;
})//K<<;
//----------f K8------------
function controlloK(){//K8>;
$(objectK+"_submit").click()
};//K7<<;
//---fine K-------
</script>
.
ciao
.
... mi son trovato a passare ed ho controllato, adesso è OK, ...quindi, essendo rimasto tutto uguale influiva la latenza...
.
Autor
Eccomi, ho provato, ora funziona !!
ho ridotto il tempo a mezzo secondo e pare funzioni lo stesso,
poi ho commentato la chiamata controllok(); e in questo modo vedo che a fine ciclo la mail non parte !!
Così è super-utile, posso concatenare gli alert, la generazione del pdf, e l'invio della mail senza che l'utente possa cambiare qualcosa tra uno step e l'altro..
Grazie mille !! a buon rendere !!
... su questo, ... ho ricontrollato adesso e non mi ha funzionato come avvenuto prima, ...forse troppo basso il valore in //K0<<
.
Autor
visti gli orari di quando abbiamo postato deduco che hai provato proprio subito dopo che avevo sostituito il codice
Autor
a me sta funzionando, dici sia il caso di rialzarlo ? 3 secondi mi sembra un'infinità..
... quando avevo provato era a 3000, ... adesso a 500 non mi funziona; ...magari prova con 1000
.
Autor
ora ho messo 1500.. ma dipende quindi dalla connessione, dal client.. altrimenti dovrebbe non funzionare anche a me.. dico bene ?
... non funziona; ...hai disattivato la funzione chiave // controlloK() ;
Autor
allora non ho capito nulla.. se attivo la funzione controlloK(); a me dopo partono le funzioni di default, dopo quelle personalizzate , io invece al momento non voglio che partano solo quelle personalizzate..
Autor
correggo: voglio che partano SOLO quelle personalizzate
... ah! ...allora OK ok, ... infatti non vedevo gli avvisi dei campi e la firma in rosso(extra)...
Autor
Funziona alla grande !!
... OK ... ciao...