Existen muchas formas de emitir un mensaje al usuario luego de que se registra una acción, la mas común es mostrar el mensaje en un Label.
Aquí les mostrare dos formas con un mismo método, es decir, el primer método es mostrar el tipo alert de javascript y la segunda es usando el Dialog de JQuery UI.
Antes de empezar necesitamos una pagina vacía con un TextBox para escribir el mensaje y dos Buttons:
El primero en la propiedad Text le colocaremos “Mensaje con Javascript” y el Segundo “Mensaje con JQuery”, seria algo así:
<body> <form id="form1" runat="server"> <div> <asp:TextBox ID="txtMensaje" runat="server" Width="380px"></asp:TextBox> <br /> <asp:Button ID="btnMensajeJavascript" runat="server" Text="Mensaje con Javascript" onclick="btnMensajeJavascript_Click" /> <asp:Button ID="btnMensajeJQuery" runat="server" Text="Mensaje con JQuery" onclick="btnMensajeJQuery_Click" /> </div> </form> </body>
La primera:
Le damos dobleclick al primer botón y escribiremos lo siguiente:
protected void btnMensajeJavascript_Click(object sender, EventArgs e) { //Declaramos un StringBuilder para almacenar el alert que queremos mostrar StringBuilder sbMensaje = new StringBuilder(); //Aperturamos la escritura de Javascript sbMensaje.Append("<script type='text/javascript'>"); //Le indicamos al alert que mensaje va mostrar sbMensaje.AppendFormat("alert('{0}');",txtMensaje.Text); //Cerramos el Script sbMensaje.Append("</script>"); //Registramos el Script escrito en el StringBuilder ClientScript.RegisterClientScriptBlock(this.GetType(), "mensaje", sbMensaje.ToString()); }
La segunda:
Para esta ocasión registraremos en el Head de la pagina las referencias a JQuery y JQuery UI (Pueden descargar el que mas le agrade o usar CDN de Google)
<head runat="server"> <title>Mostrar Mensajes</title> <script src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.js" type="text/javascript"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/jquery-ui.min.js" type="text/javascript"></script> <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.3/themes/base/jquery-ui.css" type="text/css" media="all" /> </head>
Le daremos dobleclick al segundo botón y escribiremos el siguiente código:
protected void btnMensajeJQuery_Click(object sender, EventArgs e) { //En esta ocasión agregaremos un literal que a su vez agregaremos un div que nos servira de Dialog //O si prefieren pueden crear el div directamente en el HTML Literal li = new Literal(); StringBuilder sbMensaje = new StringBuilder(); //Creamos el Div sbMensaje.Append("<div id='dialog' title='Mensaje Prueba'>"); //Le indicamos el mensaje a mostrar sbMensaje.Append(txtMensaje.Text); //cerramos el div sbMensaje.Append("</div>"); //Aperturamos la escritura de Javascript sbMensaje.Append("<script type='text/javascript'>"); sbMensaje.Append("$(document).ready(function () {"); //Destrimos cualquier rastro de dialogo abierto sbMensaje.Append("$('#dialog').dialog('destroy');"); //le indicamos que muestre el dialogo en modo Modal sbMensaje.Append(" $('#dialog').dialog({ modal: true });"); //Si quieres que muestre un boton para cerrar el mensaje seria esta linea que dejare en comentario //sbMensaje.Append(" $('#dialog').dialog({ modal: true, buttons: { 'Ok': function() { $(this).dialog('close'); } } });"); sbMensaje.Append("});"); sbMensaje.Append("</script>"); //Agremamos el texto del stringbuilder al literal li.Text = sbMensaje.ToString(); //Agregamos el literal a la pagina Page.Controls.Add(li); }
Espero que lo mostrado aquí les sea de mucha utilidad.
Existen muchas formas de emitir un mensaje al usuario luego de que se registra una acción, la mas común
HERMANO SUPER.
sigue realizando aportes de esta manera.
gracias de verdad por el aporte …. lo estaba buscando y ya era un dolor de cabeza porque no sabia como incluir un mensaje JQuery desde el servidor…. me ha ayudado mucho +10 ! jejej xD