Su ANDROID non viene rilevato event.key... SOLO SU ANDROID!

di
SERENAMENTE ADDUCO
il
12 risposte
S
SERENAMENTE ADDUCO
Pochi posts
Iscritto da
set, 2020
Messaggi:
7

Su ANDROID non viene rilevato event.key... SOLO SU ANDROID!

Salve a tutti.
Sto cercando di reinventarmi quindi ho rispolverato la mia passione di sempre: quella di smanettare col codice.
Forse però sto cominciando a pensare troppo in grande e ho sbattuto la faccia contro la realtà!

Poche righe di codice efficientissime su qualsiasi dispositivo e sistema operativo non funzionano su Android (almeno per quanto riguarda Chrome).

Ho messo il codice sull'editor di w3schools per non farvi perdere tempo.
Basta solo cliccare su "RUN" per vederlo funzionare.

https://www.w3schools.com/code/tryit.asp?filename=GJ4PFX5YY4UF

Spero sia di interesse collettivo e che qualcuno abbia una soluzione semplice.

Ho letto il regolamento e mi pare che in tutta la rete non sia mai stata fornita una soluzione a questo problema.
Questa è la prima volta che partecipo ad un forum. Attenderò qui l'aiuto sperato prima di vagabondare per altri forum!
Riguardo ai limiti per l'inserimento di link credo sia tutto ok visto che il regolamento parla di limiti solo sulla firma!
Insomma, se ho sbagliato qualcosa abbiate considerazione per un utente nuovo in assoluto!

Grazie!

12 Risposte

  • andreadev
    andreadev
    Utente Attivo
    Iscritto da
    ago, 2020
    Messaggi:
    94

    Re: Su ANDROID non viene rilevato event.key... SOLO SU ANDROID!

    Ciao, benvenuto nel forum!
    Grazie mille per aver provveduto il codice già pronto da eseguire, è un bell'aiuto!
    Ho fatto qualche ricerca al riguardo, ma purtroppo sembra che su mobile non sia possibile gestire l'input con quegli eventi. Il problema principale è che, anche se l'utente sta scrivendo, il risultato finale potrebbe essere diverso per via del correttore automatico, quindi quegli eventi non vengono lanciati (oltretutto, sembra che "keypress" sia diventato obsoleto).

    In compenso, c'è un evento che viene chiamato ogni volta che dei valori vengono inseriti nella casella, è l'evento "input".
    Purtroppo, però, questo evento viene lanciato dopo che il cambiamento è stato effettuato.

    Il mio consiglio, anche se forse è un po' meno elegante, è quello di tenere a mente il valore della casella di testo, e poi quando viene lanciato l'evento "input", controllare se il testo che è appena stato inserito contiene dei valori che non accetti. In tal caso, reimpostare la casella di testo al valore precedente.

    Prova a vedere se questo risolve il problema. Se serve aiuto per tradurre questo ragionamento in codice fammi pure sapere
  • ninja72
    ninja72
    Utente Attivo
    Iscritto da
    mag, 2020
    Messaggi:
    79

    Re: Su ANDROID non viene rilevato event.key... SOLO SU ANDROID!

    La documentazione indica beforeinput o keydown come possibili sostituti, penso più per keydown.

    Nella parte con if (!regex.test(key)) ci vorrebbe un OR che che abiliti il charCode del tasto delete.
  • S
    SERENAMENTE ADDUCO
    Pochi posts
    Iscritto da
    set, 2020
    Messaggi:
    7

    Re: Su ANDROID non viene rilevato event.key... SOLO SU ANDROID!

    andreadev ha scritto:

    Ciao, benvenuto nel forum!
    Grazie mille per aver provveduto il codice già pronto da eseguire, è un bell'aiuto!
    Ho fatto qualche ricerca al riguardo, ma purtroppo sembra che su mobile non sia possibile gestire l'input con quegli eventi. Il problema principale è che, anche se l'utente sta scrivendo, il risultato finale potrebbe essere diverso per via del correttore automatico, quindi quegli eventi non vengono lanciati (oltretutto, sembra che "keypress" sia diventato obsoleto).

    In compenso, c'è un evento che viene chiamato ogni volta che dei valori vengono inseriti nella casella, è l'evento "input".
    Purtroppo, però, questo evento viene lanciato dopo che il cambiamento è stato effettuato.

    Il mio consiglio, anche se forse è un po' meno elegante, è quello di tenere a mente il valore della casella di testo, e poi quando viene lanciato l'evento "input", controllare se il testo che è appena stato inserito contiene dei valori che non accetti. In tal caso, reimpostare la casella di testo al valore precedente.

    Prova a vedere se questo risolve il problema. Se serve aiuto per tradurre questo ragionamento in codice fammi pure sapere
    Grazie per il benvenuto e per aver apprezzato il codice pronto al "RUN".
    Ho trovato molto interessanti le informazioni che mi hai dato e proverò a tradurre questo concetto in codice successivamente.
    Nell'immediato, nello specifico caso, sto cercando di ripiegare su altre strategie più immediate.
    Alla fine devo solo evitare che, in un sistema di immissione dati diretti verso un file CSV, un utente utilizzi un carattere scelto come separatore di campo.
    Ne parlerò nel post successivo per il piacere della convivialità digitale
  • S
    SERENAMENTE ADDUCO
    Pochi posts
    Iscritto da
    set, 2020
    Messaggi:
    7

    Re: Su ANDROID non viene rilevato event.key... SOLO SU ANDROID!

    ninja72 ha scritto:

    La documentazione indica beforeinput o keydown come possibili sostituti, penso più per keydown.

    Nella parte con if (!regex.test(key)) ci vorrebbe un OR che che abiliti il charCode del tasto delete.
    GRazie ma con "keydown" ho ottenuto lo stesso risultato. Funziona su tutto tranne che su Android e mi sembra anche logico adesso che ho le nuove info suggeritemi da andreadev.
    Nel prossimo post vi dico come penso di aggirare il problema nell'immediato. Approfondirò i vostri suggerimenti quando sarò un passettino più avanti
  • S
    SERENAMENTE ADDUCO
    Pochi posts
    Iscritto da
    set, 2020
    Messaggi:
    7

    Re: Su ANDROID non viene rilevato event.key... SOLO SU ANDROID!

    Nello specifico vorrei solo evitare l'uso di un carattere scelto come separatore per i campi di un file csv da parte dell'utente inseritore del dato.
    A questo punto però ho considerato che il filtro, per cui vi ho chiesto aiuto, limiterebbe la fantasia dell'utente mentre quello proposto da andreadev costringerebbe (se ho capito bene) l'utente a correggere il dato inserito finché non rispetta i limiti imposti dallo sviluppatore.

    Ho deciso pertanto di predisporre una serie di caratteri speciali e scegliere il separatore tra questi in funzione della nuova riga da inserire nel file.
    Cioé, confrontare la nuova riga con la stringa contenente i potenziali caratteri separatori e scegliere come separatore un carattere non utilizzato nella nuova riga da inserire.
    La riga registrata dovrebbe iniziare con il carattere separatore scelto in modo da avere subito il giusto rìferimento in fase di lettura.
    (Più facile a farsi che a spiegarlo!)
    Ci sarà da capire se funzionerà anche in caso d'uso di apostrofi, doppi apici etc.
    Al momento non voglio utilizzare database. Devo insistere col csv.
    Se interessa a qualcuno fatemelo sapere. Sarà un piacere scriverne una versione dimostrativa per uno scambio di strategie operative
  • andreadev
    andreadev
    Utente Attivo
    Iscritto da
    ago, 2020
    Messaggi:
    94

    Re: Su ANDROID non viene rilevato event.key... SOLO SU ANDROID!

    Bene, sono contento che hai un'idea su come risolvere il problema
    Avendo spiegato meglio cosa intendi fare, sembra esserci una soluzione abbastanza semplice:
    Nei file csv, se inserisci il valore del campo fra virgolette ("valore") puoi utilizzare anche il separatore di campo al suo interno.
    Poi, se l'utente usa le virgolette nei dati che inserisce, bisogna solo raddoppiarle, per assicurarsi di non avere problemi.

    Un codice come questo dovrebbe farti l'escape corretto: 
    
let input = `stringa inserita dall'utente, che contiene anche la "virgola"`;

CSVReady = `"${ input.replace(/\"/g, `""`) }"`;

console.log(CSVReady);
    (Se non hai mai visto la sintassi col dollaro e le parentesi graffe, quella è una stringa template))

    Così potrai utilizzare l'input dall'utente senza preoccuparti di cosa contenga
    A prescindere da cosa poi deciderai di usare, ho pensato di scrivertelo lo stesso, almeno avevi anche altre opzioni
  • S
    SERENAMENTE ADDUCO
    Pochi posts
    Iscritto da
    set, 2020
    Messaggi:
    7

    Re: Su ANDROID non viene rilevato event.key... SOLO SU ANDROID!

    andreadev ha scritto:

    [...]

    Un codice come questo dovrebbe farti l'escape corretto: 
    
let input = `stringa inserita dall'utente, che contiene anche la "virgola"`;

CSVReady = `"${ input.replace(/\"/g, `""`) }"`;

console.log(CSVReady);
    (Se non hai mai visto la sintassi col dollaro e le parentesi graffe, quella è una stringa template))

    Così potrai utilizzare l'input dall'utente senza preoccuparti di cosa contenga
    A prescindere da cosa poi deciderai di usare, ho pensato di scrivertelo lo stesso, almeno avevi anche altre opzioni
    Ho risolto a modo mio ma mi piacerebbe ottenere lo stesso risultato partendo dal tuo suggerimento (non sono riuscito a venirne a capo!).
    Se ti va di proseguire in questo confronto, ho predisposto tutto qui:
    https://www.w3schools.com/code/tryit.asp?filename=GJ0DCQWR42EQ

    Naturalmente ormai è solo da capire qual'è il miglior compromesso tra leggibilità (comprensibilità) del codice e consumi di energia.

    Il nuovo sistema lascia l'utente libero di scrivere quello che cavolo gli pare e piace senza preoccuparsi di nulla e senza ricevere fastidiosi avvisi in rosso su eventuali limiti dell'input da rispettare!
    Il separatore per la sequenza csv viene scelto tra i disponibili non usati nell'input.
    Naturalmente la quantità di separatori disponibili deve essere almeno uno in più rispetto alla lunghezza dell'input permesso (non si sa mai dovessimo trovare l'utente più pazzerello di questo mondo!).
  • andreadev
    andreadev
    Utente Attivo
    Iscritto da
    ago, 2020
    Messaggi:
    94

    Re: Su ANDROID non viene rilevato event.key... SOLO SU ANDROID!

    Nell'esempio che hai impostato c'è già il codice funzionante, ma ho ripreso la mia idea in questo fiddle per evidenziare il punto.

    Nel codice che hai mostrato dici che il risultato è leggermente diverso, ma quella differenza non influenza i dati. Per un csv le due stringhe che riporto di seguito hanno lo stesso identico significato: 
    
Dato fittizio 1,prova,dato fittizio 2

Dato fittizio 1,"prova",dato fittizio 2
    Solo che se usi le virgolette per racchiudere i dati, puoi inserire al suo interno anche il separatore di colonna: 
    
// La stringa...

Dato fittizio 1,"prova di testo, con il separatore",Dato fittizio 2

// Da come risultato:

| Dato fittizio 1 | prova di testo, con il separatore | Dato fittizio 2 |
    In questo modo non devi preoccuparti di sostituire il separatore con uno che non è incluso nel testo, così l'utente può inserire qualsiasi carattere voglia.

    Questo è solo per mostrare in che modo si possono inserire caratteri "speciali" dentro ai dati in un file CSV. Se per il tuo utilizzo va bene il codice che hai preparato, puoi sempre usare quello
  • S
    SERENAMENTE ADDUCO
    Pochi posts
    Iscritto da
    set, 2020
    Messaggi:
    7

    Re: Su ANDROID non viene rilevato event.key... SOLO SU ANDROID!

    andreadev ha scritto:

    Nell'esempio che hai impostato c'è già il codice funzionante, ma ho ripreso la mia idea in questo fiddle per evidenziare il punto.

    [...]
    In questo modo non devi preoccuparti di sostituire il separatore con uno che non è incluso nel testo, così l'utente può inserire qualsiasi carattere voglia.

    Questo è solo per mostrare in che modo si possono inserire caratteri "speciali" dentro ai dati in un file CSV.
    [...]
    E' quasi perfetto, ma la rappresentazione su schermo dev'essere perfettamente identica a come il dato viene inserito tramite l'input.

    se ad esempio il dato inserito è questo: 
    C!i@a^o/u,"s"\n'.e'°r
    Quando lo ripesco e lo visualizzo a video devo tornare a vederlo com'era, cioé:
    C!i@a^o/u,"s"\n'.e'°r
    Mentre nel tuo fiddle appare così: 
    C!i@a^o/u,""s""\n'.e'°r
    L'utente non dovrà vedere alcuna differenza tra il dato come lo ha inserito lui e come poi gli apparirà da qualche altra parte nella pagina.

    Non so se e come sarebbe possibile completare il tuo suggerimento per ottenere quanto atteso dall'utente...
    Ci sto sbattendo la testa ma niente!
  • andreadev
    andreadev
    Utente Attivo
    Iscritto da
    ago, 2020
    Messaggi:
    94

    Re: Su ANDROID non viene rilevato event.key... SOLO SU ANDROID!

    Nel mio fiddle viene visualizzato in quel modo perché il CSV richiede l'escape delle virgolette. Prova a prendere la stringa che viene visualizzata nel mio fiddle e a salvarla come file CSV (puoi usare notepad per questo). Una volta aperto, noterai che le doppie virgolette vengono sostituite con virgolette singole in automatico
  • S
    SERENAMENTE ADDUCO
    Pochi posts
    Iscritto da
    set, 2020
    Messaggi:
    7

    Re: Su ANDROID non viene rilevato event.key... SOLO SU ANDROID!

    andreadev ha scritto:

    Nel mio fiddle viene visualizzato in quel modo perché il CSV richiede l'escape delle virgolette. Prova a prendere la stringa che viene visualizzata nel mio fiddle e a salvarla come file CSV (puoi usare notepad per questo). Una volta aperto, noterai che le doppie virgolette vengono sostituite con virgolette singole in automatico
    Adesso è tutto chiaro. Grazie.
    Credo di dover studiare seriamente le espressioni regolari. Sono potentissime!

    A riscriverci presto
  • andreadev
    andreadev
    Utente Attivo
    Iscritto da
    ago, 2020
    Messaggi:
    94

    Re: Su ANDROID non viene rilevato event.key... SOLO SU ANDROID!

    Sì, in effetti possono tornare davvero utili! In questa circostanza si sarebbe anche potuta evitare l'espressione regolare se solo ci fosse una funzione "replaceAll"... E in effetti c'è! Purtroppo è un po' troppo recente per poterla usare in produzione

    A presto
Devi accedere o registrarti per scrivere nel forum
12 risposte