Używanie automatycznego ogłaszania zwrotnego za pomocą kontrolki CascadingDropDown (C#)
Autor: Christian Wenz
Kontrolka CascadingDropDown w zestawie narzędzi AJAX Control Toolkit rozszerza kontrolkę DropDownList, aby zmiany w jednej kontrolce DropDownList ładowały skojarzone wartości w innej kontrolce DropDownList. Jednak w przypadku korzystania z kontrolki CascadingDropDown asp. Funkcja AutoPostBack kontrolki DropDownList platformy NET nie działa, ponieważ asynchroniczne ładowanie danych do listy powoduje wygenerowanie (niepotrzebnego) ogłaszania zwrotnego. W przypadku kodu JavaScript można uniknąć tego efektu.
Omówienie
Kontrolka CascadingDropDown w zestawie narzędzi AJAX Control Toolkit rozszerza kontrolkę DropDownList, aby zmiany w jednej kontrolce DropDownList ładowały skojarzone wartości w innej kontrolce DropDownList. (Na przykład jedna lista zawiera listę stanów USA, a następna lista jest następnie wypełniona dużymi miastami w tym stanie). Jednak w przypadku korzystania z kontrolki CascadingDropDown asp. Funkcja AutoPostBack kontrolki DropDownList platformy NET nie działa, ponieważ asynchroniczne ładowanie danych do listy powoduje wygenerowanie (niepotrzebnego) ogłaszania zwrotnego. W przypadku kodu JavaScript można uniknąć tego efektu.
Kroki
Aby aktywować funkcje ASP.NET AJAX i Control Toolkit, kontrolka ScriptManager musi zostać umieszczona w dowolnym miejscu na stronie (ale w elemecieform<>):
<asp:ScriptManager ID="asm" runat="server" />
Następnie wymagana jest kontrolka DropDownList:
<div>
Vendor: <asp:DropDownList ID="VendorsList" runat="server"/>
</div>
Dla tej listy jest dodawany rozszerzenie CascadingDropDown, dostarczając adres URL usługi internetowej i informacje o metodzie:
<ajaxToolkit:CascadingDropDown ID="ccd1" runat="server"
ServicePath="CascadingDropdown3.cs.asmx" ServiceMethod="GetVendors"
TargetControlID="VendorsList" Category="Vendor" />
Rozszerzenie CascadingDropDown następnie asynchronicznie wywołuje usługę internetową z następującym podpisem metody:
public CascadingDropDownNameValue[] MethodNameHere(string knownCategoryValues, string category)
Metoda zwraca tablicę typu CascadingDropDown. Konstruktor typu oczekuje najpierw podpis wpisu listy, a następnie wartość (atrybut HTMLvalue).
<%@ WebService Language="C#" Class="CascadingDropdown3" %>
using System.Web.Script.Services;
using AjaxControlToolkit;
using System;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Collections.Generic;
[ScriptService]
public class CascadingDropdown3 : System.Web.Services.WebService
{
[WebMethod]
public CascadingDropDownNameValue[] GetVendors(string knownCategoryValues,
string category)
{
List<CascadingDropDownNameValue> l = new List<CascadingDropDownNameValue>();
l.Add(new CascadingDropDownNameValue("International", "1"));
l.Add(new CascadingDropDownNameValue("Electronic Bike Repairs & Supplies", "2"));
l.Add(new CascadingDropDownNameValue("Premier Sport, Inc.", "3"));
return l.ToArray();
}
}
Załadowanie strony w przeglądarce spowoduje wypełnienie listy rozwijanej trzema dostawcami, a drugi jest wstępnie wybrany. Ponadto ASP.NET definiuje metodę __doPostBack() JavaScript. Po załadowaniu strony to wywołanie języka JavaScript zostanie dodane do listy rozwijanej, ale tylko wtedy, gdy istnieją w niej elementy. Jeśli na liście nie ma żadnych elementów, zestaw narzędzi control toolkit jest obecnie ładowany, więc kod JavaScript używa limitu czasu i spróbuje ponownie za pół sekundy.
<script type="text/javascript">
function pageLoad()
{
addAutoPostBack();
}
function addAutoPostBack()
{
if ($get("VendorsList").options.length > 0)
{
$get("VendorsList").setAttribute("onchange","javascript:setTimeout('__doPostBack(\\'VendorsList\\',\\'\\')', 0)");
}
else
{
setTimeout("addAutoPostBack()", 500);
}
}
</script>
Dzięki temu ogłaszanie zwrotne jest wykonywane tylko wtedy, gdy na liście znajdują się elementy, a użytkownik wybiera wpis.
Wybranie elementu listy powoduje wyświetlenie ogłaszania zwrotnego (kliknij, aby wyświetlić obraz o pełnym rozmiarze)
