Cómo desarrollar con Visual Studio 2010 un Formulario html para añadir, editar o mostrar elementos de una Lista en SharePoint 2010, es una pregunta típica de desarrollo en SharePoint, ya que aporta una gran riqueza en la personalización de SharePoint que puede resultarnos de gran utilidad.
El presente artículo, describe una forma de hacer esto, conforme a como describe Ingo Karstein en su Blog (ver enlaces más abajo). En mi caso, he intentado seguir los pasos de Ingo y describir lo que he realizado, con los correspondiente pantallazos y demás, pero en Español.
Descripción del Escenario de Prueba
Partimos de un Proyecto de SharePoint 2010 en Visual Studio 2010, configurado para ser desplegado en la Granja (es decir, es una Farm Solution y no una Sandboxed Solution), que incluye entre otras cosas una Definición de Lista (List Definition) con su correspondiente Instancia (List Instance), ambos de forma declarativa (CAML).
El presente ejercicio pretende demostrar cómo crear un formulario html para una Lista, ya sea un Formulario para añadir, ver o editar elementos (add, new ó display). En nuestro caso de ejemplo, vamos a crear un nuevo formulario para añadir elementos a la Lista.
1) Desplegar la Solución de Visual Studio 2010 y crear un nuevo Formulario html de ejemplo desde SharePoint Designer 2010
En esta primera parte, vamos a desplegar nuestro Proyecto de SharePoint, para una vez desplegado, crear un nuevo Formulario html desde SharePoint Designer y copiar su código. El objetivo: obtener un código HTML de ejemplo, para de este modo, no partir desde un lienzo en blanco.
Para empezar vamos a desplegar nuestro Proyecto, por ejemplo pulsando F5 (Start Debugging) en Visual Studio. Una vez que el Proyecto ha sido desplegado, nos conectaremos con SharePoint Designer 2010 al Site sobre el que hemos realizado el despliegue, abriremos las Propiedades de la Lista sobre la que deseamos crear el nuevo Formulario html (en nuestro caso de ejemplo, es la lista Service Requests), y crearemos un nuevo Formulario html.
Especificaremos que deseamos crear un nuevo Formulario html para añadir elementos a la lista (New ítem form), especificaremos un nombre cualquiera al formulario, y click OK para continuar.
Realizado esto, editaremos el nuevo Formulario html desde SharePoint Designer 2010 (por ejemplo, desde las Propiedades de la Lista podremos ver el nuevo formulario, y editarlo), y seguidamente haremos click en la opción Advanced Mode.
Una vez hecho esto, seleccionaremos TODO el código fuente HTML del formulario html, y temporalmente lo guardaremos en un fichero de texto, por ejemplo utilizando Notepad, al que podríamos llamar New.txt.
Con esto, ya podemos detener la sesión de depuración que habíamos iniciado en Visual Studio.
2) Añadir un nuevo Formulario html a una Lista de un Proyecto en Visual Studio 2010
En esta segunda parte, vamos a añadir un nuevo Formulario html a nuestro Proyecto, para que sea utilizado al añadir (New) nuevos elementos a la Lista. El procedimiento a seguir, sería similar si quisiéramos crear un Formulario html para mostrar o editar (Display ó Edit) elementos de Lista.
De vuelta a Visual Studio 2010, ahora tenemos que añadir un nuevo elemento (Add Item) a nuestro Proyecto, de tipo Application Page.
Esto hará que se cree una nueva Página html dentro de la carpeta Layouts, en particular bajo una subcarpeta con el mismo nombre que nuestro Proyecto de Visual Studio (ej: ITSM).
Moveremos (Drag & Drop) esta nueva Página html de la carpeta LAYOUTS a nuestra Definición de Lista (en nuestro caso de ejemplo, a lstServiceRequests, justo debajo), y seguidamente en las Propiedades de dicha Página html, deberemos cambiar el valor de la Propiedad Deployment Type a ElementFile. Hecho esto, podríamos ya eliminar la carpeta LAYOUTS de nuestro Proyecto de Visual Studio, si no la necesitamos para nada más.
Editaremos en Visual Studio la Página html (en nuestro caso, newServiceRequest.html), y eliminaremos TODO el contenido de la página, excepto las líneas que contienen las directivas @Page y @Assembly. Seguidamente, en la línea de código de la directiva @Page, sustituiremos el atributo DynamicMasterPageFile por MasterPageFile.
Ahora copiaremos en nuestra Página html de Visual Studio, todo el código de la Página html que obtuvimos en el paso anterior con SharePoint Designer. Bueno, todo el código excepto la línea que contiene la Directiva @Page.
Seguidamente eliminaremos el contenido del nodo ZoneTemplate (sin eliminar dicho nodo) e incluiremos el código HTML personalizado tras la WebPartZone.
A continuación editaremos el fichero Code Behind de nuestra Página html, es decir, el fichero que contiene el código C# (en nuestro caso de ejemplo, newServiceRequest.html.cs), y realizaremos dos modificaciones: añadiremos una referencia Microsoft.SharePoint.WebPartPages, y sustituiremos el tipo base de nuestra Página html, de LayoutsPageBase a WebPartPage.
Ahora editaremos el fichero Schema.xml de la Definición de Lista que estamos personalizando. Buscaremos la etiqueta Form correspondiente al Formulario html utilizado para añadir nuevos elementos a la lista y realizaremos dos modificaciones: Primero añadiremos el atributo UseLegacyForm="TRUE" (ojito con el TRUE, que sean todas las letras en mayúscula) y seguidamente modificaremos el valor del atributo SetupPath al valor features\$SharePoint.Feature.DeploymentPath$\lstServiceRequests\newServiceRequest.html.
Y llegados a este punto, hemos acabado. La verdad que parece algo lioso, pero en cuanto lo haces unas cuantas veces seguidas, no deja de ser un sota-caballo-rey.
3) Probar el nuevo Formulario html
Ahora toca probar el formulario, por ejemplo pulsando F5 (Start Debugging) en Visual Studio, e intentando añadir un nuevo elemento a nuestra Lista de ejemplo (Service Requests), para así comprobar si el nuevo Formulario html que estamos desarrollando, se muestra o no. Y pinta que sí.
Por supuesto, queda pendiente ver cómo personalizar este tipo de Formularios html, ya que nuestro caso de ejemplo no aporta una gran funcionalidad.
Despedida y Cierre
Hasta aquí llega el presente artículo, en el cual hemos intentado presentar una manera en la que desplegar nuestros propios Formularios html para añadir, editar y mostrar elementos en una Lista de SharePoint desde un Proyecto de Visual Studio. A continuación tenéis algunos enlaces de interés, para quién desee consultar más información.
Poco más por hoy. Como siempre, confío que la lectura resulte de interés.
