0

オートコンプリート検索バーのコードの何が問題になっているのか理解できないようです。

私が考えることができる唯一のことは、私がURLの下で間違ったものを参照したということです

aspx Javascript

    $(document).ready(function() {
        SearchText();
    });
    function SearchText() {
        $(".ui-autocomplete").autocomplete({
            source: function(request, response) {
                $.ajax({
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    url: "Admin_home.aspx/GetAutoCompleteData",
                    data: "{'Car':'" + document.getElementById('query').value + "'}",
                    dataType: "json",
                    success: function(data) {
                        response(data.d);
                    },
                    Error: function(results) {
                        alert("Error");
                    }
                });
            }
        });
    }

</script>`

aspxhtmlコード

ここにhtmlを入力または貼り付けることができないようです。単なる
asp:Textbox ID = "query" class = "ui.autocomplete"

c#コード

    [WebMethod]
    public static List<string> GetAutoCompleteData(string Car)
    {
        List<string> result = new List<string>();
        using (SqlConnection con = new SqlConnection(System.Configuration.ConfigurationManager.ConnectionStrings["CarsConnectionString"].ConnectionString))
        {
            using (SqlCommand cmd = new SqlCommand("select DISTINCT Car from T_Car where Car like '%'+ @SearchText +'%", con))
            {
                con.Open();
                cmd.Parameters.AddWithValue("@SearchText", Car);
                SqlDataReader dr = cmd.ExecuteReader();
                while (dr.Read())
                {
                    result.Add(dr["Car"].ToString());
                }
                return result;
            }
        }
    }

HTMLの一部をAJAX更新パネルでラップする必要がありますか?

また、SQLServer2005から検索プル名を取得しています。

4

2 に答える 2

2

これは、jQueryオートコンプリートが機能する方法ではありません。

jQueryオートコンプリートは、テキストボックスに入力されたテキストを、このようなwebmethodまたはハンドラーでアクセスするクエリ文字列「term」で指定した場所に自動的に送信します。

         string input = HttpContext.Current.Request.QueryString["term"];

このようなもの

              [WebMethod]
public static List<string> GetAutoCompleteData(string Car)
{
    string input = HttpContext.Current.Request.QueryString["term"];
    List<string> result = new List<string>();
    using (SqlConnection con = new SqlConnection(System.Configuration.ConfigurationManager.ConnectionStrings["CarsConnectionString"].ConnectionString))
    {
        using (SqlCommand cmd = new SqlCommand("select DISTINCT Car from T_Car where Car like '%'+ @SearchText +'%", con))
        {
            con.Open();
            cmd.Parameters.AddWithValue("@SearchText", input);
            SqlDataReader dr = cmd.ExecuteReader();
            while (dr.Read())
            {
                result.Add(dr["Car"].ToString());
            }
            return result;
        }
    }
}

これは.aspxページに表示されます

    $(".ui-autocomplete").autocomplete({
        source: "Admin_home.aspx/GetAutoCompleteData",
        select: function (event, ui) { }
      });

編集:

私は実際にこれをWebメソッドで行ったことがなく、通常はハンドラー.ashxを使用しますが、これは同じように機能するはずです。

すべてを変更したら、サイトをデバッグモードで実行し、テキストボックスに入力を開始し、f12を入力して、これが引き起こしているトラフィックを監視します。「abc」と入力すると、次のようになります。

Admin_home.aspx / GetAutoCompleteData?term = abc

次に、少し遊んでいなければならないかもしれない応答。デフォルトでは、.netはクライアント側への応答に「d:....」を追加しますが、それを見て、それに応じて調整することができます。

別の編集:

         <asp:Textbox ID="query" class="ui.autocomplete">

jqueryに入力したものではありません

          $(".ui-autocomplete").autocomplete({

そのはず

         <asp:Textbox ID="query" class="ui-autocomplete">

しかし、別の編集:

これには一重引用符がありません

        using (SqlCommand cmd = new SqlCommand("select DISTINCT Car from T_Car where Car like '%'+ @SearchText +'%", con))

と置換する

         using (SqlCommand cmd = new SqlCommand("select DISTINCT Car from T_Car where Car like '%'+ @SearchText +'%' ", con))
于 2012-07-27T02:52:58.477 に答える
0

これを試してみてください多分それは役立つでしょう

<script type="text/javascript">
    $(function() {
        $(".ui-autocomplete").autocomplete({
            source: function(request, response) {
                $.ajax({
                    url: "Admin_home.aspx/GetAutoCompleteData",
                    data: "{ 'Car': '" + request.term + "' }",
                    dataType: "json",
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    dataFilter: function(data) { return data; },
                    success: function(data) {
                        response($.map(data.d, function(item) {
                            return {
                                value: item
                            }
                        }))
                    },
                    error: function(XMLHttpRequest, textStatus, errorThrown) {
                        alert(textStatus);
                    }
                });
            },
            minLength: 2
        });
    });
    </script>
于 2012-07-27T03:07:07.613 に答える