Question

我正在尝试根据用户在下拉列表中做出的选择，从Ajax Control Toolkit动态启用/禁用自动完成扩展程序控件。

我的ASP.NET 4.0 Webforms应用程序有一个下拉列表，根据从中选择的国家/地区，应启用或禁用zipcode autoextender。

我的标记：

<asp:DropDownList runat="server" ID="ddlCountries">
    <Items>
            <asp:ListItem Text="Switzerland" Value="CH" />
            <asp:ListItem Text="Germany" Value="D" />
            <asp:ListItem Text="Italy" Value="I" />
            <asp:ListItem Text="France" Value="F" />
    </Items>
</asp:DropDownList>
<br />

<asp:TextBox runat="server" ID="tbxZipcode" />

<asp:AutoCompleteExtender 
     runat="server" ID="acZipcode" BehaviorID="ZipcodeBehavior" 
     ServiceMethod="GetZipCode"
     TargetControlID="tbxZipCode" MinimumPrefixLength="1" CompletionInterval="15" 
     OnClientItemSelected="PopulateTextboxes" CompletionSetCount="25" />

通过此设置，自动完成扩展程序启动并显示有效的瑞士邮政编码 - 生活很美好： - ）

HOWEVER ：如果用户选择其他国家/地区，我想停止此自动填充扩展程序 - 我的数据库中没有其他zipcodes可供显示和显示法国的瑞士邮政编码没有意义。

所以我尝试了这样的东西来获取下拉列表中的change事件

$(document).ready(function () {
   $('#<%= ddlCountries.ClientID %>').change(function () {
      var chosenCountry = $(this).val();

      var behavior = $('#ZipcodeBehavior');

      if (chosenCountry == "CH") {
         behavior.disabled = '';
      } else {
         behavior.disabled = 'disabled';
      }
   });
});

我可以让ZipcodeBehavior很好 - 但是一旦我拥有它 - 似乎没有什么工作了......

如何动态禁用Ajax Control Toolkit的AutocompleteExtender？

在标记中，静态地，我使用

进行

<asp:AutoCompleteExtender Enabled="False" .... />

然后什么都没有呈现到我的页面中。

Answer 1

首先，你不能通过jQuery选择器获得MicrosoftAjax客户端对象。所以这种语法var behavior = $('#ZipcodeBehavior');没有意义。请改用$find("BehaviorID")。

要向AutoCompleteExtender添加禁用功能，请将此脚本的引用添加到ScriptManager控件：

Sys.Extended.UI.AutoCompleteBehavior.prototype.set_enabled = function (value) {
    try {
        $removeHandler(this.get_element(), "keydown", this._keyDownHandler);
    } catch (error) {} //just escape error if handler already removed
    this._timer.set_enabled( !! value);
    if (value) {
        this._keyDownHandler = Function.createDelegate(this, this._onKeyDown);
    } else {
        this._keyDownHandler = Function.createDelegate(this, function () {});
    }
    $addHandler(this.get_element(), "keydown", this._keyDownHandler);
};

之后，您可以使用以下代码禁用/启用扩展程序：

$('#<%= ddlCountries.ClientID %>').change(function () {
    var chosenCountry = $(this).val();
    $find("ZipcodeBehavior").set_enabled(chosenCountry == "CH");
});

BTW，在标记中指定Enabled="false"属性我担心你不应该在客户端启用扩展器。

动态关闭Ajax Control Toolkit自动完成扩展程序

1 个答案: