0

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

<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>

当用户点击他们的 Country 时,DIV 会转换为具有自动完成功能的输入框并向数据库发起 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);

上面的代码在一定程度上有效。我能够让国家文本框正确查询数据库并执行自动完成方法,但是结果不会像我想要的那样用省份填充下拉列表!提前致谢

4

1 回答 1

1

您的查询没有被清理!!!!!!!!!!!!!!!!!!,两者都没有被正确连接,你可以更简单地做到这一点:

$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',. 表示 'class')

于 2013-01-23T18:50:51.040 回答