Tecnología

Inicio

Cómo crear Webparts AJAX

Cómo crear Webparts AJAX


Asynchronous JavaScript y XML, o AJAX, es una combinación de diferentes tecnologías de programación. Estas lenguas se componen de CSS, DOM, XML, XSLT y Javascript. Debido a sus diversos componentes, AJAX se puede integrar con todos los tipos de entornos Web para crear efectos atractivos en cualquier sitio web. aplicaciones AJAX mejorar el diseño de los sitios web tradicionales, permitiendo a las páginas Web de solicitud del servidor sólo las partes actualizadas y no toda la recarga de la página.

Instrucciones

1 Abra Visual Studio 2005. Seleccione "Nuevo" en el menú Archivo, y luego en "Proyecto". Clic Seleccione "Windows" en Tipos de proyecto en Visual Basic o C #. Seleccione la opción "Biblioteca de clases" en el panel Plantillas, a continuación, introduzca "Sample.SayHello" como nombre para su proyecto.

2 Elija "Class1.cs" en el Explorador de soluciones para cambiar el nombre de la clase inicial. Haga clic en el archivo, seleccione Cambiar nombre y, de entrada "SayHelloWebPart" como el nuevo nombre de archivo. Haga clic en "Agregar referencia" en el menú proyecto. Seleccione "System.Web.Extensions" en el cuadro de diálogo Agregar referencia en la ficha .NET, y haga clic en "Aceptar". Repita los dos últimos pasos anteriores para el espacio de nombres System.Web. Agregar una referencia a System.Web.UI.WebControls en la sección de referencias del archivo de clase y construir dos variables exclusivas, en su caso, para la interfaz de usuario. Esto es lo que el código debe ser similar a:

using System;

utilizando System.Text;

utilizando System.Web.UI;

utilizando System.Web.UI.WebControls;

utilizando System.Web.UI.WebControls.WebParts;

espacio de nombres Sample.SayHello

{

SayHelloWebPart clase pública: WebPart

{

private Label displayName;

inputName cuadro de texto privado;

}

}

En algunos casos como éste, sólo una variable es aplicable a la sección de interfaz de usuario.

3 Copia y pega el código de abajo en el archivo SayHelloWebPart.cs para anular la función CreateChildControls:

protected override void (CreateChildControls)

{

base.CreateChildControls ();

// Arreglo para el comportamiento de devolución de datos UpdatePanel.

EnsurePanelFix ();

LinkButton sayHello = new LinkButton ();

UpdatePanel refreshName = new UpdatePanel ();

ScriptManager scriptHandler = new ScriptManager ();

idioma = new Label ();

inputName = nuevo cuadro de texto ();

// Configurar las propiedades del control.

this.displayName.ID = "idioma";

this.displayName.Text = "Hola!";

this.inputName.ID = "inputName";

sayHello.ID = "sayHello";

sayHello.Text = "Say Hello";

scriptHandler.ID = "scriptHandler";

refreshName.ID = "refreshName";

refreshName.UpdateMode = UpdatePanelUpdateMode.Conditional;

refreshName.ChildrenAsTriggers = true;

// Añadir el manejador de sucesos al botón.

sayHello.Click + = new manejador de sucesos (clickHandler);

// Añadir la interfaz de usuario (UI) de controles para el UpdatePanel.

refreshName.ContentTemplateContainer.Controls.Add (this.inputName);

refreshName.ContentTemplateContainer.Controls.Add (sayHello);

refreshName.ContentTemplateContainer.Controls.Add (this.displayName);

// El control ScriptManager debe añadirse en primer lugar.

this.Controls.Add (scriptHandler);

this.Controls.Add (refreshName);

}

Ahora, copia y pega el código en el archivo SayHelloWebPart.cs para construir la interfaz de usuario y el manejo de la función de eventos:

ClickHandler privado void (object sender, EventArgs args)

{

this.displayName.Text = "Hola"

+ this.inputName.Text.ToString() + ".";

}

4 Copia y pega este código en los SayHelloWebPart.cs archivo para modificar las secuencias de comandos para garantizar un comportamiento adecuado doPostBack ():

EnsurePanelFix private void ()

{

si (this.Page.Form! = null)

{

String fixupScript = @"

_spBodyOnLoadFunctionNames.push ( "" _ initFormActionAjax "");

funcionar _initFormActionAjax ()

{

si (== _spEscapedFormAction document.forms [0] .action)

{

document.forms [0] = ._ initialAction

document.forms [0] .action;

}

}

var = RestoreToOriginalFormActionCore

RestoreToOriginalFormAction;

RestoreToOriginalFormAction = function ()

{

si (_spOriginalFormAction! = null)

{

RestoreToOriginalFormActionCore ();

document.forms [0] = ._ initialAction

document.forms [0] .action;

}

} ";

ScriptManager.RegisterStartupScript (esto,

typeof(SayHelloWebPart), "UpdatePanelFixup",

fixupScript, true);

}

}

Consejos y advertencias

  • Mueva el "webpartmanager" dentro de la etiqueta de formulario para garantizar la correcta visualización de todos sus componentes asociados.
  • Modificar la sección de cabecera de la página maestra y asegurar que todos sus títulos de la etiqueta están en la misma línea para garantizar una correcta visualización.