Rimuovere testo iniziale di un campo con un click

[Annuitcoeptis]

Buongiorno, avrei uno script quasi funzionante, se non per un'azione. Da questa pagina (salvata, l'originale è protetta) eseguo con un'estensione per Chrome (Autofill o TamperMonkey) questo script, che estrae, nel campo "Nome", l'editore dalla notizia bibliografica sovrastante (Feltrinelli, nell'esempio). In vari casi ho l'esigenza di cancellare il valore autoestratto e lo script (righe 42-46), appunto, cancella questo valore iniziale al primo clic in qualsiesi area della pagina. Il problema è che, quando l'editore viene autoestratto e clicco sul pulsante "Ricerca", la pagina non va avanti e mi da questo avviso: "Inserisci almeno un parametro di ricerca", come se nel campo "Nome" non fosse scritto nulla. Ma se digito manualmente l'editore (o lo trascino dalla descrizione soprastante) la pagina viene inviata correttamente. Ho registrato questo video per una maggiore chiarezza. Grazie mille!

[KillerWorm]

Ciao, ho dato uno sguardo veloce alla pagina salvata e allo script ma ho l'impressione che senza vedere la pagina in azione, e quindi poter riprodurre il problema, è difficile comprendere quali possano essere le cause.

Bisognerebbe capire come avviene esattamente il sistema di controllo dei campi che permette di mandare avanti la ricerca quando viene cliccato il relativo pulsante.
Nella pagina salvata non vedo lo script che si occupa di questo.

Si possono fare solo ipotesi; inutile dirti che, questo metodo di procedere, lascia il tempo che trova.

Se ti è possibile, allestisci una pagina online in cui si possa verificare il problema. Cioè dove in qualche modo viene lanciato il tuo script e dove, in quel caso, cliccando su "Ricerca" viene appunto visualizzato l'errore menzionato.

Faccio giusto un tentativo alla cieca.
Prova a modificare la funzione impostaNome in questo modo:

function impostaNome(tmp) {
    const campo = document.getElementById("ds");
    campo.value = tmp;
    campo.focus();
}

Vedi se ci ho preso

[Annuitcoeptis]

Grazie, con la tua modifica lo script si comporta come se non vi fossero le righe 42-46 (a partire da const clearField), e quindi, correttamente, estrae il "Nome" e invia il modulo dopo aver cliccato sul pulsante "Ricerca", ma non permette di cancellare il valore nel campo "Nome" con un click su un area qualsiasi. Se non basta il video, potrei mandarti la pagina con il banner (questa, dove noterai che al click si cancella correttamente il valore "Feltrinelli" dal campo "Nome"), la pagina precedente (cliccando sul tasto + accanto a "Persone, enti e famiglie" si è rimandati alla pagina) e la pagina successiva che si aprirebbe al click sul pulsante "Ricerca". Non saprei come altro agevolarti...

P.S. Le pagine linkate hanno una scadenza breve, nel caso non si aprissero mando questi link di riserva.

[KillerWorm]

Andiamo per gradi

Ora che guardo meglio lo script e il video, il problema che descrivi mi pare una conseguenza logica di quelle azioni.

Una volta aperta la pagina, il campo viene riempito in automatico e si imposta l'evento click.

Cliccando quindi in un qualsiasi punto (quindi anche cliccando sul pulsante "Ricerca") viene rimosso il valore di quel campo; ma questo accade prima che la ricerca sia avviata; mi pare evidente che in quel preciso momento, dove avviene il controllo dei dati del form prima di eseguire la ricerca, non sia trovato alcun valore per quel campo (infatti è stato appena rimosso dal tuo click) e quindi sia segnalato l'errore.

Se invece inserisci manualmente il valore, avviene necessariamente un "primo click" o per selezionare il testo sulla pagina o per attivare il campo o per qualsiasi altro motivo; quindi il campo viene "pulito" prima che tu inserisca il valore. A quel punto quel dato non sarà più rimosso al click su "Ricerca".



La questione è: a che ti serve che venga rimosso il valore di quel campo al primo click?

In vari casi ho l'esigenza di cancellare il valore autoestratto

Non è molto chiaro quali siano questi casi, ovvero quale sia il motivo per cui hai bisogno di ripulire quel campo.

Posso intuire che tu voglia ripulirlo nel momento in cui vai a selezionare del testo nella pagina, così da "avere il campo libero".

Però, come tu stesso hai indicato, quel primo click è attivato per qualsiasi area della pagina; puoi capire da te che questo comprende anche il pulsante "Ricerca".

Se vuoi che il click sia attivato solo quando, ad esempio, intendi selezionare del testo nella descrizione, dovrai dirglielo specificatamente, magari impostando il click solo per quell'elemento in cui sta la descrizione.

Eventualmente fai qualche prova oppure cerca di chiarire meglio questo punto, indicandoci dove esattamente deve/può agire quel "primo click".

[Annuitcoeptis]

Partendo dalla pagina precedente e cliccando sul pulsante +, il primo passo che compio è l'estrazione AUTOMATICA dell'editore (Feltrinelli), che, se non modificassi lo script aggiungendo le righe finali 42-46, avverrebbe senza problemi nella pagina. Quindi ritorno alla pagina precedente e ripremo il tasto + per estrarre MANUALMENTE gli altri tre nomi (Leopardi Giacomo, Cacciapuoti Fabiana, Prete Antonio). In questo caso devo liberare il campo "Nome" con un click che cancelli l'editore riestratto (Feltrinelli).

Quindi, sì, in sostanza vorrei che il primo click agisse in qualsiasi punto della pagina eccetto che sul pulsante "Ricerca", oppure, come da te indicato, solo quando seleziono il testo nella scheda descrittiva.

[KillerWorm]

Ok, prova allora ad usare l'evento selectionchange al posto del click.

[Annuitcoeptis]

Intendi in questo modo?

const clearField = () => {
    document.getElementById("ds").value = "";
    window.removeEventListener("selectionchange", clearField);
};
window.addEventListener("selectionchange", clearField);

Così si autoestrae l'editore, ma il click sulla descrizione o altrove non cancella il valore nel campo "Nome".

[KillerWorm]

L'esempio, nella documentazione che ho linkato, applica quell'evento all'oggetto document; ho l'impressione che su window non funzioni. Prova ad aggiustare.

Comunque, sì, il campo NON viene pulito quando effettui il primo click, bensì quando selezioni qualcosa sulla pagina.

Anche se sei partito dall'idea di gestire la cosa attraverso il click, io penso sia meglio (da quel che hai indicato) gestirla invece attraverso l'evento di selezione del testo.

Tu non credi?

[Annuitcoeptis]

Sì, certo, sarebbe perfetto anche il metodo della selezione di una parte del testo. Tuttavia, provando con document:

const clearField = () => {
     document.getElementById("ds").value = "";
    document.removeEventListener("selectionchange", clearField);
};
document.addEventListener("selectionchange", clearField);

non si autoestrae l'editore nel campo "Nome", o, meglio, viene autocancellato in una frazione di secondo all'apertura della pagina.

[KillerWorm]

Tuttavia, provando con document:
...
viene autocancellato in una frazione di secondo all'apertura della pagina.

strano, può essere che l'evento selectionchange sia richiamato per qualche altro motivo all'apertura della pagina.


In tal caso prova a temporizzarlo con una cosa del genere:

const clearField = () => {
     document.getElementById("ds").value = "";
    document.removeEventListener("selectionchange", clearField);
};
setTimeout(()=>{document.addEventListener("selectionchange", clearField);}, 100)

oppure, tornando al tuo metodo click, potresti limitarne lesecuzione nel caso in cui sia invocato sul pulsante "Ricerca", con una cosa del genere:

const clearField = (e) => {
    const btnSearch = document.querySelector('button.search');
    if (btnSearch.contains(e.target)) return;
    document.getElementById("ds").value = "";
    window.removeEventListener("click", clearField);
};
window.addEventListener("click", clearField);

Se anche così non dovesse funzionare allora mi arrendo