Question

我正在尝试实施一个自动填充搜索框，根据在Javascript中选择的下拉列表项目更改其自动填充文本。但是，在使用if / else语句时，我无法使用此自动完成功能。我在下面发布了我的代码：

 <script type="text/javascript"> 
            $("#searchTypeDD").change(function DDChange() {
                var searchType = $('#searchTypeDD').val();
                var searchData = null;
                var searchMethodName = null;
                var searchTerm = $('#searchTermEntered').val();

                if (searchType == 'movieSearch') {
                    data = { name: searchTerm };
                    searchMethodName = "GetmovieTitle";
                }
                else {
                    data = { director: searchTerm };
                    searchMethodName = "Getdirector";
                }

                $("#searchTermEntered").autocomplete({
                    source: function (request, response) {
                        $.ajax({
                            url: "AutoCompleteService.asmx/" + searchMethodName,
                            dataType: "jsonp",
                            data: searchData,
                            success: function (data) {
                                response(data);
                            }
                        });
                    },
                    minLength: 2,
                    select: function (event, ui) {
                        log("Selected: " + ui.item.value + " aka " + ui.item.id);
                    }
                });
            });

Answer 1

如果您正在使用上述代码，则会出现拼写错误。您已$:ajax而不是$.ajax（见下文）

$(document).ready(function(){    
    $(".searchTermEntered").autocomplete({
      source: function(request, response) {
          var searchType = $('.searchTypeDD').val();
          var searchData = null;
          var searchMethodName = null;
          var searchTerm = $('.searchTermEntered').val();

          if (searchType == 'movieSearch') {
              searchData = { name: searchTerm };
              searchMethodName = "GetmovieTitle";
          }
          else {
              searchData = { director: searchTerm };
              searchMethodName = "Getdirector";
          }

          $.ajax({
              url: "AutoCompleteService.asmx/" + searchMethodName,
              dataType: "jsonp",
              data: searchData,
              success: function( data ) {
                  response( data );
              }
          });
      },
      minLength: 2,
      select: function(event, ui) {
        log( "Selected: " + ui.item.value + " aka " + ui.item.id );
      }
    });
});

更新：我的代码中有一个拼写错误。它已经更新，应该适合你。唯一需要注意的是，您使用的是.NET，当.NET呈现页面时，下拉列表的ID不会是searchTypeDD。 ASP.NET在控件ID的末尾附加了一堆行话，以确保它是唯一的，并提供其父控件是谁以及如此的映射。因此，我建议您为下拉控件执行此操作：

和您的输入相同：

然后，上面的代码将起作用，因为我们通过类名（$（。xxx）选择器）而不是ID（$（＃xxx）选择器）来选择控件。

if / else语句与使用Ajax的自动完成搜索框结合使用

1 个答案: