Sdílet prostřednictvím


Použití funkce Auto-Postback v ovládacím prvku CascadingDropDown (C#)

Christian Wenz

Stáhnout PDF

Ovládací prvek CascadingDropDown v sadě nástrojů AJAX Control Toolkit rozšiřuje ovládací prvek DropDownList tak, aby změny v jednom DropDownList načítá přidružené hodnoty do jiného DropDownList. Při použití ovládacího prvku CascadingDropDown však asp. NET Funkce AutoPostBack ovládacího prvku DropDownList nefunguje, protože asynchronní načítání dat do seznamu generuje (nepotřebné) zpětné odeslání samotné. Pomocí javascriptového kódu se můžete tomuto efektu vyhnout.

Přehled

Ovládací prvek CascadingDropDown v sadě nástrojů AJAX Control Toolkit rozšiřuje ovládací prvek DropDownList tak, aby změny v jednom DropDownList načítá přidružené hodnoty do jiného DropDownList. (Například jeden seznam obsahuje seznam států USA a další seznam je pak vyplněný hlavními městy v tomto státě.) Při použití ovládacího prvku CascadingDropDown však asp. NET Funkce AutoPostBack ovládacího prvku DropDownList nefunguje, protože asynchronní načítání dat do seznamu generuje (nepotřebné) zpětné odeslání samotné. Pomocí javascriptového kódu se můžete tomuto efektu vyhnout.

Postup

Aby bylo možné aktivovat funkce ASP.NET AJAX a Control Toolkit, ScriptManager musí být ovládací prvek umístěn kdekoli na stránce (ale v rámci elementuform<>):

<asp:ScriptManager ID="asm" runat="server" />

Potom se vyžaduje ovládací prvek DropDownList:

<div>
 Vendor: <asp:DropDownList ID="VendorsList" runat="server"/>
</div>

Pro tento seznam je přidán extender CascadingDropDown, který poskytuje adresu URL webové služby a informace o metodě:

<ajaxToolkit:CascadingDropDown ID="ccd1" runat="server"
 ServicePath="CascadingDropdown3.cs.asmx" ServiceMethod="GetVendors"
 TargetControlID="VendorsList" Category="Vendor" />

Extender CascadingDropDown pak asynchronně volá webovou službu s následujícím podpisem metody:

public CascadingDropDownNameValue[] MethodNameHere(string knownCategoryValues, string category)

Metoda vrátí pole typu CascadingDropDown hodnoty. Konstruktor typu očekává nejprve popis položky seznamu a pak hodnotu (atribut 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();
 }
}

Načtením stránky v prohlížeči se vyplní rozevírací seznam třemi dodavateli, přičemž druhý dodavatel bude předem vybraný. Také ASP.NET definuje javascriptovou metodu __doPostBack() . Po načtení stránky se toto volání JavaScriptu přidá do rozevíracího seznamu, ale pouze v případě, že obsahuje prvky. Pokud v seznamu nejsou žádné prvky, Sada nástrojů Control Toolkit je aktuálně načítá, takže kód JavaScriptu použije časový limit a zkusí to znovu za půl 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>

Tímto způsobem se postback spustí pouze v případě, že seznam skutečně obsahuje prvky a uživatel vybere položku.

Výběr prvku seznamu způsobí zpětné odeslání.

Výběr prvku seznamu způsobí zpětné odeslání (kliknutím zobrazíte obrázek v plné velikosti).