[Javascript] Scrittura su più campi contemporaneamente

Arawan Omacha

Nuovo Utente
2 Ott 2015
15
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.008
295
83
Un ID non può esistere su più di un "input" se vuoi devi usare una classe
 

Arawan Omacha

Nuovo Utente
2 Ott 2015
15
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
2.678
135
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.128
64
48
IT/SW
Semplice ed indolore.
Codice:
<template>
        <div v-for="item in max">
          <input type="text" v-model="inputs" />
        </div>
</template>
 

Arawan Omacha

Nuovo Utente
2 Ott 2015
15
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

Nuovo Utente
2 Ott 2015
15
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.128
64
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

Nuovo Utente
2 Ott 2015
15
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