Introducción y objetivo
Fuera de la caja, MOSS’ Elemento Web consulta de contenido (CQWP) muestra los resultados en formato de lista, similar a resultados de búsqueda. También es posible mostrar los resultados en un formato de cuadrícula (i.e. Formato de tabla HTML). Formatos de cuadrícula son mejores en algunas circunstancias. Describo cómo lograr ese efecto en el presente artículo.
Escenario de negocio
He trabajado con un cliente en una implementación MOSS de toda la empresa. Hemos diseñado su taxonomía que proyectos son ciudadanos de primera clase en la jerarquía y tienen su propio sitio de nivel superior. Gerentes de proyectos mantienen una lista de singleton de información Resumen del proyecto, como título, presupuesto, fecha de terminación prevista, presupuesto restante y otros campos de tipo Resumen. Por "singleton" Me refiero a una lista personalizada de SharePoint garantizada que contiene sólo un elemento. Manera simplista, este aspecto:
El enfoque técnico es lo mismo como se describe aquí (http://paulgalvin.spaces.live.com/blog/cns!1CC1EDB3DAA9B8AA!447.entry). La CQWP usa una transformación XSL para emitir HTML para el navegador para representar.
Siempre preveo el resultado antes de zambullirse en el XSL porque XSL es una pesadilla. Aquí está mi resultado deseado:
HTML así genera ese resultado:
|
|
<HTML>
<cuerpo>
<Centro>
<mesa frontera= 1>
<!-- Etiquetas:>
<TR bgcolor= azul>
<TD><fuente Color= blanco><b>Nombre del proyecto</b></fuente></TD>
<TD alinear= a la derecha><fuente Color= blanco><b>Fecha completa</b></fuente></TD>
<TD alinear= a la derecha><fuente Color= blanco><b>Presupuesto</b></fuente></TD>
<TD alinear= a la derecha><fuente Color= blanco><b>Gasto real</b></fuente></TD>
<TD><fuente Color= blanco><b>Estado general</b></fuente></TD>
</TR>
<TR>
<TD>Sala de ordenadores Re-cablea.</TD>
<TD alinear= a la derecha>02/01/08</TD>
<TD alinear= a la derecha>22,500.00</TD>
<TD alinear= a la derecha>19,000.00</TD>
<TD>En progreso</TD>
</TR>
<TR>
<TD>Servidores de provisión para actualización de SQL</TD>
<TD alinear= a la derecha>04/01/08</TD>
<TD alinear= a la derecha>7,500.00</TD>
<TD alinear= a la derecha>0.00</TD>
<TD>Planeado</TD>
</TR>
</mesa>
</Centro>
</cuerpo>
</HTML>
|
Enfoque
Siga estos pasos para crear la red:
- Identificar los componentes de la red (filas o columnas).
- Definir y crear columnas de sitio necesario.
- Crear sub sitios para los proyectos y las listas de singleton.
- Agregar el CQWP a una página web y configurar para buscar tus listas.
- Modificar XML del CQWP a recoger las columnas adicionales.
- Modificar el XSL para generar una tabla.
Me voy a concentrar en el número seis. Los números uno a través de cuatro son directa y algo que ya ha hecho cualquier usuario CQWP. Número cinco ha sido documentado por otros incluyendo este exhaustivo artículo cargado de captura de pantalla de MSDN aquí (http://msdn2.microsoft.com/en-us/library/bb897399.aspx) blog de Heather Solomon y aquí (http://www.heathersolomon.com/blog/articles/CustomItemStyle.aspx).
Tuercas y pernos
Iniciar y ejecutar pasos del uno al cinco, según la documentación de MSDN y artículo de Heather Solomon.
En este punto, ha agregado su CQWP a la página y tienes tu <CommonViewFields> configurado según sea necesario.
Siguiendo los pasos habituales, Estos resultados intermedios:
1. Crear un tipo de contenido, una lista personalizada templatized para ese tipo de contenido y dos sitios. Aquí es el tipo de contenido:
Aquí está la estructura del sitio:
2. Añadir el CQWP después de crear mi proyecto subsitios y singleton listas Resumen proyecto:
3. Añadir toda la información adicional que quiero mediante la <CommonViewFields>:
<propiedad nombre="CommonViewFields" tipo="cadena">Project_x0020_Name;Project_x0020_Expenses;Project_x0020_Status;Project_x0020_Start_x0020_Date;Project_x0020_End_x0020_Date;Project_x0020_Budget</propiedad>
Tenga en cuenta que tenía que guardar todos los campos de propiedad sobre una línea o no funcionaría. (CQWP me diría que la consulta no devuelva ningún elemento).
4. En este punto, Estamos listos para ir más allá del artículo de MSDN y tirón en sobre artículo de Heather Solomon. Seguir sus pasos a partir de cerca de paso #5 para crear una personalizada / unghosted versión de ItemStyle.xsl. Sigo el Consejo de Heather, a través de paso 11 a estos resultados intermedios:
4.1: Nombre mi Plantilla XSL como sigue:
<XSL:nombre de la plantilla = "Grid" fósforo = "fila[@Style = 'Red']" modo = "itemEstilo">
También ligeramente le sugirió modificar <XSL:para cada …> mediante la adición de un <BR /> etiqueta para proporcionar un listado limpiador:
<XSL:para cada Seleccione="@*">
P:<XSL:valor de Seleccione="nombre()" /><BR/>
</XSL:para cada>
4.2: Modificar el elemento web, ir a la apariencia y seleccione mi Grid"" estilo:
Aplicar el cambio y aquí está el resultado:
De lo anterior podemos ver que los campos que queremos (Nombre del proyecto, gasto, estado, etc.) están disponibles para nosotros cuando emitimos el HTML. No sólo, pero vemos los nombres por los cuales debemos referencia esas columnas en el XSL. Por ejemplo, referenciamos el estatus del proyecto como "Project_x005F_x0020_Name".
En este punto, Partimos del blog de Heather y de los hombros de los gigantes, Añadir mi propia poco.
ContentQueryMain.xsl
NOTA: Cuando haga cambios a tanto ContentQueryMain.xsl como ItemStyle.xsl, es necesario comprobar que los archivos vuelve a antes de usted ver el efecto de los cambios.
Para fines de fabricación de rejilla, MOSS utiliza dos diferentes archivos XSL para generar los resultados que vemos de un CQWP. Para generar el bit anterior de salida, modificamos el ItemStyle.xsl. MOSS utiliza otro archivo XSL, ContentQueryMain.xsl a en conjunto con el ItemStyle.xsl para generar código HTML. Como su nombre lo indica, ContentQueryMain.xsl es el principal"" XSL que controla el flujo general de traducción. Recorre en iteración todos los elementos encontrados y los pasa uno a uno a plantillas en ItemStyle.xsl. Modificaremos el ItemStyle.xsl para generar la apertura <mesa> etiqueta antes de emitir la primera fila de datos y el cierre <mesa> etiqueta después de la emisión de la última fila. Para lograr esto, ContentQueryMain.xsl modificado para pasar dos parámetros a nuestra red"" plantilla de ItemStyle.xsl, "última fila" y "fila actual". ItemStyle.xsl usa estos para emitir condicionalmente las etiquetas necesarias.
Utilizando la técnica de Heather Solomon, que busque ContentQueryMain.xsl. Se encuentra en el mismo lugar que el ItemStyle.xsl. Esta captura de pantalla debe ayudar a:
Tenemos que hacer los siguientes cambios:
- Modificar una plantilla xsl, "CallItemTemplate" que realmente invoca nuestra plantilla cuadrícula en ItemStyle.xsl. Pasaremos dos parámetros a la plantilla de cuadrícula por lo que tendrán los datos que necesita para generar condicional de apertura y cierre <mesa> Etiquetas.
- Modificar otro poco de ContentQueryMain.xsl que se llama el "CallItemTemplate" pasar un "LastRow" parámetro así LastRow puede transmitirse a nuestra plantilla de cuadrícula.
Ubique la plantilla llamada "OuterTemplate.CallItemTemplate" identificada por la cadena:
<XSL:plantilla nombre="OuterTemplate.CallItemTemplate">
Vuelva a colocar la plantilla entera como sigue:
|
|
<XSL:plantilla nombre="OuterTemplate.CallItemTemplate">
<XSL:param nombre="CurPosition" />
<!--
Añadir el "LastRow" parámetro.
Sólo la usamos cuando el elemento style pase en "Grid".
-->
<XSL:param nombre="LastRow" />
<XSL:Elija>
<XSL:Cuando prueba="@Style = 'NewsRollUpItem'">
<XSL:Aplique-plantillas Seleccione="." modo="itemEstilo">
<XSL:con-param nombre="EditMode" Seleccione="$cbq_iseditmode" />
</XSL:Aplique-plantillas>
</XSL:Cuando>
<XSL:Cuando prueba="@Style = 'NewsBigItem'">
<XSL:Aplique-plantillas Seleccione="." modo="itemEstilo">
<XSL:con-param nombre="CurPos" Seleccione="$CurPosition" />
</XSL:Aplique-plantillas>
</XSL:Cuando>
<XSL:Cuando prueba="@Style = 'NewsCategoryItem'">
<XSL:Aplique-plantillas Seleccione="." modo="itemEstilo">
<XSL:con-param nombre="CurPos" Seleccione="$CurPosition" />
</XSL:Aplique-plantillas>
</XSL:Cuando>
<!--
Pasar la posición actual y lastrow a la plantilla de itemstyle.xsl de red.
ItemStyle.xsl que va a utilizar para emitir al aire libre y cierre <mesa> Etiquetas.
-->
<XSL:Cuando prueba="@Style = 'Grid'">
<XSL:Aplique-plantillas Seleccione="." modo="itemEstilo">
<XSL:con-param nombre="CurPos" Seleccione="$CurPosition" />
<XSL:con-param nombre="Duran" Seleccione="$LastRow" />
</XSL:Aplique-plantillas>
</XSL:Cuando>
<XSL:de lo contrario>
<XSL:Aplique-plantillas Seleccione="." modo="itemEstilo">
</XSL:Aplique-plantillas>
</XSL:de lo contrario>
</XSL:Elija>
</XSL:plantilla>
|
Los comentarios describen el propósito de los cambios.
Claro, el "OuterTemplate.CallItemTemplate" se llama sí mismo de otra plantilla. Localice esa plantilla buscando esta cadena de texto:
<XSL:plantilla nombre="OuterTemplate.Body">
Desplazarse por las instrucciones en OuterTemplate.Body e introduzca el parámetro LastRow como sigue (se muestra como un comentario en cursiva):
<XSL:plantilla de llamada nombre="OuterTemplate.CallItemTemplate">
<XSL:con-param nombre="CurPosition" Seleccione="$CurPosition" />
<!-- Inserta el parámetro LastRow. -->
<XSL:con-param nombre="LastRow" Seleccione="$LastRow"/>
</XSL:plantilla de llamada>
Después de todo esto, por fin tenemos cosas configuradas correctamente para que nuestro ItemStyle.xsl puede emitir <mesa> Etiquetas en el lugar correcto.
ItemStyle.Xsl
NOTA: Nuevo, Check-in ItemStyle.xsl después de hacer los cambios para que veas el efecto de esos cambios.
Aquí tenemos dos tareas:
- Reemplazar toda la plantilla de cuadrícula. Usted puede copiar/pegar desde abajo.
- Añadir algunos mumbo jumbo fuera de la definición de plantilla que permite "formatcurrency" plantilla para trabajo. (Sabes que tengo una manija tenue XSL).
Primero, cerca de la parte superior de ItemStyle.xsl, Añadir la siguiente línea:
<!-- Algunas tonterías que permite mostrar los E.E.U.U.. moneda. -->
<XSL:formato decimal nombre="personal" dígito="D" />
<XSL:plantilla nombre="Por defecto" partido="*" modo="itemEstilo">
Nota que agregué directamente antes del <XSL:nombre de la plantilla = "Default" …> definición.
Siguiente, volver a nuestra plantilla de cuadrícula. Reemplazar toda la plantilla de cuadrícula con el código siguiente. Fondo es comentó, pero no dudes en escribirme o dejar comentarios en mi blog si tienes preguntas.
|
|
<XSL:plantilla nombre="Red" partido="Fila de[@Style = 'Grid']" modo="itemEstilo">
<!--
ContentMain.xsl pasa CurPos y último.
Utilizamos estos emitir condicionalmente el abierto y cierre <mesa> Etiquetas.
-->
<XSL:param nombre="CurPos" />
<XSL:param nombre="Duran" />
<!-- Las siguientes variables son sin modificar desde el ItemStyle.xsl estándar -->
<XSL:variable nombre="SafeImageUrl">
<XSL:plantilla de llamada nombre="OuterTemplate.GetSafeStaticUrl">
<XSL:con-param nombre="UrlColumnName" Seleccione="'ImageUrl'"/>
</XSL:plantilla de llamada>
</XSL:variable>
<XSL:variable nombre="SafeLinkUrl">
<XSL:plantilla de llamada nombre="OuterTemplate.GetSafeLink">
<XSL:con-param nombre="UrlColumnName" Seleccione="'LinkUrl'"/>
</XSL:plantilla de llamada>
</XSL:variable>
<XSL:variable nombre="DisplayTitle">
<XSL:plantilla de llamada nombre="OuterTemplate.GetTitle">
<XSL:con-param nombre="Título" Seleccione="@Title"/>
<XSL:con-param nombre="UrlColumnName" Seleccione="'LinkUrl'"/>
</XSL:plantilla de llamada>
</XSL:variable>
<XSL:variable nombre="LinkTarget">
<XSL:Si prueba="@OpenInNewWindow = 'True'" >_blank</XSL:Si>
</XSL:variable>
<!--
Aquí definimos una variable, "tableStart". Contiene el código HTML que usamos para definir la apertura de la mesa, así como las etiquetas de columna. Tenga en cuenta que si CurPos = 1, incluye el código HTML en una etiqueta CDATA.
De lo contrario, estará vacía.
El valor de tableStart es emitidos cada vez ItemStyle se llama a través de ContentQueryMain.xsl.
-->
<XSL:variable nombre="tableStart">
<XSL:Si prueba="$CurPos = 1">
<![CDATA[
<frontera de tabla = 1>
<TR bgcolor = "blue">
<TD><color de fuente = "blanco"><b>Nombre del proyecto</b></fuente></TD>
<TD align = "right"><color de fuente = "blanco"><b>Fecha completa</b></fuente></TD>
<TD align = "right"><color de fuente = "blanco"><b>Presupuesto</b></fuente></TD>
<TD align = "right"><color de fuente = "blanco"><b>Gasto real</b></fuente></TD>
<TD><color de fuente = "blanco"><b>Estado general</b></fuente></TD>
</TR>
]]>
</XSL:Si>
</XSL:variable>
<!--
Otra variable, tableEnd simplemente define el cierre etiqueta de mesa.
Como con tableStart, siempre es sido emitida. Por esta razón se asigna su valor condicional en base a si nos hemos pasados la última fila por ContentQueryMain.xsl.
-->
<XSL:variable nombre="tableEnd">
<XSL:Si prueba="$CurPos = $Last">
<![CDATA[ </mesa> ]]>
</XSL:Si>
</XSL:variable>
<!--
Emitir siempre el contenido de tableStart. Si no se trata de la primera fila pasada a nosotros por ContentQueryMain.xsl, entonces sabemos que su valor estará en blanco.
Desactivar el escape porque cuando tableStart no en blanco, incluye HTML real que queremos que el navegador procesa. Si no decimos el analizador XSL para desactivar la salida de escape, se van a generar cosas como"<mesa>" en vez de"<mesa>".
-->
<XSL:valor de Seleccione="$tableStart" Disable-output-escaping="Sí"/>
<TR>
<!--
P:Project_x005F_x0020_Name P:Project_x005F_x0020_End_x005F_x0020_Date P:Project_x005F_x0020_Budget P:Project_x005F_x0020_Expenses P:Project_x005F_x0020_Status
-->
<TD>
<XSL:valor de Seleccione="@Project_x005F_x0020_Name"/>
</TD>
<TD alinear="derecho">
<XSL:valor de Seleccione="@Project_x005F_x0020_End_x005F_x0020_Date"/>
</TD>
<TD alinear="derecho">
<XSL:plantilla de llamada nombre="FormatCurrency">
<XSL:con-param nombre="valor"
Seleccione="@Project_x005F_x0020_Budget"></XSL:con-param>
</XSL:plantilla de llamada>
</TD>
<TD alinear="derecho">
<XSL:plantilla de llamada nombre="FormatCurrency">
<XSL:con-param nombre="valor" Seleccione="@Project_x005F_x0020_Expenses">
</XSL:con-param>
</XSL:plantilla de llamada>
</TD>
<TD>
<XSL:valor de Seleccione="@Project_x005F_x0020_Status"/>
</TD>
<!--
Lo siguiente es comentada para clarificar las cosas.
Sin embargo, traerlo de vuelta y todo eso en un <TD> para ver su efecto.
-->
<!--
<div id = "linkitem" class = "item">
<XSL:Si la prueba = "string-length($SafeImageUrl) != 0 ">
<div class = "imagen-área-left">
<a href = "{$SafeLinkUrl}" target = "{$LinkTarget}">
<IMG class = "imagen-ancho fijo" src = "{$SafeImageUrl}"
Alt = "{@ImageUrlAltText}"/>
</un>
</div>
</XSL:Si>
<div clase = "elemento de enlace">
<XSL:plantilla de llamada
Name="OuterTemplate.CallPresenceStatusIconTemplate"/>
<a href = "{$SafeLinkUrl}"
target = "{$LinkTarget}" title = "{@LinkToolTip}">
<XSL:valor de select = "$DispXSLTitle" />
</un>
<div class = "description">
<XSL:valor de select="@Description" />
</div>
</div>
</div>
-->
</TR>
<!--
Emiten el cierre etiqueta de mesa. Si no estamos en la última fila,
Esto será en blanco.
-->
<XSL:valor de Seleccione="$tableEnd" Disable-output-escaping="Sí"/>
</XSL:plantilla>
<XSL:plantilla nombre="FormatCurrency">
<XSL:param nombre="valor" Seleccione="0" />
<XSL:valor de Seleccione='formato de número($valor, "$DDD,DDD,DDD.DD", "el personal")' />
</XSL:plantilla>
|
