Preencher dinamicamente um controle (C#)

por Christian Wenz

Descarregar PDF

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="C#" Class="DynamicPopulate" %>
using System;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Web.Script.Services;
[ScriptService]
public class DynamicPopulate : System.Web.Services.WebService
{
 [WebMethod]
 public string getDate(string contextKey)
 {
 string myDate = "";
 switch (contextKey)
 {
 case "format1":
 myDate = String.Format("{0:MM}-{0:dd}-{0:yyyy}", DateTime.Now);
 break;
 case "format2":
 myDate = String.Format("{0:dd}.{0:MM}.{0:yyyy}", DateTime.Now);
 break;
 case "format3":
 myDate = String.Format("{0:yyyy}/{0:MM}/{0:dd}", DateTime.Now);
 break;
 }
 return myDate;
 }
}

O serviço web é então guardado como DynamicPopulate.cs.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"):

• TargetControlID onde colocar o resultado da chamada ao serviço web
• ServicePath Caminho para o serviço web (omita se quiseres usar um método de página)
• ServiceMethod Nome do método web ou método da página
• ContextKey Informação de contexto a ser enviada para o serviço web
• PopulateTriggerControlID elemento que desencadeia a chamada ao serviço web
• ClearContentsDuringUpdate se 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.cs.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)