Kullanıcı Denetimi ve JavaScript ile DynamicPopulate Kullanma (VB)

Christian Wenz tarafından

PDF’yi İndir

ASP.NET AJAX Denetim Araç Seti'ndeki DynamicPopulate denetimi bir web hizmetini (veya sayfa yöntemini) çağırır ve sonuçta elde edilen değeri sayfa yenilemesi olmadan sayfadaki hedef denetime doldurur. Özel istemci tarafı JavaScript kodu kullanarak popülasyonu tetikleme de mümkündür. Öte yandan genişletici bir kullanıcı denetiminde bulunduğunda özel özen gösterilmelidir.

Genel Bakış

DynamicPopulate ASP.NET AJAX Denetim Araç Seti'ndeki denetim bir web hizmetini (veya sayfa yöntemini) çağırır ve sonuçta elde edilen değeri sayfa yenilemesi olmadan sayfadaki bir hedef denetime doldurur. Özel istemci tarafı JavaScript kodu kullanarak popülasyonu tetikleme de mümkündür. Öte yandan genişletici bir kullanıcı denetiminde bulunduğunda özel özen gösterilmelidir.

Adımlar

Her şeyden önce, denetim tarafından DynamicPopulateExtender çağrılmak üzere yöntemini uygulayan bir ASP.NET Web Hizmeti gerekir. Denetim her web hizmeti çağrısıyla bir bağlam bilgisi parçası gönderdiğinden, contextKeyDynamicPopulate web hizmeti adlı dize türünde bir bağımsız değişken bekleyen yöntemini getDate() uygular. Geçerli tarihi üç biçimden birinde alan kod (dosyalar DynamicPopulate.vb.asmx) aşağıdadır:

<%@ WebService Language="VB" Class="DynamicPopulate" %>
Imports System.Web
Imports System.Web.Services
Imports System.Web.Services.Protocols
Imports System.Web.Script.Services
<ScriptService()> _
Public Class DynamicPopulate
 Inherits System.Web.Services.WebService
 <WebMethod()> _
 Public Function getDate(ByVal contextKey As String) As String
 Dim myDate As String = ""
 Select Case contextKey
 Case "format1"
 myDate = String.Format("{0:MM}-{0:dd}-{0:yyyy}", DateTime.Now)
 Case "format2"
 myDate = String.Format("{0:dd}.{0:MM}.{0:yyyy}", DateTime.Now)
 Case "format3"
 myDate = String.Format("{0:yyyy}/{0:MM}/{0:dd}", DateTime.Now)
 End Select
 Return myDate
 End Function
End Class

Sonraki adımda, ilk satırında aşağıdaki bildirimle belirtilen yeni bir kullanıcı denetimi (.ascx dosyası) oluşturun:

<%@ Control Language="C#" ClassName="DynamicPopulate2" %>

< label > Sunucudan gelen verileri görüntülemek için bir öğe kullanılır.

<label id="myDate" runat="server" />

Ayrıca kullanıcı denetim dosyasında, her biri web hizmeti tarafından desteklenen üç olası tarih biçiminden birini temsil eden üç radyo düğmesi kullanacağız. Kullanıcı radyo düğmelerinden birine tıkladığında tarayıcı aşağıdakine benzer bir JavaScript kodu yürütür:

$find("mcd1_dpe1").populate(this.value)

Bu kod öğesine erişir DynamicPopulateExtender (henüz garip kimlik konusunda endişelenmeyin, daha sonra ele alınacaktır) ve dinamik popülasyonu verilerle tetikler. Geçerli radyo düğmesi bağlamında değeri this.value olan format1veya format2format3 web yönteminin tam olarak beklediği değeri ifade eder.

Kullanıcı denetiminde eksik olan tek şey, radyo düğmelerini web hizmetine bağlayan denetimdir DynamicPopulateExtender .

<ajaxToolkit:DynamicPopulateExtender ID="dpe1" runat="server"
 ClearContentsDuringUpdate="true"
 TargetControlID="mcd1$myDate"
 ServicePath="DynamicPopulate.vb.asmx" ServiceMethod="getDate"/>

Yine denetimde kullanılan garip kimliği not edebilirsiniz: mcd1$myDate yerine myDate. Daha önce yerine öğesine erişmek DynamicPopulateExtenderdpe1için kullanılan JavaScript kodu.mcd1_dpe1 Bu adlandırma stratejisi, kullanıcı denetiminde kullanılırken DynamicPopulateExtender özel bir gereksinimdir. Ayrıca, kullanıcı denetiminin çalışmasını sağlamak için belirli bir şekilde eklemeniz gerekir. Yeni bir ASP.NET sayfası oluşturun ve az önce uyguladığınız kullanıcı denetimi için bir etiket ön eki kaydedin:

<%@ Register TagPrefix="uc1" TagName="myCustomDate" Src="~/DynamicPopulate2.vb.ascx"%>

Ardından yeni sayfaya ASP.NET AJAX ScriptManager denetimini ekleyin:

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

Son olarak, kullanıcı denetimini sayfaya ekleyin. Yalnızca özniteliğini ID (ve runat="server"elbette) ayarlamanız gerekir, ancak bunu belirli bir ada da ayarlamanız gerekir: mcd1 çünkü bu, JavaScript kullanarak erişmek için kullanıcı denetiminde kullanılan ön ektir.

<div>
 <uc1:myCustomDate ID="mcd1" runat="server" />
</div>

Hepsi bu! Sayfa beklendiği gibi davranır: Kullanıcı radyo düğmelerinden birine tıklar, Araç Seti'ndeki denetim web hizmetini çağırır ve geçerli tarihi istenen biçimde görüntüler.

Radyo düğmeleri bir kullanıcı denetiminde bulunur (Tam boyutlu görüntüyü görüntülemek için tıklayın)

Önceki