Arxius de la categoria: Desenvolupament de SharePoint

Aneu amb compte amb trencant canvis a ItemStyle.xsl

Jo estava treballant amb ItemStyle.xsl per personalitzar l'aspecte d'un contingut consulta Web Part i dret sobre l'hora de dinar, Vaig fer un salt canviar a el xsl. No m'adonava, però això tenia de llarg abast efectes tota la col·lecció de llocs. Vaig marxar a dinar i al meu retorn, notat aquest missatge que apareixen en un grapat de llocs:

No es pot visualitzar aquest element Web. Per solucionar el problema, Obriu aquesta pàgina en un editor HTML compatible amb el Windows SharePoint serveis com ara Microsoft Office SharePoint Designer. Si el problema persisteix, contactar amb l'administrador del servidor Web.

Em va culpar el client (sense adonar-se que encara que era culpa meva en aquest punt) però finalment adonat que intellisense visual studio va advertir-me que tenia mal XSL. He corregit i tot comença a treballar.

Ser sargit cura quan es treballa amb ItemStyle.xsl (i qualsevol dels fitxers XSL globals) — trencant-los afecta molts artefactes en la col·lecció de llocs.

<final />

Mostrar els resultats de Part de webs de consulta contingut en una quadrícula / Taula

Descripció i objectiu

Fora de la caixa, MOSS’ Part de Web de consulta de contingut (CQWP) Visualitza els seus resultats en format llista, similar als resultats de cerca. També és possible mostrar els resultats en un format de quadrícula (i. e. Format de la taula HTML). Quadrícula formats són millors en algunes circumstàncies. Es descriu com aconseguir aquell efecte en aquest article.

Escenari de negocis

He treballat amb un client en un desplegament de molsa àmplia d'empresa. Hem dissenyat la seva taxonomia tal que projectes són ciutadans de primera classe en la jerarquia i tenir el seu propi lloc de nivell superior. Gestors de projectes mantenir una llista de singleton d'informació resum projecte, com el títol, pressupost, data de finalització prevista, pressupost restant i altres camps de tipus de resum. Per "singleton" Em refereixo a una llista del SharePoint personalitzat garanteix que contenen només un element. Elementalment, s'assembla a això:

imatge

L'aproximació tècnica és molt similar a com es descriu aquí (http://paulgalvin.spaces.live.com/blog/cns!1CC1EDB3DAA9B8AA!447.entry). El CQWP utilitza una transformació XSL per emetre HTML per al navegador per representar.

Sempre imaginar el resultat abans de capbussar-se en l'XSL perquè XSL és un malson. Aquí és el meu resultat desitjat:

imatge

Genera HTML com aquest que resulten:

<HTML>
 <cos>
 <Centre>
 <taula frontera= 1>

<!-- Etiquetes->
 <tr BGCOLOR= blau>
 <TD><tipus de lletra color= blanc><b>Nom del projecte</b></tipus de lletra></TD>
 <TD Alineació= dreta><tipus de lletra color= blanc><b>Data completa</b></tipus de lletra></TD>
 <TD Alineació= dreta><tipus de lletra color= blanc><b>Pressupost</b></tipus de lletra></TD>
 <TD Alineació= dreta><tipus de lletra color= blanc><b>Despesa real</b></tipus de lletra></TD>
 <TD><tipus de lletra color= blanc><b>Global Status</b></tipus de lletra></TD>
 </tr>

<tr>
 <TD>Re-filferro aules d'informàtica.</TD>
 <TD Alineació= dreta>02/01/08</TD>
 <TD Alineació= dreta>22,500.00</TD>
 <TD Alineació= dreta>19,000.00</TD>
 <TD>En curs</TD>
 </tr>

<tr>
 <TD>Servidors de provisió per a rampa de SQL</TD>
 <TD Alineació= dreta>04/01/08</TD>
 <TD Alineació= dreta>7,500.00</TD>
 <TD Alineació= dreta>0.00</TD>
 <TD>Previst</TD>
 </tr>

</taula>
 </Centre>
 </cos>
</HTML>

Enfocament

Seguiu aquests passos per crear la graella:

  1. Identificar els components de la quadrícula (files o columnes).
  2. Definir i crear columnes necessàries.
  3. Crear subllocs per les llistes de singleton i projectes.
  4. Afegir la CQWP a una pàgina web i configurar-lo per buscar les llistes.
  5. Modificar XML del CQWP per recollir les columnes addicionals.
  6. Modificar l'XSL per generar una taula.

Vaig a concentrar-se en nombre de sis. Números a través de quatre són directament endavant i una cosa que qualsevol usuari CQWP ha fet ja. Número cinc ha estat documentada per altres incloent-hi aquest exhaustiu article carregat de captura de pantalla des de MSDN aquí (http://msdn2.microsoft.com/en-us/library/bb897399.aspx) i el blog de Heather Solomon aquí (http://www.heathersolomon.com/blog/articles/CustomItemStyle.aspx).

Nous i baldes

Iniciar i implementar passos Uno a cinc segons la documentació de MSDN i article de Heather Solomon.

En aquest punt, li he afegit el seu CQWP a la pàgina i teniu el seu <CommonViewFields> configurat segons calgui.

Seguint els passos habituals, Puc obtenir aquests resultats intermedis:

1. Crear un tipus de contingut, una llista amb plantilla personalitzada per a aquest tipus de contingut i dos llocs. Aquí és el tipus de contingut:

imatge

Aquí és l'estructura del lloc:

imatge

2. Afegir el CQWP després de crear el meu projecte subllocs i solitàries llistes resum projecte:

imatge

3. Afegir tota la informació addicional que vol mitjançant la <CommonViewFields>:

        <propietat nom="CommonViewFields" tipus="corda">Project_x0020_Name;Project_x0020_Expenses;Project_x0020_Status;Project_x0020_Start_x0020_Date;Project_x0020_End_x0020_Date;Project_x0020_Budget</propietat>

Tingueu en compte que havia de mantenir tots els camps de propietat sobre una línia o no anava a funcionar (CQWP vols dir-me que la consulta ha tornat cap element).

4. En aquest punt, estem preparats per anar més enllà de l'article MSDN i Ditada a sobre a l'article de Heather Solomon. Seguir els seus passos començant a prop pas #5 per crear una mida / versió unghosted de ItemStyle.xsl. Vaig seguir el Consell de Heather, amunt a través del pas 11 i aconseguir aquests resultats intermedis:

4.1: Nom de la meva plantilla XSL com segueix:

<XSL:nom de la plantilla = "malla" partit = "fila[@Style = 'Grid']" el mode = "itemstyle">

També lleugerament modificar li va suggerir <XSL:per a cada …> afegint un <br /> etiqueta per proporcionar una llista netejador:

    <XSL:per a cada Selecciona="@*">
      P:<XSL:valor de Selecciona="nom()" /><BR/>
    </XSL:per a cada>

4.2: Puc modificar l'element web, Aneu a aparença i seleccioneu meu "malla" estil:

imatge

Aplicar el canvi i aquí està el resultat:

imatge

Podem veure des de l'anterior que els camps que volem (Nom del projecte, despesa, l'estat, etc) estan disponibles per a nosaltres utilitzar quan vam emetre l'HTML. No només allò, però veiem els noms pel qual ens ha de fer referència a les columnes a l'XSL. Per exemple, Situació del projecte ens de referència com "Project_x005F_x0020_Name".

En aquest punt, Sortim des del blog de Heather i de les espatlles d'aquests gegants, Afegeixo la meva pròpia una mica.

ContentQueryMain.xsl

NOTA: Quan fent canvis en tant ContentQueryMain.xsl com ItemStyle.xsl, necessita comprovar que aquells arxius de tornada a abans de veure l'efecte dels canvis.

Finalitats preparar quadrícula, MOLSA utilitza dos diferents als fitxers XSL per produir els resultats que podem veure des d'un CQWP. Generar l'anterior bits de sortida, hem modificat ItemStyle.xsl. MOLSA de fet utilitza un altre fitxer XSL, ContentQueryMain.xsl a conjuntament amb ItemStyle.xsl per generar el seu HTML. Com el nom implica, ContentQueryMain.xsl és el principal"" XSL que controla el flux global de traducció. Itera a través de tots els elements trobats i passa-los un per un per plantilles en ItemStyle.xsl. Anem a modificar ItemStyle.xsl per generar l'obert <taula> l'etiqueta abans que emet la primera fila de dades i el tancament <taula> etiqueta després que emet l'última fila. Per aconseguir això, ContentQueryMain.xsl és modificat per passar dos paràmetres al nostre "graella" plantilla de ItemStyle.xsl, "última fila" i "la fila actual". ItemStyle.xsl usa condicionalment emeten les etiquetes necessàries per a.

Tècnica de Heather Solomon, vam localitzar ContentQueryMain.xsl. Es troba en el mateix lloc com ItemStyle.xsl. Aquesta captura de pantalla ha d'ajudar:

imatge

Cal fer els següents canvis:

  • Modificar una plantilla xsl, "CallItemTemplate" fet que invoca nostra plantilla quadrícula en ItemStyle.xsl. Passarem dos paràmetres a la plantilla de quadrícula per tal que tindrà les dades que necessita per generar condicionalment obertura i tancament <taula> Etiquetes.
  • Modificar un altre poc de ContentQueryMain.xsl que crida la CallItemTemplate"" passar-lo un «LastRow" paràmetre així que LastRow podran ser cedides a la nostra plantilla de quadrícula.

Localitzar la plantilla anomenat "OuterTemplate.CallItemTemplate" identificat per la corda:

  <XSL:plantilla nom="OuterTemplate.CallItemTemplate">

Substitueix la plantilla sencera com segueix:

  <XSL:plantilla nom="OuterTemplate.CallItemTemplate">
    <XSL:Param nom="CurPosition" />

    <!--
      Afegir la LastRow"" paràmetre.
      Només l'utilitzem quan és l'element estil pas a "Malla".
    -->
    <XSL:Param nom="LastRow" />

    <XSL:triar>
      <XSL:Quan prova="@Style = "NewsRollUpItem"">
        <XSL:aplicar-plantilles Selecciona="." mode de="itemstyle">
          <XSL:amb-param nom="EditMode" Selecciona="$cbq_iseditmode" />
        </XSL:aplicar-plantilles>
      </XSL:Quan>
      <XSL:Quan prova="@Style = "NewsBigItem"">
        <XSL:aplicar-plantilles Selecciona="." mode de="itemstyle">
          <XSL:amb-param nom="CurPos" Selecciona="$CurPosition" />
        </XSL:aplicar-plantilles>
      </XSL:Quan>
      <XSL:Quan prova="@Style = "NewsCategoryItem"">
        <XSL:aplicar-plantilles Selecciona="." mode de="itemstyle">
          <XSL:amb-param nom="CurPos" Selecciona="$CurPosition" />
        </XSL:aplicar-plantilles>
      </XSL:Quan>

      <!--
              Passar la posició actual i lastrow a la plantilla de quadrícula itemstyle.xsl.
              ItemStyle.xsl que utilitzarà per emetre l'obertura i tancament <taula> Etiquetes.
      -->
      <XSL:Quan prova="@Style = 'Grid'">
        <XSL:aplicar-plantilles Selecciona="." mode de="itemstyle">
          <XSL:amb-param nom="CurPos" Selecciona="$CurPosition" />
          <XSL:amb-param nom="Darrera" Selecciona="$LastRow" />
        </XSL:aplicar-plantilles>
      </XSL:Quan>

      <XSL:en cas contrari>
        <XSL:aplicar-plantilles Selecciona="." mode de="itemstyle">
        </XSL:aplicar-plantilles>
      </XSL:en cas contrari>
    </XSL:triar>
  </XSL:plantilla>

El comentari descriu el propòsit dels canvis.

Clar, la OuterTemplate.CallItemTemplate"" mateix es diu d'una altra plantilla. Localitzar aquesta plantilla per a la recerca d'aquesta cadena de text:

<XSL:plantilla nom="OuterTemplate.Body">

Mogui's a través de les instruccions a OuterTemplate.Body i introduïu el paràmetre LastRow com segueix (mostrat com un comentari en cursiva):

<XSL:crida-plantilla nom="OuterTemplate.CallItemTemplate">
  <XSL:amb-param nom="CurPosition" Selecciona="$CurPosition" />
  <!-- Insereix el paràmetre LastRow. -->
  <XSL:amb-param nom="LastRow" Selecciona="$LastRow"/>
</XSL:crida-plantilla>

Després de tot això, Finalment tenim coses configurat correctament per tal que els nostres ItemStyle.xsl poden emetre <taula> Etiquetes al lloc correcte.

ItemStyle.Xsl

NOTA: Una altra vegada, comprovar a ItemStyle.xsl després de fer alguns canvis per tal que veieu l'efecte dels canvis.

Tenim dues tasques aquí:

  • Substitueix la plantilla sencera de quadrícula. Es pot copiar i enganxar des de baix.
  • Afegir alguns Superxeries fora de la definició de la plantilla que permet "formatcurrency" plantilla per treballar. (Es pot dir que jo tinc un mànec tènue amb XSL).

Primer, a prop de la part superior de ItemStyle.xsl, Afegiu aquesta línia:

  <!-- Alguns Superxeries que permet mostrar u. moneda. -->
  <XSL:format de decimals nom="personal" dígit="D" />

  <XSL:plantilla nom="Per defecte" Partit="*" mode de="itemstyle">

Nota que vaig afegir-lo directament abans del <XSL:nom de la plantilla = "per defecte" …> definició.

Següent, tornar a la nostra plantilla de quadrícula. Substitueix la plantilla quadrícula tot el codi de sota. Fons és comentar, però no dubti en enviar per email o deixar comentaris en el meu blog si té preguntes.

  <XSL:plantilla nom="Quadrícula" Partit="Fila[@Style = 'Grid']" mode de="itemstyle">

    <!--
      ContentMain.xsl passa CurPos i últim.
      Utilitzem aquests per emetre condicionalment l'obertura i tancament <taula> Etiquetes.
    -->
    <XSL:Param nom="CurPos" />
    <XSL:Param nom="Darrera" />

    <!-- Les següents variables són inmodificada des de l'estàndard ItemStyle.xsl -->
    <XSL:variable nom="SafeImageUrl">
      <XSL:crida-plantilla nom="OuterTemplate.GetSafeStaticUrl">
        <XSL:amb-param nom="UrlColumnName" Selecciona="'ImageUrl'"/>
      </XSL:crida-plantilla>
    </XSL:variable>
    <XSL:variable nom="SafeLinkUrl">
      <XSL:crida-plantilla nom="OuterTemplate.GetSafeLink">
        <XSL:amb-param nom="UrlColumnName" Selecciona="'LinkUrl'"/>
      </XSL:crida-plantilla>
    </XSL:variable>
    <XSL:variable nom="DisplayTitle">
      <XSL:crida-plantilla nom="OuterTemplate.GetTitle">
        <XSL:amb-param nom="Títol" Selecciona="@Title"/>
        <XSL:amb-param nom="UrlColumnName" Selecciona="'LinkUrl'"/>
      </XSL:crida-plantilla>
    </XSL:variable>
    <XSL:variable nom="LinkTarget">
      <XSL:Si prova="@OpenInNewWindow = "True"" >blank</XSL:Si>
    </XSL:variable>

    <!--
      Aquí definim una variable, "tableStart".  Conté el codi HTML que utilitzem per definir l'obertura de la taula, així com les etiquetes de columna.  Tingueu en compte que si CurPos = 1, inclou l'HTML en una etiqueta CDATA.
      En cas contrari, es buida.

      El valor de tableStart és emited cada vegada que s'anomena ItemStyle mitjançant ContentQueryMain.xsl.
    -->
    <XSL:variable nom="tableStart">
      <XSL:Si prova="$CurPos = 1">
        <![CDATA[
        <frontera taula = 1>
          <tr bgcolor = "blau">
            <TD><color de la lletra = "blanc"><b>Nom del projecte</b></tipus de lletra></TD>
            <alinear TD = "dret"><color de la lletra = "blanc"><b>Data completa</b></tipus de lletra></TD>
            <alinear TD = "dret"><color de la lletra = "blanc"><b>Pressupost</b></tipus de lletra></TD>
            <alinear TD = "dret"><color de la lletra = "blanc"><b>Despesa real</b></tipus de lletra></TD>
            <TD><color de la lletra = "blanc"><b>Global Status</b></tipus de lletra></TD>
          </tr>
        ]]>
      </XSL:Si>
    </XSL:variable>

    <!--
      Una altra variable, tableEnd simplement defineix el tancament etiqueta de taula.

      Com amb tableStart, sempre és emited.  Per això el seu valor s'assigna condicionalment en funció de si ens hem passat l'última fila per ContentQueryMain.xsl.
    -->
    <XSL:variable nom="tableEnd">
      <XSL:Si prova="$CurPos = $Last">
        <![CDATA[ </taula> ]]>
      </XSL:Si>
    </XSL:variable>

    <!--
      Emeten sempre el contingut de tableStart.  Si això no és la primera fila va passar a nosaltres per ContentQueryMain.xsl, a continuació, sabem que el seu valor serà en blanc.

      Impossibilitar sortida escapant perquè quan tableStart-lo no en blanc, inclou HTML real que volem representar el navegador.  Si no diem l'analitzador XSL impossibilitar sortida escapar, generarà coses com"&lt;taula&gt;" en comptes de"<taula>".
    -->
    <XSL:valor de Selecciona="$tableStart" impossibilitar-sortida-escapar=""/>


    <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 Selecciona="@Project_x005F_x0020_Name"/>
      </TD>

      <TD Alineació="dret">
        <XSL:valor de Selecciona="@Project_x005F_x0020_End_x005F_x0020_Date"/>
      </TD>

      <TD Alineació="dret">
        <XSL:crida-plantilla nom="formatcurrency">
          <XSL:amb-param nom="valor" 
Selecciona="@Project_x005F_x0020_Budget"></XSL:amb-param> </XSL:crida-plantilla> </TD> <TD Alineació="dret"> <XSL:crida-plantilla nom="formatcurrency"> <XSL:amb-param nom="valor" Selecciona="@Project_x005F_x0020_Expenses">
</XSL:amb-param> </XSL:crida-plantilla> </TD> <TD> <XSL:valor de Selecciona="@Project_x005F_x0020_Status"/> </TD> <!-- Tots els següents és comentar fora per aclarir les coses. No obstant això, portar-lo i ficar-lo en un <TD> per veure el seu efecte. --> <!-- <div id = "linkitem" Class = "element"> <XSL:si prova = "corda de longitud($SafeImageUrl) != 0"> <div class = "imatge-zona-esquerra"> <un href = "{$SafeLinkUrl}" objectiu = "{$LinkTarget}"> <classe d'img = "imatge-amplada fixa" src = "{$SafeImageUrl}"
alt = "{@ImageUrlAltText}"/> </un> </Div> </XSL:Si> <classe div = "enllaç element"> <XSL:crida-plantilla
Name="OuterTemplate.CallPresenceStatusIconTemplate"/> <un href = "{$SafeLinkUrl}"
objectiu = "{$LinkTarget}" títol = "{@LinkToolTip}"> <XSL:valor de seleccionar = "$DisXSLyTitle" /> </un> <div class = "Descripció"> <XSL:valor de select="@Description" /> </Div> </Div> </Div>
--> </tr> <!-- Emeten el tancament etiqueta de taula. Si no estem a l'última fila, això serà en blanc. --> <XSL:valor de Selecciona="$tableEnd" impossibilitar-sortida-escapar=""/> </XSL:plantilla> <XSL:plantilla nom="formatcurrency"> <XSL:Param nom="valor" Selecciona="0" /> <XSL:valor de Selecciona='format de nombre($valor, "$DDD,DDD,DDD.DD", "personal")' /> </XSL:plantilla>

Entrada de dades WSS/molsa estàndard pantalles no són compatibles en cascada de llistes desplegables (o altre intra-de la comunicació)

ACTUALITZACIÓ (04/2008): Aquesta entrada del bloc gran Mostra un bon javascript basaven enfocament a aquest problema: http://webborg.blogspot.com/2008/04/add-functions-and-events-to-sharepoint.html

ACTUALITZACIÓ II: (04/2008): Aquesta entrada del blog es veu prometedor, així: http://www.cleverworkarounds.com/2008/03/13/free-mosswss-2007-web-part-hide-controls-via-javascript/

Diverses vegades a la setmana, Si no diàriament, els usuaris del Fòrum descriure un requisit que normalment vols ser satisfetes mitjançant llistes desplegables en cascada. Per exemple, Tinc dos controls de llista desplegable:

  • Llista d'u. Units
  • Llista d'u. Ciutats.

Com a proveïdors d'interfície d'usuari responsables, Volem operar com aquest:

  • Paul selecciona un nord-americà. estat de la llista desplegable.
  • Això fa que les ciutats desplegables per filtrar només aquelles ciutats que pertanyen a l'estat seleccionat.
  • Paul selecciona una ciutat a aquesta llista filtrada.

No hi ha cap suport de fora-de-the-box per a aquesta funció. De fet, no hi ha cap suport OOB per a qualsevol tipus de comunicació intra-forma directa. Això inclou programàticament amagar/activar/desactivar camps en resposta als canvis de camp en altres llocs al formulari.

L'objectiu real d'aquest article a descriure possibles solucions i aquestes són les opcions com sé que ells:

  1. Desenvolupar un tipus de columna personalitzat. Com a costum-columna-desenvolupador, vostè té control total sobre el món"" d'aquesta columna personalitzat. Pot implementar un caient desplegable d'aquesta manera.
  2. Considerar l'ús del flux de treball. En alguns casos, voleu assignar automàticament un valor de camp basat en valor de un altre camp. En aquest cas, vols normalment intenta utilitzar una columna calculada, però algunes vegades, -no fer la feina. Flux de treball de SharePoint Designer és una alternativa relativament administrar amistós a precipiten cap codi i visual studio. Si vas aquesta ruta, ser conscient de la qüestió pel Aquest article (http://paulgalvin.spaces.live.com/blog/cns!CC1EDB3DAA9B8AA!405.entry).
  3. Controladors d'incidències: Com un flux de treball, Això és una solució després-el-fet. El controlador d'incidències és un assemblat .NET (C#, VB.NET) al qual SharePoint passa control. L'objecte que es desenvolupar té accés a les dades de la llista (i el model d'objecte sencer) i pot fer qualsevol càlcul necessari.
  4. Utilitza el SharePoint Designer per crear formularis personalitzats d'entrada. No tinc experiència directa amb aquest enfocament, but I hear they are doing good things with NewForm.aspx these days 🙂
  5. Rodar el seu propi funció d'entrada de dades de l'ASP.NET (com una pàgina web autònom o com a un element web) i l'ús que en canvi.

Si algú sap altres i/o millors opcions, Si us plau enviar un comentari i vaig a actualitzar el cos d'aquest post.

<final />

Etiquetas de Technorati:

Creï gràfics de barres en SharePoint

Visió de conjunt:

(ACTUALITZACIÓ 12/04/07: Afegit un altre recurs interessant al final vinculació a un altre bloc que tracta això mitjançant un element web molt interessant)

Aquesta entrada del bloc descriu com crear un gràfic de barres en SharePoint. Això funciona en entorns WSS tant MOSS com només depen el element web de visualització de dades.

El plantejament general és la següent:

  1. Crear una llista o biblioteca de documents que conté les dades que voleu gràfic.
  2. Lloc a la biblioteca de documents associats / costum llista a una pàgina i convertir-lo en un element web de visualització de dades (DVWP).
  3. Modificar l'XSL de la DVWP per generar el codi HTML perquè et mostra com un gràfic.

Escenari de negocis / Programa d'instal·lació:

He creat una llista personalitzada amb la columna de títol estàndard i una columna addicional, "Estat". Aquest model (elementalment molt) un "autorització de despesa" escenari on el títol representa el projecte i l'estat un valor de la llista de:

  • Proposat
  • En procés
  • Aturat

L'objectiu és produir un gràfic de barres horitzontal interactiva que Mostra aquests codis d'estat.

Han poblat la llista i s'assembla a això:

imatge

Crear l'element Web de visualització de dades:

Crear el DVWP, afegint la llista personalitzada a una pàgina (pàgina del lloc en el meu cas) i seguiu les instruccions aquí (http://paulgalvin.spaces.live.com/blog/cns!1CC1EDB3DAA9B8AA!395.entry).

A més de simplement crear el DVWP, També cal definir la propietat de paginació per mostrar totes les files disponibles. Per a mi, Això es veu alguna cosa com això:

imatge

En aquest punt, Sempre tanco SPD i el navegador. Jo llavors tornar a obrir la pàgina utilitzant el navegador. Això evita accidentalment mucking fins al disseny de part de web a la pàgina.

Modificar el XSLT:

Ara és el moment de modificar l'XSLT.

Sempre utilitzo visual studio per a això. (Veure aquí per a una nota important sobre intellisense que t'ajudarà alot).

Puc crear un projecte buida afegir quatre nous fitxers (substituint les paraules "Original" i "nou" Si s'escau):

  • Original.XSLT
  • New.XSLT
  • Original Params.xml
  • Params.xml nou

En el meu cas, s'assembla a això:

imatge

Modificar l'element web i copiar la params i XSL a l'Original"" versió en estudi Visual.

L'objectiu és provocar l'XSL transformar els resultats que vam tornar de la consulta DVWP en HTML que rendeix com un gràfic.

Amb aquesta finalitat, ajuda a considerar en primer lloc que el codi HTML ha de ser semblant abans podem confondre amb la bogeria que es coneix com "XSL". (Per ser clars, a continuació és simplement un exemple; no escriviu-lo o copiar i enganxar en estudi visual. Vaig donar un cop ple, punt de partida per a que més tard en el reportatge). El següent gràfic mostra es rendeix segons el codi HTML immediatament després:

Sample Bar Graph

HTML corresponent:

<HTML>
<cos>
<Centre>
<amplada de la taula = 80%>
<tr><TD><Centre>Gràfic de barres horitzontals</TD></tr>
<tr>
<TD alinear = "center">
<frontera taula = "1" amplada = 80%>
<tr>
<amplada TD = 10%>Obert</TD>
<TD><taula cellpadding ="0" cellspacing ="0" frontera = 0 width = 50%><tr bgcolor = vermell><TD>&nbsp;</TD></tr></taula></TD>
</tr>
<tr>
<amplada TD = 10%>Tancat</TD>
<TD><taula cellpadding ="0" cellspacing ="0" frontera = 0 width = 25%><tr bgcolor = vermell><TD>&nbsp;</TD></tr></taula></TD>
</tr>
<tr>
<amplada TD = 10%>Aturat</TD>
<TD><taula cellpadding ="0" cellspacing ="0" frontera = 0 width = 25%><tr bgcolor = vermell><TD>&nbsp;</TD></tr></taula></TD>
</tr>
</taula>
</TD>
</tr>
</taula>
</cos>
</HTML>

Utilitzava un enfocament totalment simple per crear la meva barres posant el color de fons d'una filera de "vermell".

És l'aquí per emportar: Al final, tots estem fent està creant HTML amb files i columnes.

Plantilla XSLT:

He copiat l'XSLT que genera un gràfic de barres horitzontal. És bastant bé comentar perquè no afegeixo molt aquí excepte aquestes notes:

  • Vaig començar amb l'omissió XSL que SharePoint Designer em va donar quan primer he creat el DVWP.
  • Jo era capaç de reduir aquest des de l'SPD 657 línies a 166 línies.
  • No perdré amb el fitxer XML de paràmetres (que és independent de l'XSL i sabrà a què em refereixo quan vas a modificar el propi DVWP; hi ha dos arxius que pot modificar). No obstant això, per tal de simplificar-lo, Em va treure gairebé tots ells de l'XSL. Això significa que si voleu fer ús d'aquests paràmetres, només cal afegir les seves definicions variables a l'XSL. Que serà fàcil ja que tindran les definicions de variable XSL originals en el seu projecte d'estudi visual.
  • Vostè hauria de ser capaç de copiar i enganxar aquesta directament en el teu projecte d'estudi visual. Llavors, treure les meves trucades i inserir el seu propi trucades a "ShowBar".
  • El desglossar els treballs creant un <un href> d'aquesta: http://server/List?FilterField1=fieldname&FilterValue1=actualFilterValue. Aquesta tècnica pot ser de valor en altres contextos. En un primer moment, Vaig pensar que seria necessari ajustar-se a un format més complex: http://server/List/AllItems.aspx?View={guid}&FilterField1=blah&FilterValue1=blah, però en el meu entorn que no és necessari. D'URL de la llista es passa a nosaltres per SharePoint perquè això és bastant fàcil de generalitzar.

Aquí és:

<XSL:full d'estil versió="1.0" excloure-resultat-prefixos="RS z o s ddwrt dt msxsl" 
xmlns:msxsl="urna:esquemes-microsoft-com:XSLT" xmlns:XSL="http://www.w3.org/ 1999 / / transformació XSL"
xmlns:SharePoint="Microsoft.SharePoint.WebControls" xmlns:__designer="http://schemas.microsoft.com/WebParts/v2/DataView/designer"
xmlns:escurçó="http://schemas.microsoft.com/ASPNET/20" xmlns:DDWRT="http://schemas.microsoft.com/WebParts/v2/DataView/runtime"
xmlns:o="urna:esquemes-microsoft-com:Oficina" xmlns:s="UUID:BDC6E3F0-6DA3-11D1-A2A3-00AA00C14882"
xmlns:DT="UUID:C2F41010-65B3 - 11d 1-A29F-00AA00C14882" xmlns:RS="urna:esquemes-microsoft-com:conjunt de files" xmlns:z="#RowsetSchema"
xmlns:ddwrt2="urna:FrontPage:interna"
> <XSL:sortida mètode="HTML" sagnia="no" /> <XSL:format de decimals NaN="" /> <XSL:Param nom="ListUrlDir"></XSL:Param> <!-- Jo necessitar això per donar suport a un trepant avall. --> <XSL:plantilla Partit="/" xmlns:SharePoint="Microsoft.SharePoint.WebControls"
xmlns:__designer=http://schemas.microsoft.com/WebParts/v2/DataView/designer xmlns:escurçó="http://schemas.microsoft.com/ASPNET/20"
> <XSL:variable nom="dvt_StyleName">Taula</XSL:variable> <XSL:variable nom="Files" Selecciona="/dsQueryResponse/files/fila" /> <XSL:variable nom="dvt_RowCount" Selecciona="Comte($Files)" /> <XSL:variable nom="IsEmpty" Selecciona="$dvt_RowCount = 0" /> <XSL:variable nom="dvt_IsEmpty" Selecciona="$dvt_RowCount = 0" /> <XSL:triar> <XSL:Quan prova="$dvt_IsEmpty"> Hi ha dades al gràfic!<BR/> </XSL:Quan> <XSL:en cas contrari> <!-- Les coses interessants aquí comença. Cal definir un parell de variables per a cada fila en el gràfic: nombre total d'elements i per cent del total. --> <XSL:variable nom="totalProposed" Selecciona="Comte(/dsQueryResponse/files/fila[Normalitzar-espai(@Status) = 'Proposar'])" /> <XSL:variable nom="percentProposed" Selecciona="$totalProposed div $dvt_RowCount" /> <XSL:variable nom="totalInProcess" Selecciona="Comte(/dsQueryResponse/files/fila[Normalitzar-espai(@Status) = "En procés"])" /> <XSL:variable nom="percentInProcess" Selecciona="$totalInProcess div $dvt_RowCount" /> <XSL:variable nom="totalStalled" Selecciona="Comte(/dsQueryResponse/files/fila[Normalitzar-espai(@Status) = "Estancat"])" /> <XSL:variable nom="percentStalled" Selecciona="$totalStalled div $dvt_RowCount" /> <!-- Definim la nostra taula HTML aquí. Jo estic préstecs de alguns estàndard SharePoint estils aquí perquè sigui coherent. Crec que complirà els canvis del fitxer global css, així com tema invalida. --> <taula amplada="100%" cellspacing="0" cellpadding="2" estil="vora dreta: 1 #C0C0C0 sòlida; frontera-fons: 1 #C0C0C0 sòlida; vora esquerra-estil: sòlid; vora esquerra-amplada: 1; frontera-cim-style: sòlid; frontera-cim-amplada: 1;"> <tr> <TD Alineació="Centre"> <taula frontera="1" amplada="100%"> <!-- Per a cada situació que volem gràfic, que anomenem la «ShowBar" plantilla. Vam passar-lo: 1. Una etiqueta per a la fila. Això es transforma en un enllaç. 2. El percentatge (variable des de dalt). 3. El nom de camp real del codi de la llista subjacent. Això no ha de coincidir amb l'etiqueta d'exhibició. 4. Camp de valor aparellat per #3. 5. Total d'elements d'aquest codi d'estatus (no el total de tots els codis d'estat). Que emet una <tr></tr> i la línia de gràfic de barres horitzontals. Reivindiquem aquesta plantilla que voleu visualitzar cada codi d'estatus. --> <XSL:crida-plantilla nom="ShowBar"> <XSL:amb-param nom="BarDisplayLabel" Selecciona="'Proposar'"/> <XSL:amb-param nom="BarPercent" Selecciona="$percentProposed"/> <XSL:amb-param nom="QueryFilterFieldName" Selecciona="'Estat'"/> <XSL:amb-param nom="QueryFilterFieldValue" Selecciona="'Proposar'"/> <XSL:amb-param nom="TotalItems" Selecciona="$totalProposed"></XSL:amb-param> </XSL:crida-plantilla> <XSL:crida-plantilla nom="ShowBar"> <XSL:amb-param nom="BarDisplayLabel" Selecciona=""Aturat""/> <XSL:amb-param nom="BarPercent" Selecciona="$percentStalled"/> <XSL:amb-param nom="QueryFilterFieldName" Selecciona="'Estat'"/> <XSL:amb-param nom="QueryFilterFieldValue" Selecciona=""Aturat""/> <XSL:amb-param nom="TotalItems" Selecciona="$totalStalled"></XSL:amb-param> </XSL:crida-plantilla> <XSL:crida-plantilla nom="ShowBar"> <XSL:amb-param nom="BarDisplayLabel" Selecciona=""En procés""/> <XSL:amb-param nom="BarPercent" Selecciona="$percentInProcess"/> <XSL:amb-param nom="QueryFilterFieldName" Selecciona="'Estat'"/> <XSL:amb-param nom="QueryFilterFieldValue" Selecciona=""En procés""/> <XSL:amb-param nom="TotalItems" Selecciona="$totalInProcess"></XSL:amb-param> </XSL:crida-plantilla> </taula> </TD> </tr> </taula> </XSL:en cas contrari> </XSL:triar> </XSL:plantilla> <!-- Aquesta plantilla fa el treball de mostrar línies individuals en el gràfic de barres. Vostè probablement a fer la majoria dels seus pessigant aquí. --> <XSL:plantilla nom="ShowBar"> <XSL:Param nom="BarDisplayLabel" /> <!-- etiqueta per mostrar --> <XSL:Param nom="BarPercent"/> <!-- Per cent del total. --> <XSL:Param nom="QueryFilterFieldName"/> <!-- Solia anar a la consulta & filtre --> <XSL:Param nom="QueryFilterFieldValue"/> <!-- Solia anar a la consulta & filtre --> <XSL:Param nom="TotalItems" /> <!-- recompte total d'aquest barlabel --> <tr> <!-- El bar etiquetar-se. --> <TD classe="MS-formbody" amplada="30%"> <!-- Aquest pròxim conjunt d'afirmacions construeix una cadena de consulta que permet perfori avall un visualització filtrada de les dades subjacents. Fem ús d'unes quantes coses aquí: 1. Podem passar FilterField1 i FilterValue1 a una llista per filtrar en una columna. 2. SharePoint és passar un paràmetre clau per a nosaltres, ListUrlDir que apunta a la llista subjacent contra el qual aquest DVWP està "funcionant". XSL, tampoc? --> <XSL:text impossibilitar-sortida-escapar=""> <![CDATA[<un href ="]]></XSL:text> <XSL:valor de Selecciona="$ListUrlDir"/> <XSL:text impossibilitar-sortida-escapar=""><![CDATA[?FilterField1 =]]></XSL:text> <XSL:valor de Selecciona="$QueryFilterFieldName"/> <XSL:text impossibilitar-sortida-escapar=""><![CDATA[&FilterValue1 =]]></XSL:text> <XSL:valor de Selecciona="$QueryFilterFieldValue"/> <XSL:text impossibilitar-sortida-escapar=""><![CDATA[">]]></XSL:text> <XSL:valor de Selecciona="$BarDisplayLabel"/> <XSL:text impossibilitar-sortida-escapar=""><![CDATA[</un>]]></XSL:text> <!-- El bit següent mostra alguns números en el format: "(total / % del total)" --> (<XSL:valor de Selecciona="$TotalItems"/> / <!-- Això crea una etiqueta percentatge agradable per a nosaltres. Gràcies, Microsoft! --> <XSL:crida-plantilla nom="percentformat"> <XSL:amb-param nom="per cent" Selecciona="$BarPercent"/> </XSL:crida-plantilla>) </TD> <!-- Finalment, emeten un <TD> etiqueta pel bar propi.--> <TD> <taula cellpadding="0" cellspacing="0" frontera="0" amplada="{ronda($BarPercent * 100)+1}%"> <tr BGCOLOR="vermell"> <XSL:text impossibilitar-sortida-escapar=""><![CDATA[&nbsp;]]></XSL:text> </tr> </taula> </TD> </tr> </XSL:plantilla> <!-- Això és pres directament d'algunes XSL vaig trobar en una plantilla de MS. --> <XSL:plantilla nom="percentformat"> <XSL:Param nom="per cent"/> <XSL:triar> <XSL:Quan prova="format de nombre($per cent, '#,##0%;-#,##0%')= 'NaN'">0%</XSL:Quan> <XSL:en cas contrari> <XSL:valor de Selecciona="format de nombre($per cent, '#,##0%;-#,##0%')" /> </XSL:en cas contrari> </XSL:triar> </XSL:plantilla> </XSL:full d'estil>

Els resultats:

L'XSL de dalt genera aquest gràfic:

imatge

Perfori avall les dades subjacents fent clic al codi d'estatus:

imatge

Reflexions finals:

Pot això ser generalitzada?

M'encanta aquest concepte graphing, però odio el fet que he d'entrar i fer tanta mà codificant. Li he donat una mica de pensament per si es poden generalitzar i sóc optimista, però jo també sóc una mica de por que hi hagi una paret de Maó en algun lloc al llarg del camí que no ofereix cap treball al voltant. Si algú té algunes bones idees sobre aquest, Si us plau fer una nota en els comentaris o Rebi per email.

Gràfics verticals:

Aquest és un gràfic de barres horitzontal. És certament possible crear un gràfic vertical. Només hem de canviar el codi HTML. M'agradaria començar igual: Crear una representació d'HTML d'un gràfic de barres vertical i després esbrinar com aconseguir que la via XSL. Si algú està interessat en que, Jo podria ser persuadits a provar-ho i treballar l'enrosca. Si algú ja ha fet que, please let me know and I’ll gladly link to your blog 🙂

Jo crec que el repte amb un gràfic vertical és que les etiquetes per a la gràfica són més difícils de gestionar, però certament no és impossible.

Del camp nom Gotcha:

Hi ha almenys dues coses cal buscar amb els seus noms de camp.

Primer, té un nom de camp amb un espai poder escapar a l'XSL. Això serà probablement un problema aquí:

        <XSL:variable nom="totalProposed" 
Selecciona="Comte(/dsQueryResponse/files/fila[Normalitzar-espai(@Status) = 'Proposar'])" />

Si el seu estatus de"" columna és en realitat anomenat "codi d'estatus" llavors vostè necessita fer referència a ell com "Status_x0020_Code":

   <XSL:variable nom="totalProposed" 
Selecciona="Comte(/dsQueryResponse/files/fila[Normalitzar-espai(@Status_x0020_Code) = 'Proposar'])" />

Segon, i estic una mica borrós en aquest, però també cal estar alerta a canvis de nom de camp del. Si anomeneu el seu camp "codi d'estatus" i més tard, Rebategi'l a "AFE estatus", el nom"intern" no canvia. El nom Interno encara serà "codi d'estatus" i cal fer referència a com "Status_x0020_Code". "Altres recursos" enllaços poden ajudar a diagnosticar i corregir aquesta classe de problema.

Sobre aquell Color:

Triava "vermell" perquè és agradable per a mi en el moment. No seria una gran cosa per mostrar diferents colors per aportar més que una descripció visual d'un nombre, però també proporcionar una útils KPI. Per exemple, Si el percentatge de "estancat" És del AFE > 10% llavors mostrar-ho vermell, en cas contrari es mostra en negre. Ús <XSL:triar> per aconseguir això.

Altres recursos:

Transformant feliç!

<final />

Subscriure's al meu blog!

Dades d'OM presents a través d'una llista de costum (o, Encara un altre Displayor de dades d'OM [com YACC, però diferents])

Avui, Vaig passar un grapat d'hores localitzar la causa arrel darrere el missatge "el nom de columna que heu introduït és ja en ús o reservat. Trieu un altre nom."

Es podria crear la columna en qüestió, se suprimia i en un altre entorn, Així que sabia que no era un nom reservat. No obstant això, Jo simplement no podria trobar la columna en qualsevol lloc mitjançant la interfície d'usuari del SharePoint estàndard a qualsevol lloc en la col·lecció de llocs.

He publicat a Fòrums MSDN aquí i l'indòmit Andrew Woodward em va assenyalar en la direcció de les dades del model objecte subjacent.

Vaig anar a CodePlex per trobar algunes eines que ajudaria a mi fitar les dades subjacents OM i ajudar-me a localitzar els problemes.

He intentat diverses eines i eren molt fresc i interessant però al final, l'UI no era prou bo per al meu propòsit. Jo no estic criticant-los per qualsevol mitjà, però clarament les eina-fabricants no tenia el meu problema en ment quan van crear la seva interfície d'usuari :). Majoria de la gent sembla ser invertir una quantitat considerable de temps i esforç en la creació de treball / aplicacions del client que proporcionen la vista d'arbre, Cliqueu els menús de context i així successivament. Aquests són el bonics i tots els, però és un munt de treball per crear una experiència d'usuari de dalt-of-the-line que també és molt flexible.

Realment necessitava una resposta a aquest problema. Se li va ocórrer a mi que si pogués aconseguir totes les columnes del lloc en la col·lecció de llocs en una llista personalitzada, Jo podria filtrar, ordenar i crear visualitzacions que ajudaria a mi trobar aquesta columna suposadament existent (que ho va fer, BTW). Vaig seguir endavant i va fer que i una hora o dues més tard, tenia totes les meves columnes del lloc carregat en una llista personalitzada amb agrupament, classificació i així successivament. He trobat la meva resposta cinc minuts més tard.

Si i quan em prenc amb èxit arreu del món, Crec que es decret que tots els proveïdors d'eines del SharePoint s'ha de considerar seriosament emergir dades del model d'objecte en una llista personalitzada. D'aquesta manera, Jo tinc el poder per buscar qualsevol manera vull (limitats, clar, els trets sharepoint estàndard).