ASP.NET ajaxToolkit AutoCompleteExtender美化样式

ChinaLzw

于 2017-04-25 09:56:26 发布

阅读量915

点赞数 1

分类专栏： asp.net web 工具组件

本文为博主原创文章，只为分享而编，欢迎各位学习以及转载。

本文链接：https://blog.csdn.net/qq285679784/article/details/70673513

版权

asp.net web 同时被 2 个专栏收录

169 篇文章 1 订阅

订阅专栏

工具组件

9 篇文章 0 订阅

订阅专栏

示例源码下载其他示例下载

<style type="text/css">
    /*AutoComplete flyout */
    .autocomplete_completionListElement {
        visibility: hidden;
        margin: 0px !important;
        background-color: inherit;
        color: windowtext;
        border: buttonshadow;
        border-width: 1px;
        border-style: solid;
        cursor: pointer;
        overflow: auto;
        text-align: left;
        list-style-type: none;
        font-family: Verdana;
        font-size: 13px;
        padding: 0;
    }

    /* AutoComplete item */
    .autocomplete_listItem {
        background-color: white;
        padding: 1px;
    }

    /* AutoComplete highlighted item */
    .autocomplete_highlightedListItem {
        background-color: #e9f5f7;
        padding: 1px;
    }
</style>

<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:TextBox ID="txtSearch" runat="server" οnkeydοwn="SetContextKey();"></asp:TextBox>
<ajaxToolkit:AutoCompleteExtender ID="autoComplete" runat="server" TargetControlID="txtSearch"
    ServicePath="~/AjaxService/webservice.asmx"
    ServiceMethod="GetAutoCompleteExtenderData"
    MinimumPrefixLength="1"
    CompletionInterval="200"
    CompletionSetCount="10"
    FirstRowSelected="true"
    EnableCaching="false"
    UseContextKey="true"
    OnClientItemSelected="ajaxCompleteCallBack"
    CompletionListCssClass="autocomplete_completionListElement"
    CompletionListItemCssClass="autocomplete_listItem"
    CompletionListHighlightedItemCssClass="autocomplete_highlightedListItem">
</ajaxToolkit:AutoCompleteExtender>
<div id="AjaxCompleteSelectedValue"></div>