Value is undefined

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Mark Coenie

Mark Coenie

20/05/2019 12:02:04
Quote Anchor link
Hi allemaal,

Ik probeer de value te krijgen van een eerder gegenereerd input element.
Echter krijg ik continu 'undefined' retour.
Ik gebruik de volgende code:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
function myFirstFunction(){
    x = [];
    getal = document.getElementById('input-element-met-getal');
    getal = getal.value;
    getal = parseInt(getal);
    for(i=0; i<getal; i++){
        x[i] = '<input type="text" class="item" value="waarde '+[i]+'">';
    }
    document.getElementById('element').innerHTML = x.join('');
    mySecondFunction();
}
mySecondFunction(){
    y = [];
    item = document.querySelectorAll('.item');
    for(i=0; i<item.length; i++){
        itemValue = item[i].value;
        y[i] = '<div>'+itemValue +'</div>';
    }
    document.getElementById('another-element').innerHTML = y.join('');
}

Wat gaat hier fout?
Of is het niet mogelijk op deze manier de value te achterhalen?
Gewijzigd op 20/05/2019 12:05:27 door Mark Coenie
 
PHP hulp

PHP hulp

18/06/2019 23:56:41
 
Thomas van den Heuvel

Thomas van den Heuvel

20/05/2019 16:10:43
Quote Anchor link
Een compleet voorbeeld zou ook fijn zijn...

- mySecondFunction() mist het keyword function
- in principe hoeven er geen [rechte haken] om [i] te staan

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<!-- https://www.phphulp.nl/php/forum/topic/value-is-undefined/102935 -->
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>

<body>
<input type="text" id="input-element-met-getal"> input-element-met-getal <button type="button" onclick="myFirstFunction();">go</button><br>
<br>
<div id="element" style="background-color: #ccffcc; padding: 10px;"></div>
<br>
<div id="another-element" style="background-color: #ffcccc; padding: 10px;"></div>
<script type="text/javascript">
//<![CDATA[
function myFirstFunction(){
    x = [];
    getal = document.getElementById('input-element-met-getal');
    getal = getal.value;
    getal = parseInt(getal);
    for(i=0; i<getal; i++){
        x[i] = '<input type="text" class="item" value="waarde '+i+'">';
    }
    document.getElementById('element').innerHTML = x.join('');
    mySecondFunction();
}
function mySecondFunction(){
    y = [];
    item = document.querySelectorAll('.item');
    for(i=0; i<item.length; i++){
        itemValue = item[i].value;
        y[i] = '<div>'+itemValue +'</div>';
    }
    document.getElementById('another-element').innerHTML = y.join('');
}
//]]>
</script>
</body>
</html>
Gewijzigd op 20/05/2019 16:11:25 door Thomas van den Heuvel
 
Mark Coenie

Mark Coenie

20/05/2019 20:28:13
Quote Anchor link
Bedankt voor je reactie Thomas,
Ik wilde geen overbodige code plaatsen om het overzichtelijk te houden.
vandaar dat het niet compleet was.

Ik heb de blokhaakjes weggehaald. Het is toch jammer dat ik zulke foutjes over het hoofd blijf zien.
Echter blijft mijn eigen script 'undifined' retourneren.
Daarom heb ik hieronder toch maar de code klakkeloos gekopieerd uit mijn editor.
Ik zal wel weer iets over het hoofd zien.
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
<!-- https://www.phphulp.nl/php/forum/topic/value-is-undefined/102935 -->
<!DOCTYPE html>
<html>
<head>
<style>
    h3{
        margin: 5px;
        font-size: 16px;
    }
    .edit-item{
        float: left;
    }
    #count-bar{
        clear: both;
    }
</style>
<title></title>
</head>

<body>
<div id="edit-catcher"></div>
<div id="count-bar">
    <h3>number of items</h3>
    <button class="count-button" onclick=itemCounter(-1)>&ndash;</button>
    <button class="count-button" onclick=itemCounter(1)>&plus;</button>
    <input type="text" id="item-counter" value="5" readonly>
    <div id="item-wrap"></div>
</div>
<script type="text/javascript">
//<![CDATA[
function itemCounter(n){
    count = document.getElementById('item-counter').value;
    count = parseInt(count);
    if(count == 1 && n == -1){
        document.getElementById('item-counter').value = 1;
        count = count;
        alert('1 is the minimum!')
    }
    else if(count == 10 && n == 1){
        document.getElementById('item-counter').value = 10;
        count = count;
        alert('10 is max!')
    }
    else{
        document.getElementById('item-counter').value = count + n;
        count = count + n;
    }
    editSpace  = [];
    for(i=0; i<count; i++){
        y = i + 1;
        editSpace[i] =
            '<div class="edit-item">\n'+
            '    <h3>name</h3>\n'+
            '    <input type="text" class="item-name" value="item '+y+'">\n'+
            '    <h3>url</h3>\n'+
            '    <input type="text" class="item-url" value="#">\n'+
            '    <h3>sub menu</h3>\n'+
            '    <input type="checkbox" id="sub-'+y+'">\n'+
            '</div>';
    }
    document.getElementById('edit-catcher').innerHTML = editSpace.join('');
    editButtons();
}
function editButtons(){
    count = document.getElementById('item-counter').value;
    count = parseInt(count);
    editButton = [];
    name = document.querySelectorAll('.item-name');
    for(i=0; i<count; i++){
        nameV = name[i].value;
        editButton[i] = '<div class="edit-button">'+nameV+'</div>';
    }
    document.getElementById('item-wrap').innerHTML = editButton.join('');
    
    check = document.querySelectorAll('.menu-item-content')[0];
    check.style.maxHeight = check.scrollHeight+'px';
}
//]]>
</script>
</body>
</html>



Toevoeging op 20/05/2019 20:46:11:

Ik heb het ineens gevonden!
Ik heb een variabele naam 'name' gebruikt en dat is een gereserveerde naam in javascript.
Zo leer ik toch weer van mijn eigen foutjes.
Gewijzigd op 20/05/2019 20:39:39 door Mark Coenie
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.