与select标记一起使用时，SQL查询不起作用

Question

Before I Used The select tag the code was working perfectly...but now it isn't....

Is there anything special about select tag that has to be handled separately....?

I know the code is too long to read...but i can assure that the code worked perfectly when the select was replaced by an input type="text"

Note : The page slides down to the results section after i click the link, but appends nothing to the html page....

Here is the Form's Code :

<form name="queryForm" id="outputform">
<input id="date2" type="date" class="text" name="date2" value="2014-07-30" />
<select form="outputform" name="mode2">
                        <option value="">Select Travel Mode</option>
                        <option value="Train">Train</option>
                        <option value="Flight">Flight</option>
</select>
<input id="time2" type="time" class="text" name="time2" value="12:00:00" />
<input id="tfno2" type="text" class="text" name="tfno2" placeholder="Train/Flight Number" />

<a href="#results" class="button form scrolly" onclick='ajaxFunction2()'>Query It</a>
</form>

Here's The Ajax Function :

function ajaxFunction2() {
    var ajaxRequest;  // The variable that makes Ajax possible!

    try {
        // Opera 8.0+, Firefox, Safari
        ajaxRequest = new XMLHttpRequest();
    } catch (e) {
        // Internet Explorer Browsers
        try {
            ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {
                // Something went wrong
                alert("Your browser broke!");
                return false;
            }
        }
    }
    // Create a function that will receive data 
    // sent from the server and will update
    // div section in the same page.
    ajaxRequest.onreadystatechange = function () {
        if (ajaxRequest.readyState == 4) {
            var ajaxDisplay = document.getElementById('results');
            ajaxDisplay.innerHTML = ajaxRequest.responseText;
        }
    }
    // Now get the value from user and pass it to
    // server script.
    var date = document.getElementById('date2').value;
    var mode = document.getElementById('mode2').value;
    var time = document.getElementById('time2').value;
    var tfno = document.getElementById('tfno2').value;
    if (date == "" || date == null || date == '') {

        alert("Not Sure When You Are Going..?? 
 Search Later....!! ");

        exit();
    }
    var queryString = "?date=" + date;
    queryString += "&mode=" + mode + "&time=" + time + "&tfno=" + tfno;
    ajaxRequest.open("GET", "insert2.php" +queryString, true);
    ajaxRequest.send(null);
}

Here's The PHP Code :

    <?php
    $dbhost = "localhost";
    $dbuser = "root";
    $dbpass = "plsdonthack";
    $dbname = "cab";
        //Connect to MySQL Server
    mysql_connect($dbhost, $dbuser, $dbpass);
        //Select Database
    mysql_select_db($dbname) or die(mysql_error());
        // Retrieve data from Query String
    $date = $_GET['date'];
    $time = $_GET['time'];
    $mode = $_GET['mode'];
    $tfno = $_GET['tfno'];

        // Escape User Input to help prevent SQL Injection
    $date = mysql_real_escape_string($date);
    $time = mysql_real_escape_string($time);
    $mode = mysql_real_escape_string($mode);
    $tfno = mysql_real_escape_string($tfno);
        //build query
    $query = "SELECT * FROM cabs WHERE DATE='$date' ";
    if ($mode!=='' || $mode!=="")
          $query .="AND MODE='$mode' ";

    if ($tfno!=='')
          $query .="AND TFNO='$tfno' ";

    $qry_result = mysql_query($query) or die(mysql_error());

        //Build Result String
    $display_string = "<article class='container box style3'><section><header><h3><u><b>Here Are The    Results...!!</u></b></h3></header><div class='table-

wrapper'><table     class='default'><thead><tr><th>ID</th><th>Name</th><th>Description</th><th>Contact  No.</th></tr></thead><tbody>";

    // Insert a new row in the table for each person returned
    while($row = mysql_fetch_array($qry_result)){
    $display_string .="<tr><td>" . $row[IDNO] . "</td><td>" . $row[NAME] . "</td><td><ul><li> Date : " . $row[DATE] . "</li><li> Time : " . $row[TIME] . "</li><li> 

Train/Flight No. " . $row[TFNO] .   "</li></ul></td><td>" . $row[CONTACT] . "</td></tr>";

    }
    $display_string .= "</table>";
    echo $display_string;
    ?>

Answer 1

var mode = document.getElementById('mode2').value;

You don't have id on your select so your javascript get no value for mode

<select id="mode2" name="mode2">