[Javascript] Scrittura su più campi contemporaneamente

Arawan Omacha

Utente Attivo
2 Ott 2015
20
0
1
Buona sera,
Dovrei far apparire la stessa scrittura in più campi avente lo stesso nome ed id,
ho un campo <input name="campo" id="campo"> che si moltiplica tramite un foreach.
Vorrei poter realizzare che quando scrivo su uno di questi campi (foreach), automaticamente ciò che scrivo viene riportato su tutti gli altri campi
 

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.388
338
83
Un ID non può esistere su più di un "input" se vuoi devi usare una classe
 

Arawan Omacha

Utente Attivo
2 Ott 2015
20
0
1
Sto tentando di fare questo, ma non funziona...

Codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento senza titolo</title>
<script type="text/javascript">

function scrivi()
{

  document.getElementsByClassName("test").value = document.getElementsByClassName("test").value

}
</script>
</head>

<body>
<div style="height:100%;">
<input class="test" type="text" id="campo1" onchange="scrivi()" />
<input class="test" type="text" id="campo2" />
<input class="test" type="text" id="campo3" />
</div>
</body>
</html>
 

marino51

Utente Attivo
28 Feb 2013
3.016
174
63
Lombardia
prova così, poi completi tu come desideri
HTML:
function scrivi()
{
  var stringa = document.getElementById("campo1").value;
  // alert (stringa);
  document.getElementById("campo2").value = stringa;
}
 

macus_adi

Utente Attivo
5 Dic 2017
1.325
88
48
IT/SW
Semplice ed indolore.
Codice:
<template>
        <div v-for="item in max">
          <input type="text" v-model="inputs" />
        </div>
</template>
 

Arawan Omacha

Utente Attivo
2 Ott 2015
20
0
1
Si ma devi usare una libreria in più, come vue.js appunto, quando si può fare con del semplice javascript come specificato da @marino51

A proposito, ma che c'entra col PHP :D
Inizialmente stavo aprendo la discussione nella sezione java, però poi essendo che questi campi li ho all'interno del foreach del php pensavo che c'entrasse, visto che il campo contiene l'id, name, class sempre lo stesso
 

Arawan Omacha

Utente Attivo
2 Ott 2015
20
0
1
Guarda il secondo post, quello di @marino51
Già ho tentato con il suo suggerimento, ma non funziona, sinceramente non so più come fare
ho tentato sia all'interno del codice php che creando una singola pagina di test come la seguente:
ma senza alcun risultato, mi riposta i dati solo in un solo campo l'altro lo lascia vuoto

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>    VALORE CAMPI</title>
<script type="text/javascript">
function scrivi()
{
  var stringa = document.getElementById("campo1").value;
  // alert (stringa);
  document.getElementById("campo2").value = stringa;
}
</script>
</head>

<body>
<div style="height:100%;">
<input class="campo2"     id="campo1" onchange="scrivi()" />
<input class="campo2"    id="campo2"  />
<input class="campo2"    id="campo2"  />
</div>
</body>
</html>
 

macus_adi

Utente Attivo
5 Dic 2017
1.325
88
48
IT/SW
Prova con questo, banale e brutto js.....
Codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>    VALORE CAMPI</title>
<script type="text/javascript">
function scrivi()
{
  var stringa = document.getElementById("campo1").value;

    for(let i=0;i<document.getElementsByClassName("campo2").length;i++){
    document.getElementsByClassName("campo2").item(i).value=stringa;
    }
}
</script>
</head>
<body>
<div >
<input class="campo_"     id="campo1" onkeyup="scrivi()" />
<input class="campo2"    id="campo2"  />
<input class="campo2"    id="campo2"  />
</div>
</body>
</html>
 

Arawan Omacha

Utente Attivo
2 Ott 2015
20
0
1
Prova con questo, banale e brutto js.....
Codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>    VALORE CAMPI</title>
<script type="text/javascript">
function scrivi()
{
  var stringa = document.getElementById("campo1").value;

    for(let i=0;i<document.getElementsByClassName("campo2").length;i++){
    document.getElementsByClassName("campo2").item(i).value=stringa;
    }
}
</script>
</head>
<body>
<div >
<input class="campo_"     id="campo1" onkeyup="scrivi()" />
<input class="campo2"    id="campo2"  />
<input class="campo2"    id="campo2"  />
</div>
</body>
</html>
Questo banale e brutto js funziona a meraviglia, grazie @macus_adi
 

marino51

Utente Attivo
28 Feb 2013
3.016
174
63
Lombardia
Già ho tentato con il suo suggerimento, ma non funziona
ho rivisto questa discussione, per suggerirti dove c'é l'errore che potrebbe causarti problemi anche in futuro,

"id" dei campi html deve essere UNIVOCO,
nel codice presente nel tuo primo post hai dichiarato come "id" campo1, campo2 e campo3

nel codice presente nei post successivi ( compreso quello che funziona )
gli "id" sono diventati campo1, campo2 e campo2 ripetuto

l'utilizzo come "id" di campo2 ripetuto non fa funzionare tutte le operazioni javascript che agiscono sul' "id" ripetuto
 
Discussioni simili
Autore Titolo Forum Risposte Data
L [Javascript] input variabili di scrittura con canvas Javascript 2
M Inviare un file su un server remoto con JavaScript Javascript 0
T a href="javascript:;" Javascript 0
F Creare elementi html con javascript Javascript 2
A pulsante di update campo mysql con javascript Javascript 2
8 Javascript - PDF Form Javascript 0
B javascript per problemi con pdf e Safari Javascript 0
N informazione javascript Programmazione 0
I Eecuzione di javascript in ciclo foreach php. PHP 7
P javascript:document.forms Javascript 7
S Consiglio esercizio Javascript Javascript 2
MarcoGrazia Aggiungere o rimuovere classi in javascript Javascript 1
P Passaggio id php a javascript PHP 6
E lettura da un Database con Javascript jQuery 2
V TRIS in javascript Javascript 1
IClaude Funzione Javascript Javascript 8
Alex_70 Javascript date color Javascript 3
F Convertire JavaScript per la compatibilità nei browser obsoleti Javascript 0
I Passare dei parametri in javascript PHP 0
Shyson Meglio Javascript o HTML? Javascript 4
M Chiamare pagina php da javascript Javascript 8
M Errore JavaScript per php [objeto HTMLParagraphElement] PHP 0
D Javascript per il download dei dati Javascript 0
grgfede Problema javascript con aruba Javascript 1
webmachine [PHP] [JAVASCRIPT] Form strano in HTML PHP PHP 1
W Modificare il Type di un Input box in javascript ovunque si trovi Javascript 0
I javascript come caricare una pagina sopra quella corrente in automatico Javascript 2
L [Javascript] Problema salvataggio dati in db Javascript 1
max1974 [Javascript] Grafico chartjs con dati da J.ajax Javascript 3
G Quiz Javascript Javascript 4
F classic asp popolare combo box javascript Presentati al Forum 1
claudio_lorenzo [Javascript] aiuto su jquery per calcolo altezze dom Javascript 1
F [Javascript] comando innerHTML non funziona Javascript 5
alexice51 proggrammi per scrivere in javascript? Javascript 3
max1974 [Javascript] Accordion aria-exspanded Javascript 0
D [Javascript] salvare immagine canvas - paypal Javascript 0
O [Javascript] Conflitto Jquery: forse... Javascript 0
M [Javascript] Canvas js css Javascript 1
M Programmazione web HTML, CSS e JavaScript Offerte e Richieste di Lavoro e/o Collaborazione 6
G [Javascript] Errore inserimento dati Backend Node.js e workbench Javascript 1
A Creare con Javascript un percorso all'interno di uno spazio Javascript 0
D [Javascript] inserire uno script in un file php Javascript 6
Monital [Javascript] inserire dati estratti dal db in html fisso Javascript 1
K [javascript] Tecnica per rilevare celle contenenti caratteri ricevute in dinamico Javascript 1
F [JavaScript] Ottenere il CSS dopo transform: scale() e transform-origin Javascript 0
S [Javascript] Problema costrutto if Javascript 0
I [Javascript] window.location.href porta alla nuova pagina e ritorna incomprensibilmente. Javascript 0
G [Javascript] Passare un valore via querystring Javascript 1
max1974 [Javascript] Funzione Errata procedura Javascript 2
R [Javascript]gratta e vinci Javascript 2

Discussioni simili