elGuille mola

Etiqueta: ASP.NET

Posts relacionados con la tecnología de sitios y aplicaciones Web de .NET Framework

  • Cómo enviar cambios de línea usando mailto (html/script)

    Pues eso… llevo unos días creando un nuevo sitio usando ASP.NET (con C#) para un colega al que le ayudo a vender sus productos por internet (Conservas Yoga) y probando el envío de emails desde el sitio usando una cuenta de gmail, me ha estado dando problemas y al final no he conseguido que funcione, no creo que sea por los permisos de gmail, ya que en la aplicación de gsNotasNET.Android me ha estado funcionando bien (o en su día en foros.elguille.info, pero en este nuevo sitio no había forma… así que… he hecho lo que suelo hacer cuando las cosas no funcionan: ¡cortar por lo sano y usar lo que siempre funciona!

    Y lo que siempre funciona es usar mailto para enviar mensajes.

    ¿Cómo indicar el asunto al usar mailto?

    Una de las cosas que siempre he usado es indicar el asunto cuando se pulse en el enlace de mailto (ahora te muestro el código), en ese caso, lo que hay que hacer es indicar un parámetro con la palabra clave subject el signo igual e indicar el texto del asunto.

    Según desde que navegador se use habrá que indicar de forma distinta los espacios en el asunto, normalmente la forma más segura de hacerlo (válido para todos los navegadores, más viejos o más recientes) es usar %20 (equivalente en valor hexadecimal a un espacio).

    Pero como te digo puedes usarlo con espacios y casi siempre funciona.

    El código para enviar un email a la cuenta tuemail2021@gmail.com con el asunto «Comentario desde el guille mola» sería el siguiente:

    Pulsa en este enlace para enviar un mensaje con el asunto: Comentario desde el guille mola.

    El código de esa línea sería el siguiente:

    <p>Pulsa en este enlace para enviar un mensaje con el asunto: 
    <a href="mailto:tuemail2021@gmail.com?Subject=Comentario desde el guille mola">
        Comentario desde el guille mola</a>.</p>

    Si quisieras asegurarte de que no dará problemas, puedes cambiar los espacios por %20, pero creo que así debería funcionar (si no pruebas y te da error o algún mensaje fuera de lo común, por favor lo comentas en la sección de comentarios de este post, gracias).

    Y ahora vamos a la parte principal de este artículo… Sí, podría haber empezado por aquí, pero… antes había que sentar los precedentes 😉

    ¿Cómo indicar el cuerpo del mensaje usando mailto?

    Esto ya lo había hecho yo antes, pero el otro día necesitaba añadir cambios de líneas al texto del cuerpo del mensaje y no daba con la forma de hacerlo… menos mal que en internet siempre hay alguien que te lo explica 😉

    En mi caso fue en este sitio: HTML mailto link.

    Y el truco para añadir cambios de línea es (ahora parece tan obvio) usar los códigos de cambio de línea (LF o Line Feed) y retorno de carro (CR o Carriage Return) cuyos valores en decimal son: LF = 10, CR = 13, que en hexadecimal son: x0A y x0D, por tanto añadiendo esos valores en cada cambio de línea (normalmente se hace al revés, primero el CR y después el LF, pero creo que dará lo mismo).

    Así que… si queremos usar el asunto del ejemplo anterior y queremos poner el siguiente mensaje (el body del email):

    Hola Guille, perdón Tu Email 2021,

    Este mensaje es una prueba desde post del blog.

    ¡Hasta la próxima!
    <Indica tu nombre>

    El enlace sería este: Enviar un mensaje con el texto arriba indicado.

    El código quedaría de la siguiente forma:

    <p>El enlace sería este: <strong>
    <a href="mailto:tuemail2021@gmail.com?Subject=Comentario desde el guille mola
        &Body=Hola Guille, perdón Tu Email 2021,%0D%0A%0D%0AEste mensaje es una prueba desde post del blog.%0D%0A%0D%0A¡Hasta la próxima!%0D%0A---Indica tu nombre---
        Enviar un mensaje con el texto arriba indicado</a></strong>.</p>

    Nota:
    Hay que tener cuidado con los editores de sitios WEB, como este de WordPress, ya que para indicar el asunto se hace con ? (?Subject=) después del nombre de la cuenta de correo (el ? es porque es el primer parámetro) y el cuerpo se usa con &Body=, es decir, cada parámetro o argumento que no sea el primero debe indicarse con el signo & (ampersand). Y los editores de código HTML lo sulen cambaiar pro &amp; (de ampersand).
    Así que… si al pulsar en el enlace anterior no funciona, es que el editor de WordPress lo ha modificado… pero creo que aún así, seguirá funcionando.

    Es decir, para usar el asunto se indica co ?Subject= y para indicar el cuerpo o texto del mensaje se hace con &Body=.

    Si inviertes el orden, primero indicas el Body y después el Subject, la cosa quedaría así:
    ?Body=Cuerpo del mensaje%0D%0ACon cambio de línea.&Subject=Asunto del mensaje.

    Si pulsas en este enlace, el orden está invertido (tal como muestro arriba).

    Y ya solo nos queda repasar lo comentado:

    Recordando que en Subject y Body dan igual las mayúsculas o minúsculas.

    1. Para indicar el asunto se usa Subject (o subject)
    2. Para indicar el cuerpo (o texto) del mensaje se usa Body (o body)
    3. Para indicar espacios tanto en el asunto como en el texto del mensaje puedes usar %20
    4. Para indicar cambios de líneas (normalmente en el cuerpo del mensaje) usa: %0D%0A

    Y esto es todo… espero que te sea de utilidad… y si no te sirve, al menos a mí me servirá algún día (ya que seguro que me olvidaré de este truco si pasa un tiempo sin usarlo).

    Nos vemos.
    Guillermo

  • Asignar el foco a un control al cargar una página web aspx (ampliación y recapitulación)

    Pues eso… que lo de "ampliación" es por no poner "revisited" o algo similar que eso ya está muy visto, jeje y lo de "recapitulación" por el chasco/descubrimiento/formas diferentes de funcionar con el que me he encontrado al hacer pruebas en VB y en C#, ya verás, ya…

    Pero en realidad esto es una aclaración o más bien un añadido (o ampliación) del otro artículo que publiqué el pasado 11 de octubre sobre este mismo tema, es decir, cómo asignar el foco a un control al cargar una página web aspx, en ese caso el código era con Visual Basic .NET pero lo importante no era el código si no lo explicado, es decir la forma de conseguir eso que indica el título.

    La aclaración es porque en ese ejemplo el código y el diseño está todo en un mismo fichero (archivo) en lugar de tener el código por un lado y el diseño por otro, que es como el Visual Studio se empeña que lo hagamos, aunque en mi caso particular me gusta más (o prefiero) tener todo junto, ya que así es más fácil de actualizar la página en concreto, al menos para mí, que todo puede ser que a tí te venga mejor compilar el código y publicarlo cada vez que hagas una modificación por pequeña que sea… ¡hay gustos para todo! 😉

     

    Vamos a lo que vamos.

    Si utilizas el código por separado del diseño de la página web entonces no es necesario asignar un valor true a la propiedad AutoEventWireup, ese valor verdadero sólo debes asignarlo si el código a usar está "incrustado" en la página web ASPX y no en un fichero separado (el cual hay que compilar y publicar en el sitio web).

     

    La forma de indicar si tienes el código "incrustado" o por separado es usando (lo que se llama "code behind"), esto lo puedes indicar al crear un nuevo fichero en el proyecto web tal como puedes ver en la figura 1 en la que he resaltado la parte que le indica a Visual Studio si quieres usar el código en un fichero separado o no (en este ejemplo SI se usa por separado).

    orden_tabulacion_fig1
    Figura 1. Indicar si queremos el código por separado o no

     

    Esto creará dos ficheros uno con la extensión .aspx (el diseño de la página web) y otro con la extensión del lenguaje usado, en este ejemplo al indicar que el código es de C# la extensión del fichero de código es: .aspx.cs.

    En este caso, el código de "enfoque" del control que queremos que sea el primero en recibir el foco lo pondremos dentro del evento Page_Load tal como podemos ver en los dos listados (el del diseñador y el código).
    (Ver el comentario de la nota).

     

    Listado 1 (el código del diseñador .aspx):

     

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default3.aspx.cs" Inherits="Default3" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Default3 - con el código por separado (en C#)</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
        <asp:TextBox ID="TextBox1" runat="server">uno</asp:TextBox><br />
        <asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
        <asp:TextBox ID="TextBox2" runat="server">dos</asp:TextBox><br />
        <asp:Label ID="Label3" runat="server" Text="Label"></asp:Label>
        <asp:TextBox ID="TextBox3" runat="server">tres</asp:TextBox><br />
        <asp:Button ID="Button1" runat="server" Text="Button" />    
    </div>
    </form>
</body>
</html>

     

    Listado 2 (el código de C# .aspx.cs):

     

    using System;
using System.Collections.Generic;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class Default3 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        this.TextBox1.Focus();
    }

     

     

    Nota:

    Es curioso, pero al hacer la prueba con C# para "demostrar" todo esto que estoy explicando, si no uso un valor verdadero (true) en la propiedad AutoEventWireup de la página de C# no se ejecuta ese código del evento Page_Load, sin embargo (de ahí lo de curioso) en el código de Visual Basic da igual el valor que tenga esa propiedad… ¡jum!

     

     

    Conclusión:

    Que no tengo ni idea de por qué pasa esto con una página de C#… así que… sigue usando AutoEventWireup = "true" y así seguro que siempre te funciona…

    Como te he dicho antes (en la nota) en Visual Basic .NET si va bien, uses true o false en AutoEventWireup, eso sí, siempre que el código esté por separado, si el código está en la misma página, si hay que indicar el valor true.

    En cualquier caso, lo cierto es que al añadir la página de C# el valor de la propiedad AutoEventWireup tiene el valor true, mientras que en Visual Basic es false.

    Todo esto (no solo que el valor sea verdadero/falso) es otra demostración de que a los de Visual Basic nos tratan de forma diferente…

    En fin…

     

    Espero que te sea de utilidad.

     

    Nos vemos.

    Guillermo

    …

  • El inherit de los CSS no funciona igual en todos los navegadores

    Pues eso… o al menos en el Internet Explorer y el Chrome que son los que suelo utilizar en mi portátil… (en el móvil utilizo el Opera Mini).
    Al menos en lo que al ancho (width) se refiere.

    No me voy a enrollar pero te explico brevemente:

    Tengo una serie de estilos (tanto en ficheros CSS como en bloques <style>) y en algunos de ellos simplemente quiero "heredar" el ancho que ya está previamente definido en otro de los estilos, por tanto, simplemente utilizo esto:

    width: inherit;

    Y supuestamente debería utilizar el ancho "heredado" es decir, el que tenga el bloque (normalmente un <div>) que contiene al que le aplico el nuevo estilo (para algunas páginas en concreto), pero resulta que no es así…

    Con Internet Explorer se muestra bien, pero cuando utilizo el Chrome me lo muestra mal, de hecho el ancho heredado es más grande y se "sale" de su sitio…

    Hoy me he puesto a "juguetear" con la opción que tiene el Chrome (supongo que el IE también) de "Inspeccionar elemento", que te vale para ver el "elemento" de la página web actual en la que pulsas con el ratón (mouse) y poder modificarla, de forma que puedas ver cómo quedaría con los cambios que realices.

     

    Para mostrar la opción Inspeccionar elemento de Chrome:

    Esto se consigue pulsando con el botón secundario del ratón (normalmente el botón derecho) sobre el "elemento" a inspeccionar de una página web.
    Te muestra una ventana con el código HTML, los estilos, etc. de forma que los puedes modificar sobre la marcha y ver el resultado.

     

    Lo que te decía que me he puesto a probar y al quitar esa línea de código en la que le digo width: inherit; se ha solucionado el "desborde" que tenía del div con el título en algunas partes de las páginas… en fin…

    Así que… me he puesto a buscar en los ficheros de estilos (.css) y en los modificados en algunas de las páginas maestras (.master) que utilizo en mi sitio y parece ser que ya no están esos desbordes… mejor así ¿no? po ezo…

     

    Espero que te sea de utilidad.

    Nos vemos.
    Guillermo

    …