Nota
O acesso a esta página requer autorização. Pode tentar iniciar sessão ou alterar os diretórios.
O acesso a esta página requer autorização. Pode tentar alterar os diretórios.
por Christian Wenz
O controlo DynamicPopulate no ASP.NET AJAX Control Toolkit chama um serviço web (ou método de página) e preenche o valor resultante num controlo-alvo na página, sem necessidade de atualização da página.
Descrição geral
O DynamicPopulate controlo no ASP.NET AJAX Control Toolkit chama um serviço web (ou método de página) e preenche o valor resultante num controlo-alvo na página, sem necessidade de atualizar a página. Este tutorial mostra como configurar isto.
Passos
Antes de mais, precisa de um ASP.NET Web Service que implemente o método a ser chamado por DynamicPopulate. A classe do serviço web requer o atributo ScriptService, que está definido dentro de Microsoft.Web.Script.Services; caso contrário, o ASP.NET AJAX não pode criar o proxy JavaScript do lado do cliente para o serviço web, o que é necessário para DynamicPopulate.
O método web deve esperar um argumento do tipo cadeia de caracteres, chamado contextKey, uma vez que o controlo DynamicPopulate envia uma peça de informação de contexto com cada chamada de serviço web. O seguinte serviço web devolve a data atual num formato representado pelo contextKey argumento:
<%@ 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
O serviço web é então guardado como DynamicPopulate.vb.asmx. Em alternativa, podes implementar o getDate() método como um método de página dentro da página ASP.NET real com o DynamicPopulate controlo.
No passo seguinte, crie um novo ficheiro ASP.NET. Como sempre, o primeiro passo é incluir o ScriptManager na página atual para carregar a ASP.NET biblioteca AJAX e fazer funcionar o Kit de Ferramentas de Controlo:
<asp:ScriptManager ID="asm" runat="server" />
Depois, adicionar um controlo de rótulo (por exemplo, usando o controlo HTML com o mesmo nome ou o controlo web <asp:Label />) que mostrará mais tarde o resultado da chamada ao serviço web.
<label id="myDate" runat="server" />
Um botão HTML (como controlo HTML, uma vez que não precisamos de um retorno ao servidor) será então usado para desencadear a população dinâmica:
<input type="button" id="Button1" runat="server" value="Load date (m-d-y)" />
Finalmente, precisamos do DynamicPopulateExtender controle para ligar as coisas. Os seguintes atributos serão definidos (separados dos óbvios, ID e runat="server"):
-
TargetControlIDonde colocar o resultado da chamada ao serviço web -
ServicePathCaminho para o serviço web (omita se quiseres usar um método de página) -
ServiceMethodNome do método web ou método da página -
ContextKeyInformação de contexto a ser enviada para o serviço web -
PopulateTriggerControlIDelemento que desencadeia a chamada ao serviço web -
ClearContentsDuringUpdatese deve esvaziar o elemento alvo durante a chamada ao serviço web
Como podes ver, o controlo requer alguma informação, mas pôr tudo no lugar é bastante simples. Aqui está a marcação para o DynamicPopulateExtender controlo no cenário atual:
<ajaxToolkit:DynamicPopulateExtender ID="dpe1" runat="server"
ClearContentsDuringUpdate="true"
TargetControlID="myDate" ServicePath="DynamicPopulate.vb.asmx"
ServiceMethod="getDate"
ContextKey="format1" PopulateTriggerControlID="Button1" />
Execute a página ASP.NET no navegador e clique no botão; Receberá a data atual em formato de mês-dia-ano.
Um clique no botão recupera a data do servidor (Clique para ver a imagem em tamanho real)