SharePoint 2013: Como añadir comportamiento a código HTML añadido con Designer!

Otra de las pequeñas novedades que trae SharePoint Designer 2013 (SPD 2013) es la de facilitar la adición de comportamiento a etiquetas HTML como puede ser <img>:

  • Editamos una página de nuestro sitio en “Modo avanzado” y añadimos una etiqueta <img> dentro del PlaceHolder principal de la misma.
  • En la cinta de SPD 2013 nos vamos a “Vista” y dentro de las opciones “Paneles de tareas” pulsamos sobre “Comportamiento” de modo que se muestra la sección del mismo nombre en Designer.
  • Para agregar una acción desplegamos las opciones disponibles en “Insertar” y pulsamos por ejemplo en “Mensaje emergente”.
image image image
  • En este caso, se muestra una ventana emergente en la que podemos indicar el mensaje a mostrar para el evento OnClick de la etiqueta <img> que es el que se va a añadir como consecuencia de pulsar la opción “Mensaje emergente” en la sección “Comportamientos” de Designer.
  • De echo, el HTML que genera Designer es el siguiente:
   1: <img alt="imagen" src="../SiteAssets/Logo_Ayuda.gif" onclick="FP_popUpMsg('TEst')">

  • Cómo veis, en el evento onclick se añade una llamada a la función JavaScript FP_popUpMsg().
  • Guardamos los cambios y comprobamos como al hacer clic en la imagen se muestra el típico mensaje de Alert.
image image

Publicado por

Juan Carlos González

Juan Carlos es Ingeniero de Telecomunicaciones por la Universidad de Valladolid y Diplomado en Ciencias Empresariales por la Universidad Oberta de Catalunya (UOC). Cuenta con más de 12 años de experiencia en tecnologías y plataformas de Microsoft diversas (SQL Server, Visual Studio, .NET Framework, etc.), aunque su trabajo diario gira en torno a SharePoint & Office 365. Juan Carlos es MVP de Office Servers & Services desde 2015 (anteriormente fue reconocido por Microsoft como MVP de Office 365 y MVP de SharePoint Server desde 2008 hasta 2015), coordinador del grupo de usuarios .NET de Cantabria (Nuberos.Net, www.nuberos.es), co-fundador y coordinador del Grupo de Usuarios de SharePoint de España (SUGES, www.suges.es), así como co-director de la revista gratuita en castellano sobre SharePoint CompartiMOSS (www.compartimoss.com). Hasta la fecha, ha publicado 8 libros sobre SharePoint & Office 365 y varios artículos en castellano y en inglés sobre ambas plataformas.

Un comentario en “SharePoint 2013: Como añadir comportamiento a código HTML añadido con Designer!”

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *