javascriptphpgetelementbyid

Uncaught TypeError: Cannot read property 'options' of null - some of the code work


I want to read the user's choice by the function:

var e = document.getElementById("Trip_Type");
var Trip_Type = e.options[e.selectedIndex].value;
var i = document.getElementById("Trip_Population");
var Trip_Population= i.options[i.selectedIndex].value;
var j = document.getElementById("Trip_Duration");
var Trip_Duration= j.options[j.selectedIndex].value;

The option Trip_Population and Trip_type is varchar and chosen from a drop down list:

<select id = "Trip_Population" style="width: 120px">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>

The Trip_Duration is float and chosen from free text input:

<input name="Trip_Duration" style="width: 117px" type="text"></strong></td>

After submitting the information I want a pop-up window with transferring information to the next page:

var myWindow = window.open("Tripdet.php?Trip_Type="+Trip_Type+"&Trip_Population="+Trip_Population+"&Trip_Duration="+Trip_Duration, "", "width=400, height=200");

The pop-up is not showing up and I receive an error on the console on the Trip_Duration (if I remove it from the code it's working):

Uncaught TypeError: Cannot read property 'options' of null


Solution

  • input tag does not have options. Just retrieve the value:

    var Trip_Duration= j.value;
    

    and as Phil pointed out, input is missing id

    <input id="Trip_Duration" name="Trip_Duration" style="width: 117px" type="text">