I get the error "Uncaught typeerror cannot read property of null (reading 'value')" I'm constantly looking for a solution and I don't know what's wrong in the code, Can you help me?
My code
function test(){
for(var i=0; i < 40; i++) {
var name1.value = document.getElementsByClassName('test1')[i];
var address1.value = document.getElementsByClassName('test2')[i];
if( name1.value == "test4"){
address1.value = "test5";
}
else if (name1.value == "test6"){
address1.value = "test7";
}
else if (name1.value == "test8"){
address1.value = "test9";
}
}
}< div class="form grup test1">
< labe for="power-full.names"> Names full</lable>
< input name="power-full.names" list="power-full.names" type="text"
class="form grup test1" onclick="test"(this)">
<datalist type"text" id="power-full.names">
<option value="test4">
<option value="test6">
<option value="test8">
</datalist>
</div>
< div class="form grup test2">
< labe for="power-full.adress"> Adress full</lable>
< input name="power-full.adress" list="power-full.adress" type="text"
class="form grup test2" onclick="test"(this)">
<datalist type"text" id="power-full.adress">
<option value="test5">
<option value="test7">
<option value="test9">
</datalist>
</div>You have forgotten to add the classes so document.getElementsByClassName('test1')[i] returns None. And javascript cannot read value property of None. To fix -
<option class="test1" value="test4">
first: maybe you should use onchange event to bound the input.test1.
second: change the value of input.test2
function test1(ele){
var address1 = document.getElementById('test2');
if( ele.value == "test4"){
address1.value = "test5";
} else if (ele.value == "test6"){
address1.value = "test7";
} else if (ele.value == "test8"){
address1.value = "test9";
}
}<div class="form grup test1">
<lable for="power-full.names"> Names full</lable>
<input name="power-full.names" list="power-full.names" type="text"
class="form grup test1" onchange="test1(this)">
<datalist type"text" id="power-full.names">
<option value="test4">
<option value="test6">
<option value="test8">
</datalist>
</div>
<div class="form grup test2">
<lable for="power-full.adress"> Adress full</lable>
<input id="test2" name="power-full.adress" list="power-full.adress" type="text"
class="form grup test2">
<datalist type"text" id="power-full.adress">
<option value="test5">
<option value="test7">
<option value="test9">
</datalist>
</div>