jquery-ui自动完成位置

我正在使用jquery-ui自动完成从SQL数据库检索项目工作正常，但我想将自动完成列表移动到页面的另一部分。jquery-ui自动完成位置

我一直在尝试使用here中的位置选项，但在应用于我的代码时似乎无法获得正确的语法？

<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.8.0.js"></script> 
<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.23/jquery-ui.js"></script> 
<script type="text/javascript"> 
    $(function() { 
     $("#txtCity").autocomplete({ 
      source: function (request, response) { 
       var param = { cityName: $('#txtCity').val() }; 
       $.ajax({ 
        url: "test.aspx/GetCities", 
        data: JSON.stringify(param), 
        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); 
        } 
       }); 
      }, 
      select: function (event, ui) { 
       event.preventDefault(); 
       minLength: 2//minLength as 2, it means when ever user enter 2 character in TextBox the AutoComplete method will fire and get its source data. 
      } 


     }); 
    }); 

    </script>

来源

2014-12-01 prwilliams1982

你能分享您在使用'position'选项尝试？ – 2014-12-01 17:48:29

*“将自动完成列表移动到页面的另一部分”* - 是一个非常模糊的问题描述。请描述你想要做什么，什么不工作，并提供失败的尝试，以便我们可以找到你遇到的问题或更好的解决方案 – 2014-12-01 17:55:54

我想将自动填充框移到文本框的右侧。

经过一个晚上的睡眠，我今天早上第一次尝试再次正常工作，认为我原本只在昨天的一次尝试中错过了一个逗号。

我刚刚使用数组而不是ajax调用将其剥离回基本实现，然后将工作语法应用于我的代码。

浪费太多的时间在这个昨天FAR太多了，只是表明退后一步，离开屏幕的时间有助于解决问题！

感谢您的帮助

工作代码备案：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="test.aspx.cs" Inherits="_Default" %> 
<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<title>JQuery AutoComplete TextBox Demo</title> 
<link rel="Stylesheet" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.10/themes/redmond/jquery-ui.css" /> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div><h1>AutoComplete Textbox</h1> 
Software 
<asp:TextBox TextMode="multiline" Columns="50" Rows="5" ID="txtCity" runat="server"></asp:TextBox> 
</div> 
</form> 
<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.8.0.js"></script> 
<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.23/jquery-ui.js"></script> 
<script type="text/javascript"> 
$(function() { 
    $("#txtCity").autocomplete({ 
     source: function (request, response) { 
      var param = { cityName: $('#txtCity').val() }; 
      $.ajax({ 
       url: "test.aspx/GetCities", 
       data: JSON.stringify(param), 
       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); 
       } 
      }); 
     }, 
     position: { 
      my: "left center", 
      at: "right center", 
     }, 
     select: function (event, ui) { 
      event.preventDefault(); 
      minLength: 2//minLength as 2, it means when ever user enter 2 character in TextBox the AutoComplete method will fire and get its source data. 
     } 
    }); 
}); 


</script> 
</body> 
</html>

来源

2014-12-02 10:07:29 prwilliams1982

jquery-ui自动完成位置

回答

相关问题