Problema con getElementById

di
tonyven
il
3 risposte
T
tonyven
Utente Attivo
Iscritto da
giu, 2022
Messaggi:
84

Problema con getElementById

Ciao a tutti. Ho 10 caselle di testo da cui devo prendere i 10 valori corrispondenti da prendere. Questi valori vanno inseriti in un array. Per non scrivere 10 volte l'istruzione : const numPer=document.getElementById("num").value ho provato con un ciclo for. Leggendo le specifiche di getElementById leggevo che anche se ci sono diversi elementi HTML con lo stesso ID viene preso solo il primo. Come faccio allora a ciclare 10 textbox con id diverso. getElementById accetta come argomento ,se non sbaglio, solo stringhe.Ho provato con 
document.getElementById("num[i]").value
ma non funziona. Posto la porzione di codice che sto studiando: 

for(let a=0; a < 10; a++){
        const numPer=document.getElementById("num").value
        arrPer.push(numPer)
     arrRes +=arrPer[a] + " "
     vis1.innerHTML = arrRes

3 Risposte

  • ninja72
    ninja72
    Utente Attivo
    Iscritto da
    mag, 2020
    Messaggi:
    79

    Re: Problema con getElementById

    Nel file html crea solo un div con id="nums", poi tramite codice crei gli elementi a te necessari(i vari input), il riferimento di nums potrà essere iterato per prelevare i valori necessari.
    
<div id="nums"></div>
<input type="button" value="Elabora" onclick="getNums()"><br>


    
 const nums = document.getElementById('nums')
        let arr = [];

        (function makeNums() {
            for (let i = 1; i <= 10; i++) {
                const inputEl = document.createElement('input')
                inputEl.setAttribute('type', 'text')
                inputEl.setAttribute('size', 1)
                inputEl.setAttribute('id', `num${i}`)
                nums.appendChild(inputEl)

                if (i === 5) {
                    const inputEl = document.createElement('br')
                    nums.appendChild(inputEl)
                }
            }
        })()

        function getNums() {
            arr = []
            nums.childNodes.forEach(num => {
                ((typeof num.value !== 'undefined') && (num.value !== ''))
                    ? arr.push(num.value)
                    : null
            })
            console.log(arr)
        }
  • T
    tonyven
    Utente Attivo
    Iscritto da
    giu, 2022
    Messaggi:
    84

    Re: Problema con getElementById

    Grazie ninja72. Il tuo supporto è sempre fondamentale.Grazie. A quanto pare non basta studiare solo javascript ma anche il Dom e anche piuttosto bene. Caspita quante cose si possono fare.
    saluti
  • ninja72
    ninja72
    Utente Attivo
    Iscritto da
    mag, 2020
    Messaggi:
    79

    Re: Problema con getElementById

    Figurati, volevo solo fare un piccola retifica.

    Nella variabile che assegna la creazione dell'elemento "br" ho dimenticato di assegnare il nome appropriato.
    ps. Piccola svista che non nè compromette il funzionamento ma la leggibilità.

    dunque: 
    
const inputEl = document.createElement('br')
nums.appendChild(inputEl)
    potrebbe diventare: 
    
const brEl = document.createElement('br')
nums.appendChild(brEl)

    Ciao e buon coding
Devi accedere o registrarti per scrivere nel forum
3 risposte