Php 基于文本输入字段,使用省填充下拉菜单

Php 基于文本输入字段,使用省填充下拉菜单,php,jquery,mysql,ajax,jquery-ui,Php,Jquery,Mysql,Ajax,Jquery Ui,我有一个简单的用户表,其中显示用户信息,例如他们当前的国家和省份 <td><b>Country</b></td> <td width="331"> <form method="post" action=""> <div id="countryList" style="vertical-align:top; display:inline-block; float:left;

我有一个简单的用户表,其中显示用户信息,例如他们当前的国家和省份

<td><b>Country</b></td>
        <td width="331">
        <form method="post" action="">
        <div id="countryList" style="vertical-align:top; display:inline-block; float:left;"><?=$country?></div>
        <input type="submit" name="submitCountry" id="submitCountry" class="ui-icon ui-icon-disk" style="border:none; display:none; background-color:transparent; float:right; vertical-align:top;" />  
        </td>
        <td width="336">&nbsp;</td>
      </tr>
      <tr>
        <td><b>Province</b></td>
        <td>
        <div id="provinceList" style="vertical-align:top; display:inline-block; float:left;"><?=$province?></div>
        </form>
      </td>
当用户单击他们的国家时,DIV将转换为带有autocomplete的输入框,并向数据库发出AJAX请求。这允许用户输入一个国家,它将显示在列表中

jQuery代码:

$("#countryList").click(function(){

            $("#submitCountry").css("display", "inline");

            //check if there are any existing input elements
            if ($(this).children("input").length == 0){


                //variable that contains input HTML to replace
                var inputbox = "<input type='text' id='countryList' class='inputbox' name='country' value=\""+$(this).text()+"\">";    
                //insert the HTML intp the div
                $(this).html(inputbox);         

                //automatically give focus to the input box     
                $(".inputbox").focus();

                //maintain the input when it changes back to a div
                $(".inputbox").blur(function(){
                    $("#submitCountry").css("display", "none");

                    var value = $(this).val();
                    $("#country").val(value);
                    $("#countryList").text(value);

                });
            }  


            //Once input box is displayed assign it the autocomplete method
            $("input#countryList").autocomplete ({
                //set a few options, and select source data
                minLength : 2,
                source : function (request, callback)
                {
                    //variable that will carry the request 'term' from url
                    var data = { term : request.term };

                    //ajax method to call pho script
                    $.ajax ({
                        url : "getCountry.php",
                        data : data,
                        complete : function (xhr, result)
                        {
                            //if returns empty, then exit out
                            if (result != "success") return;

                            //otherwise get response and fill country array
                            var response = xhr.responseText;
                            var country = [];
                            //filter each li item
                            $(response).filter ("li").each (function ()
                            {
                            //display li item inline
                            country.push ($(this).text ());
                            });
                            //display country list
                            callback (country);
                        }

                    });
                }

            });   
if ($("#provinceList").children("input").length == 0){

                var selectbox = "<select id='selectProv' name='selectProv'></select> ";

                $("#provinceList").html(selectbox);

                var datastring = { term : request.term };
                $.ajax({
                    url: "getProvince.php",
                    data: datastring, 
                    success: function(html){
                        $(".selectProv").html(html);
                    }
                })
            }
getCountry.php文件如下所示。是的,我知道,我需要保护自己不受SQL注入的影响。目前,我在我的课程中还没有走那么远,我是一名学生

这里是getCountry.php

 <?php

$term = $_REQUEST["term"];
$term = utf8_decode ($term);
$dbUser = "admin";
$dbPass = "pass";
$dbName = "testdb";
$bd = mysql_connect ("localhost", $dbUser, $dbPass);
$ret = mysql_select_db ($dbName, $bd);
$query = sprintf ("SELECT * FROM Country WHERE Name LIKE '%%" . $term . "%%'", mysql_real_escape_string($term));

//send query string to DB
$result = mysql_query($query);

//if result returns a value
if ($result != NULL){

    // Use the result (sent to the browser)
    while ($row = mysql_fetch_assoc($result)){

        echo ("<li>" . utf8_encode ($row["Name"]) . " (" . utf8_encode ($row["Code"]) . ")</li>");

    }

    mysql_free_result($result);
}

mysql_close ($bd);

?>
getProvince.php 此代码将用于查询数据库并生成下拉菜单。我知道这段代码是有效的,因为我可以导航到它,并向它传递一个字符串,它将生成我需要的下拉列表。问题是它在整个应用程序中不起作用

    <?php

$term = $_REQUEST["term"];
$term = utf8_decode ($term);
$dbUser = "admin";
$dbPass = "pass";
$dbName = "testdb";
$bd = mysql_connect ("localhost", $dbUser, $dbPass);
$ret = mysql_select_db ($dbName, $bd);
$query = sprintf ("SELECT * FROM Country WHERE Name LIKE '%%" . $term . "%%'", mysql_real_escape_string($term));

//send query string to DB
$result = mysql_query($query);

//if result returns a value
if ($result != NULL){

    $row = mysql_fetch_assoc($result);
    $code = $row['Code'];

    $sql = "SELECT DISTINCT District FROM City WHERE CountryCode='$code'";

    $result = mysql_query($sql);

    ?>
    <option>Select State/Province</option>
    <?php while($row=mysql_fetch_array($result)){

        echo "<option value=" . $row['District'] . ">" . $row['District'] . "</option>";
    }

    mysql_free_result($result);
}

mysql_close ($bd);
上述代码在一定程度上起作用。我能够让国家文本框正确查询数据库并执行自动完成方法,但是结果不会像我希望的那样在下拉列表中填充省份!提前感谢

您的查询未被清理!!!!!!!!!!!!!!!!!,两者都没有正确连接,您可以更简单地执行此操作:

$query = "SELECT * FROM Country WHERE Name LIKE '%" . mysql_real_escape_string($term) . "%'";
请始终清理您的输入,这甚至比拥有一个工作脚本更重要,因为您正在冒着数据库完整性的风险

这一行也应该被清理,连接的值来自数据库并不重要

$sql = "SELECT DISTINCT District FROM City WHERE CountryCode='" . mysql_real_escape_string($code) . "'";
以下行应为:

$.ajax({
                url: "getProvince.php",
                data: datastring, 
                success: function(html){
                    $("#selectProv").html(html);
                }
            });

注:selectProv改为selectProv表示“id”。意思是“类”

谢谢你,但是这个问题必须更深入,因为它没有解决我的问题。很难说,我建议你使用Firefox的Firebug或Chrome的DeveloperTools菜单->工具->开发工具,在这里你可以检查DOM、调试Javascript以及检查服务器头和响应。