HTML表单输入依赖于以前使用javascript和php输入的表单，不起作用

Question

我一直在尝试使用html、Javascript、PHP和MYSQL在HTML表单中创建一些依赖于先前输入的选择输入。这对我之前的一个页面有效，所以当创建这个新页面时，我只是在javascript文件中定义了一个新函数，并创建了一个新的php文件来发送数据，因为我想为表单中的最后一个选择框输出一些不同的东西。

即使我镜像了之前的函数和php文件，只更改了几个小细节，但我看不到我为最后一次下拉选择创建的任何选项，而且我似乎没有得到任何错误，实际上一个没有错误的空白php页面正在通过，我不确定为什么会发生这种情况。

这是我的表格的屏幕截图，你可以看到'Rack Unit Location‘选项没有创建任何选项，并且是空白的，其他选择框都可以正常工作：

Form Screenshot

这是我的HTML表单的一部分，所以我希望Rack Unit Location取决于Rack Number，Rack Number取决于位置，而Rack又取决于Rack。

<tr>
    <th>Rack </th>  
    <script src='includes/Jquery/default.js'></script> <!-- Link to new Javascript file -->
    <td>    
        <select id='rack_name' name="rack_name" onchange="window.loadLocation()">
        <option disabled="disabled" selected="selected">Rack Name</option>
        <?php
            $r = mysqli_query($conn, "SHOW TABLES WHERE Tables_in_network Like 'rack%'"); 
            while($row=mysqli_fetch_assoc($r)){
                echo "<option value=".$row['Tables_in_network'].">".$row['Tables_in_network']."</option>";
            }
        ?>
        <option value="no_rack">Not in Rack</option>
        </select>
    </td>
</tr>
<tr>
    <th>Location</th>
    <td>
        <select id="location" name="location" onchange="window.selectrack()">
        <option disabled="disabled" selected="selected">Location</option>                           
        </select>
    </td>
</tr>
<tr>
    <th>Rack Number</th>
    <td>
        <select id="rackno" name="rackno" onchange="window.selectpduunit()">
        <option disabled="disabled" selected="selected">Rack Number</option>        
        </select>
    </td>
</tr>
<tr>
    <th>Rack Unit Location</th>

    <td>
        <select name="rackunit" id="rackunits">
        <option disabled="disabled" selected="selected">Rack Unit Number</option>
        </select>
    </td>
</tr>

这些onchange函数在以下Javascript文件中定义：

function loadLocation(){    
var formName = 'switch';
var rackname = document[formName]['rack_name'].value;

var xmlhttp = null;
if(typeof XMLHttpRequest != 'udefined'){
    xmlhttp = new XMLHttpRequest();
}else if(typeof ActiveXObject != 'undefined'){
    xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
}else{
    throw new Error('You browser doesn\'t support ajax');           
}
xmlhttp.open('GET', 'load_location.php?rack='+rackname, true);
xmlhttp.onreadystatechange = function (){
    if(xmlhttp.readyState == 4)
        window.insertLocation(xmlhttp);
};
xmlhttp.send(null);
}

function insertLocation(xhr){
    if(xhr.status == 200){
    document.getElementById('location').innerHTML = xhr.responseText;
    }else{
    throw new Error('Server has encountered an error\n'+'Error code = '+xhr.status);
    }
}

function selectrack(){    
    var formName = 'switch';
    var rackname = document[formName]['rack_name'].value;
    var location = document[formName]['location'].value; 
    var xmlhttp = null;
    if(typeof XMLHttpRequest != 'undefined'){
        xmlhttp = new XMLHttpRequest();
    }else if(typeof ActiveXObject != 'undefined'){
        xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
    }else {
        throw new Error('You browser doesn\'t support ajax');           
    }
    xmlhttp.open('GET', 'select_rack_number.php?location='+location+'& rack='+rackname, true);  
        xmlhttp.onreadystatechange = function (){
        if(xmlhttp.readyState == 4)
             window.insertrackno(xmlhttp);
     };
     xmlhttp.send(null);
 }

function insertrackno(xhr){
     if(xhr.status == 200){
        document.getElementById('rackno').innerHTML = xhr.responseText;
     }else{
        throw new Error('Server has encountered an error\n'+'Error code = '+xhr.status);
     }
 }

 function selectrackunit(){    
     var formName = 'switch';
     var rackname = document[formName]['rack_name'].value;
     var location = document[formName]['location'].value; 
     var rackno = document[formName]['rackno'].value; 
     var xmlhttp = null;
    if(typeof XMLHttpRequest != 'udefined'){
        xmlhttp = new XMLHttpRequest();
    }else if(typeof ActiveXObject != 'undefined'){
        xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
    }else{
    throw new Error('You browser doesn\'t support ajax');
    }
    xmlhttp.open('GET', 'select_rack_unit.php?location='+location+'&rack='+rackname+'&rackno='+rackno, true);   
        xmlhttp.onreadystatechange = function (){
        if(xmlhttp.readyState == 4)
            window.insertrackunit(xmlhttp);
     };
    xmlhttp.send(null);
 }

 function selectpduunit(){    
    var formName = 'switch';
    var rackname = document[formName]['rack_name'].value;
    var location = document[formName]['location'].value; 
    var rackno = document[formName]['rackno'].value; 
    var xmlhttp = null;
    if(typeof XMLHttpRequest != 'udefined'){
        xmlhttp = new XMLHttpRequest();
    }else if(typeof ActiveXObject != 'undefined'){
         xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
    }else{
         throw new Error('You browser doesn\'t support ajax');
    }
     xmlhttp.open('GET', 'select_pdu_unit.php?location='+location+'&rack='+rackname+'&rackno='+rackno, true);   
         xmlhttp.onreadystatechange = function (){
         if(xmlhttp.readyState == 4)
             window.insertpduunit(xmlhttp);
     };
     xmlhttp.send(null);
 }

function insertrackunit(xhr){
    if(xhr.status == 200){
        document.getElementById('rackunits').innerHTML = xhr.responseText;
    }else{
        throw new Error('Server has encountered an error\n'+'Error code = '+xhr.status);
    } 
}

function insertpduunit(xhr){
    if(xhr.status == 200){
        document.getElementById('rackunits').innerHTML = xhr.responseText;
     }else{
         throw new Error('Server has encountered an error\n'+'Error code = '+xhr.status);
     } 
 }

下面是php文件中的代码，它似乎不适用于selectpduunit函数：

<?php
require 'includes/opendb.php';  
if(isset($_GET['location']) && ($_GET['rack']) && ($_GET['rackno']) )
{      
    $b = $_GET['location'];
    $e = $_GET['rack'];
    $d = $_GET['rackno'];
    $first_unit='1';
    $explode=explode('-',$e);
    $last_unit=$explode[1];
    var_dump($b);       
    var_dump($e);       
    var_dump($d);
    var_dump($explode);

        while($first_unit<='4'){ //While Loop creates port columns in new table for each port on PDU.
            if('10' > $count){
                $column [] = '`PDU-0'.$first_unit.'`,'; //Storing port number as string in array."`port-0".$count."` varchar (255) NOT NULL";
            }else{
                $column [] = '`'.'PDU-'.$first_unit.'`'.',';
            }
            ++$first_unit;

        }
        $empty = '';
        foreach($column as $c){
            $empty = $empty.$c; 
        }
        //$empty = rtrim($empty2, ",");

    $select="SELECT $empty FROM `$e` WHERE location = '$b' AND `Rack-Number` = '$d'";       
     var_dump($select); // Outputs the above generated MySQL string
    if(!mysqli_query($conn,$select)){
        die("Error".mysqli_error($conn));
    }else{
        $r = mysqli_query($conn,$select);
    }
    $unit_1 = '1';
    while ('4' >= $unit_1){
        if($unit_1 <'10'){
            $column1[] ='PDU-'.'0'.$unit_1;
        } else{
            $column1[] ='PDU-'.$unit_1;
        }
        ++$unit_1;
    }
    //var_dump($column1); // Outputs the above generated strings. The string should be column names.

    $rackunit ='';
    while($row = mysqli_fetch_assoc($r))  {
        if($e == 'no_rack' || $e == 'vm_rack'){
            //$rackunit =$rackunit.'<option value="'.$row["Unit"].','."Unit".'">'.'('."Unit".')'.' '.$row["Unit"].'</option>';      
            echo "fail";
        }else{
            foreach($column1 as $c1){
            $rackunit =$rackunit.'<option value="'.$row["$c1"].','.$c1.'">'.'('.$c1.')'.' '.$row["$c1"].'</option>';            
            }
        }   
    } 
    var_dump($rackunit);
    if($rackunit == '')
        echo 'An Error has occurred. Dropdown Menu is not being populated.';
    else
        ?>      
            <select name="rackunit" id="rackunit">
                <option disabled="disabled" selected="selected">Rack Unit Number</option>
                <?php echo $rackunit ?> 
                <option value="1">Test</option>
            </select>
        <?php  

}   

?>

知道问题出在哪里吗？

Answer 1

您的代码中有一个打字错误。在方法中，selectpduunit以及selectrackunit

 if(typeof XMLHttpRequest != 'udefined'){

它应该是相反的

 if(typeof XMLHttpRequest != 'undefined'){

可能是因为您无法创建新的XMLHttpRequest对象。试试看。