O ASP.NET MessageBox é um Web User Control que integra a framework jQuery , é um controlo extensível que possibilita várias formas diferentes de apresentar MessageBox’s ao utilizador, utilizando duas tecnologias que em conjunto permitem a construção de um controlo dinâmico, extensível e de agradável utilização.
Disponível em http://jquerymessagebox.codeplex.com
Nesta primeira versão o controlo permite dois tipos diferentes de messagebox, uma do tipo “bubble” e outra standard.
O controlo possibilita a criação automática de um botão para interagir com o controlo, no entanto este é apenas opcional e pode-se desligar esta funcionalidade facilmente.
O design do controlo assenta nos plugins de jquery jQueryUI e plugin BlockUI, apenas com alguma modificações para estes se integrarem melhor num Web User Control de ASP.NET.
Vou passar agora a exemplificar a utilização do ASP.NET jQuery MessageBox com um exemplo para a MessageBox do tipo buble:
Página de exemplo que vai utilizar o controlo (default.aspx)
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="jQueryMessageBox._Default" %>
<%@ Register src="WebUserControl/MessageBoxControl.ascx" tagname="MessageBoxControl" tagprefix="uc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<uc1:MessageBoxControl ID="MessageBoxControl1" runat="server" />
</div>
</form>
</body>
</html>
Code behind (default.aspx.cs)
using System;
using System.Collections.Generic;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Text;
namespace jQueryMessageBox
{
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
MessageBoxControl1.Title = "Test jQueryMessageBox";
MessageBoxControl1.NameBtn = "Open Message";
MessageBoxControl1.NameBtnMessageBox = "Close";
MessageBoxControl1.tipo =
WebUserControl.MessageBoxControl.typeMessageBox.growlMessageBox;
MessageBoxControl1.Text = "Login succeeded!";
}
protected void btn_Click(object sender, EventArgs e)
{
MessageBoxControl1.btn_Click(sender, e);
}
}
}
Ao carregar no botão visível na imagem, pode-se visualizar a mensagem dirigida ao utilizador.
Por outro lado se o tipo de mensagem que nos interessa mostrar ao utilizador contém muita informação e obriga a uma maior atenção por parte do utilizador, podemos utilizar este tipo de MessageBox, alterando o tipo de mensagem a apresentar e alterando o ficheiro default.aspx.cs:
using System;
using System.Collections.Generic;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Text;
namespace jQueryMessageBox
{
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
MessageBoxControl1.Title = "Test jQueryMessageBox";
MessageBoxControl1.NameBtn = "Open Message";
MessageBoxControl1.NameBtnMessageBox = "Close";
/*Alteração do tipo de MessageBox*/
MessageBoxControl1.tipo =
WebUserControl.MessageBoxControl.typeMessageBox.centerMessageBox;
var dados = new StringBuilder();
dados.Append("jQuery is a lightweight cross-browser JavaScript library that emphasizes interaction between JavaScript and HTML. It was released in ");
dados.Append("January 2006 at BarCamp NYC by John Resig. Used by over 27% of the 10,000 most visited websites, jQuery is the most popular ");
dados.Append("JavaScript library in use today.");
dados.Append("jQuery is free, open source software, dual-licensed under the MIT License and the GNU General Public License, Version 2. jQuerys ");
dados.Append("syntax is designed to make it easier to navigate a document, select DOM elements, create animations, handle events, and develop Ajax ");
dados.Append("applications. jQuery also provides capabilities for developers to create plugins on top of the JavaScript library. Providing this option, ");
dados.Append("developers are able to create abstractions for low-level interaction and animation, advanced effects and high-level, theme-able widgets. This");
dados.Append("contributes to the creation of powerful and dynamic web pages.");
dados.Append("Microsoft and Nokia have announced plans to bundle jQuery on their platforms, Microsoft adopting it initially within Visual Studio for use ");
dados.Append("within Microsoft ASP.NET AJAX framework and ASP.NET MVC Framework whilst Nokia will integrate it into their Web Run-Time platform.");
MessageBoxControl1.Text = dados.ToString();
}
protected void btn_Click(object sender, EventArgs e)
{
MessageBoxControl1.btn_Click(sender, e);
}
}
}
E o resultado ao executar o click no mesmo botão é apresentado em baixo:
O projecto de teste e o código fonte do controlo está disponível em http://jquerymessagebox.codeplex.com
Fontes de informação úteis:
http://weblogs.asp.net/scottgu/archive/2008/11/21/jquery-intellisense-in-vs-2008.aspx
http://jquery.com/
http://jqueryui.com/
