Kateqoriya Arxivləri: SharePoint İnkişaf

ItemStyle.xsl üçün Breaking dəyişikliklər çəkinin

Mən nahar vaxtı haqqında Məqalələr Query Web Part və hüquq görünüşünü özelleştirmek üçün ItemStyle.xsl ilə iş, I made a breaking change to the xsl. I didn’t realize it, but this had far reaching effects throughout the site collection. I went off to lunch and upon my return, yerlərdə bir dəstə görünen bu mesajı qeyd:

Bu Web Part göstərilə bilmir. Problem giderme, Microsoft Office SharePoint Designer kimi bir Windows SharePoint Services uyğun HTML redaktoru bu Web-səhifə açmaq. Problem davam edərsə, Web server administrator müraciət.

Mən müştəri ittiham (bu nöqtədə hələ bu mənim günahım idi ki, həyata deyil) lakin sonda Visual Studio IntelliSense I bad XSL idi ki, mənə xəbərdarlıq etdi ki, qeyd. Mən bunu düzəldilir və hər şey iş başladı.

ItemStyle.xsl ilə iş zaman ehtiyatlı gözəkli olun (və qlobal XSL faylları hər hansı bir) — onları qırılma site toplanması bir çox əsərlər təsir.

<Tamamlama />

Bir Grid İçerik Query Web Part nəticələri göstər / Masa

Baxış və obyektiv

Qutusu həyata, MOSS’ Məqalələr Query Web Part (CQWP) siyahısı formatda nəticələri göstərir, similar to search results. It is also possible to display the results in a grid format (i.e. HTML masa formatında). Grid formats are better in some circumstances. I describe how to achieve that effect in this article.

Biznes Ssenari

I have worked with a client on an enterprise-wide MOSS rollout. We have designed their taxonomy such that projects are first class citizens in the hierarchy and have their own top level site. Project managers maintain a singleton list of project summary information, belə adı kimi, büdcə, gözlənilən Tamamlanma tarixi, remaining budget and other summary type fields. By "singleton" I mean a custom SharePoint list guaranteed to contain only one item. Simplistically, bu kimi görünür:

image

Təsvir kimi texniki yanaşma çox eyni burada (http://paulgalvin.spaces.live.com/blog/cns!1CC1EDB3DAA9B8AA!447.entry). The CQWP uses an XSL transform to emit HTML for the browser to render.

I always envision the result before diving into the XSL because XSL is a nightmare. Here’s my desired result:

image

Bu kimi HTML nəticəsində yaradır:

<html>
 <orqan>
 <mərkəz>
 <masa sərhəd= 1>

<!-- Etiketler ->
 <tr bgcolor= Blue>
 <TD><şrift rəng= Ağ><b>Layihənin adı</b></şrift></TD>
 <TD align= Sağ><şrift rəng= Ağ><b>Tarix doldurun</b></şrift></TD>
 <TD align= Sağ><şrift rəng= Ağ><b>Büdcə</b></şrift></TD>
 <TD align= Sağ><şrift rəng= Ağ><b>Aktual Xərcləri</b></şrift></TD>
 <TD><şrift rəng= Ağ><b>Ümumi Status</b></şrift></TD>
 </tr>

<tr>
 <TD>Re-tel kompüter otağı.</TD>
 <TD align= Sağ>02/01/08</TD>
 <TD align= Sağ>22,500.00</TD>
 <TD align= Sağ>19,000.00</TD>
 <TD>Davam</TD>
 </tr>

<tr>
 <TD>SQL Upgrade üçün ehtiyat server</TD>
 <TD align= Sağ>04/01/08</TD>
 <TD align= Sağ>7,500.00</TD>
 <TD align= Sağ>0.00</TD>
 <TD>Planlı</TD>
 </tr>

</masa>
 </mərkəz>
 </orqan>
</html>

Yanaşma

Bu grid yaratmaq üçün bu adımları edin:

  1. Grid komponentləri müəyyən (satır / sütun).
  2. Zəruri site sütun müəyyən və yaratmaq.
  3. Layihələr və Singleton siyahıları sub sites yaratmaq.
  4. Bir web page CQWP əlavə və siyahıları üçün axtarış üçün konfiqurasiya.
  5. Əlavə sütun qədər toplanması üçün CQWP XML Düzelt.
  6. Bir masa yaratmaq üçün XSL dəyişdirin.

I’m going to concentrate on number six. Numbers one through four are straight-forward and something that any CQWP user has already done. Number five has been well-documented by others including this exhaustive screen-shot laden article from MSDN burada (http://msdn2.microsoft.com/en-us/library/bb897399.aspx) və Heather Süleymanın blog burada (http://www.heathersolomon.com/blog/articles/CustomItemStyle.aspx).

Qoz-fındıq və boltlar

Addımlar MSDN sənədlərin və Heather Süleymanın maddə uyğun olaraq beş vasitəsilə bir başlayın və həyata keçirilməsi.

Bu noktada, sahifada üçün CQWP əlavə etdik və sizin <CommonViewFields> zəruri olaraq yapılandırılmış.

Adi adımları, Mən bu aralıq nəticələr almaq:

1. Içerik növü yaratmaq, a templatized custom list for that content type and two sites. Here is the content type:

image

Burada site strukturu:

image

2. Mənim layihə subsites və Singleton layihə icmalı siyahıları yaratmaq sonra CQWP əlavə et:

image

3. Vasitəsilə istəyirəm bütün əlavə məlumat əlavə et <CommonViewFields>:

        <əmlak ad="CommonViewFields" növü="sim">Project_x0020_Name;Project_x0020_Expenses;Project_x0020_Status;Project_x0020_Start_x0020_Date;Project_x0020_End_x0020_Date;Project_x0020_Budget</əmlak>

Mən bir line bütün əmlak sahələrində saxlamaq idi Qeyd edək ki, ya bu iş olmaz (CQWP sorğu yoxdur maddələr geri ki, mənə demək istəyirəm).

4. Bu noktada, we’re ready to move beyond the MSDN article and flip on over to Heather Solomon’s article. Follow her steps starting near step #5 özelleştirilmiş bir yaratmaq üçün / unghosted version of ItemStyle.xsl. I follow Heather’s advice, addım vasitəsilə 11 bu aralıq nəticələr almaq:

4.1: Mənim XSL şablon kimi aşağıdakı adlandırın:

<XSL:template name="Grid" match="Row[@Style=’Grid’]" mode="itemstyle">

Mən də bir az onun təklif dəyişdirmək <XSL:-hər biri üçün …> bir əlavə <br /> təmiz siyahı təmin etmək üçün etiket yapışdırmaq:

    <XSL:-hər biri üçün seçmək="@ *">
      P:<XSL:dəyər və seçmək="ad()" /><br/>
    </XSL:-hər biri üçün>

4.2: Mən web hissəsi dəyişdirmək, go to appearance and select my "Grid" üslub:

image

Dəyişiklik müraciət və burada nəticəsidir:

image

Biz sahələrində biz istəyirik ki, yuxarıda göründüyü (Layihənin adı, xərc, vəziyyət, və s.) are available for us to use when we emit the HTML. Not only that, but we see the names by which we must reference those columns in the XSL. Məsələn, we reference Project Status as "Project_x005F_x0020_Name".

Bu noktada, biz Heather blog və bu nəhənglərin çiyinlərində yola, Mən öz kiçik qədər əlavə.

ContentQueryMain.xsl

QEYD: Həm ContentQueryMain.xsl dəyişikliklər edilməsi, habelə ItemStyle.xsl zaman, Siz dəyişikliklərin təsiri görmək əvvəl geri bu faylları yoxlamaq lazımdır.

Grid vermə məqsədləri üçün, MOSS uses two different XSL files to produce the results we see from a CQWP. To generate the previous bit of output, we modified ItemStyle.xsl. MOSS actually uses another XSL file, ContentQueryMain.xsl to in conjunction with ItemStyle.xsl to generate its HTML. As its name implies, ContentQueryMain.xsl is the "main" XSL that controls the overall flow of translation. It iterates through all the found items and passes them one by one to templates in ItemStyle.xsl. We’ll modify ItemStyle.xsl to generate the open <masa> məlumatların ilk sıraya emitting əvvəl tag və yekun <masa> tag after emitting the last row. To accomplish this, ContentQueryMain.xsl is modified to pass two parameters to our "grid" ItemStyle.xsl ilə şablon, "last row" and "current row". ItemStyle.xsl uses these to conditionally emit the necessary tags.

Heather Süleymanın texnika istifadə, we locate ContentQueryMain.xsl. It is located in the same place as ItemStyle.xsl. This screen shot should help:

image

Biz aşağıdakı dəyişiklik etmək lazımdır:

  • Bir XSL şablon dəyişdirmək, "CallItemTemplate" that actually invokes our Grid template in ItemStyle.xsl. We will pass two parameters to the Grid template so that it will have the data it needs to conditionally generate opening and closing <masa> tags.
  • Modify another bit of ContentQueryMain.xsl that calls the "CallItemTemplate" to pass it a "LastRow" LastRow bizim Grid şablon üçün qəbul edilə bilər parametri ki,.

Locate the template named "OuterTemplate.CallItemTemplate" simli tərəfindən müəyyən:

  <XSL:şablon ad="OuterTemplate.CallItemTemplate">

Aşağıdakı kimi bütün şablon dəyişdirin:

  <XSL:şablon ad="OuterTemplate.CallItemTemplate">
    <XSL:Param ad="CurPosition" />

    <!--
      Add the "LastRow" parametr.
      We only use it when the item style pass in is "Grid".
    -->
    <XSL:Param ad="LastRow" />

    <XSL:seçmək>
      <XSL:zaman sınaq="@ Style = 'NewsRollUpItem'">
        <XSL:-şablonları tətbiq seçmək="." üsul="itemstyle">
          <XSL:ilə-Param ad="EditMode" seçmək="$cbq_iseditmode" />
        </XSL:-şablonları tətbiq>
      </XSL:zaman>
      <XSL:zaman sınaq="@ Style = 'NewsBigItem'">
        <XSL:-şablonları tətbiq seçmək="." üsul="itemstyle">
          <XSL:ilə-Param ad="CurPos" seçmək="$CurPosition" />
        </XSL:-şablonları tətbiq>
      </XSL:zaman>
      <XSL:zaman sınaq="@ Style = 'NewsCategoryItem'">
        <XSL:-şablonları tətbiq seçmək="." üsul="itemstyle">
          <XSL:ilə-Param ad="CurPos" seçmək="$CurPosition" />
        </XSL:-şablonları tətbiq>
      </XSL:zaman>

      <!--
              Bu grid itemstyle.xsl şablon cari vəziyyəti və lastrow Pass.
              ItemStyle.xsl açıq və bağlanış ayırmaq üçün istifadə edəcək <masa> tags.
      -->
      <XSL:zaman sınaq="@ Style = 'Grid'">
        <XSL:-şablonları tətbiq seçmək="." üsul="itemstyle">
          <XSL:ilə-Param ad="CurPos" seçmək="$CurPosition" />
          <XSL:ilə-Param ad="Sonuncu" seçmək="$LastRow" />
        </XSL:-şablonları tətbiq>
      </XSL:zaman>

      <XSL:başqa cür>
        <XSL:-şablonları tətbiq seçmək="." üsul="itemstyle">
        </XSL:-şablonları tətbiq>
      </XSL:başqa cür>
    </XSL:seçmək>
  </XSL:şablon>

Şərh dəyişikliklərin məqsədi təsvir.

Əlbəttə, the "OuterTemplate.CallItemTemplate" is itself called from another template. Locate that template by searching for this text string:

<XSL:şablon ad="OuterTemplate.Body">

OuterTemplate.Body təlimatlara vasitəsilə gedin və LastRow parametri aşağıdakı kimi daxil edin (italik Şərh kimi göstərilir):

<XSL:Zəng şablon ad="OuterTemplate.CallItemTemplate">
  <XSL:ilə-Param ad="CurPosition" seçmək="$CurPosition" />
  <!-- Ki, LastRow parametr daxil edin. -->
  <XSL:ilə-Param ad="LastRow" seçmək="$LastRow"/>
</XSL:Zəng şablon>

Bu bütün sonra, nəhayət, biz hər şeyi düzgün bizim ItemStyle.xsl buraxmaq olar ki, qurmaq <masa> sağ yer tags.

ItemStyle.Xsl

QEYD: Yenidən, bu dəyişikliklərin təsiri oldu ki, hər hansı dəyişikliklərdən sonra ItemStyle.xsl kontrol.

Biz burada iki vəzifələr:

  • Replace the entire Grid template. You can copy/paste from below.
  • Add some mumbo jumbo outside the template definition that enables "formatcurrency" template to work. (Mən XSL bir seyrək sapı var ki, deyə bilərsiniz).

Ilk, ItemStyle.xsl üstündeki, Bu xətt əlavə:

  <!-- Bizə U.S keçirmək üçün imkan verir ki, bəzi mumbo jumbo. valyuta. -->
  <XSL:Mexanizmi Boylam decimal format ad="heyət" rəqəmli="D" />

  <XSL:şablon ad="Default" matç="*" üsul="itemstyle">

Mən əvvəl birbaşa əlavə edək ki, <XSL:template name="Default" …> tərif.

Sonrakı, go back to our Grid template. Replace the entire Grid template with the code below. It is thoroughly commented, ancaq mənə e-poçt çekinmeyin və ya sualınız varsa, mənim blog comments tərk etmir.

  <XSL:şablon ad="Tor" matç="Sıra[@ Style = 'Grid']" üsul="itemstyle">

    <!--
      ContentMain.xsl CurPos və son keçir.
      Biz şərti açıq və bağlanış buraxmaq üçün bu istifadə edin <masa> tags.
    -->
    <XSL:Param ad="CurPos" />
    <XSL:Param ad="Sonuncu" />

    <!-- Aşağıdakı dəyişənlər standart ItemStyle.xsl dən değiştirilmemiş olunur -->
    <XSL:dəyişən ad="SafeImageUrl">
      <XSL:Zəng şablon ad="OuterTemplate.GetSafeStaticUrl">
        <XSL:ilə-Param ad="UrlColumnName" seçmək="'ImageUrl'"/>
      </XSL:Zəng şablon>
    </XSL:dəyişən>
    <XSL:dəyişən ad="SafeLinkUrl">
      <XSL:Zəng şablon ad="OuterTemplate.GetSafeLink">
        <XSL:ilə-Param ad="UrlColumnName" seçmək="'LinkUrl'"/>
      </XSL:Zəng şablon>
    </XSL:dəyişən>
    <XSL:dəyişən ad="DisplayTitle">
      <XSL:Zəng şablon ad="OuterTemplate.GetTitle">
        <XSL:ilə-Param ad="Title" seçmək="@ Title"/>
        <XSL:ilə-Param ad="UrlColumnName" seçmək="'LinkUrl'"/>
      </XSL:Zəng şablon>
    </XSL:dəyişən>
    <XSL:dəyişən ad="LinkTarget">
      <XSL:əgər sınaq="@ OpenInNewWindow = 'true'" >_blank</XSL:əgər>
    </XSL:dəyişən>

    <!--
      Burada biz bir dəyişən müəyyən, "tableStart".  Bu HTML ehtiva
      .  Qeyd edək ki, əgər CurPos = 1, bir CDATA tag olan HTML daxildir.
      Başqa cür, boş olacaq.

      TableStart dəyəri hər zaman ItemStyle vasitəsilə adlanır hazırlayıb çap edir
      .
    -->
    <XSL:dəyişən ad="tableStart">
      <XSL:əgər sınaq="$CurPos = 1">
        <![CDATA[
        <Cədvəl sərhəd = 1>
          <tr bgcolor="blue">
            <TD><font color="white"><b>Layihənin adı</b></şrift></TD>
            <td align="right"><font color="white"><b>Tarix doldurun</b></şrift></TD>
            <td align="right"><font color="white"><b>Büdcə</b></şrift></TD>
            <td align="right"><font color="white"><b>Aktual Xərcləri</b></şrift></TD>
            <TD><font color="white"><b>Ümumi Status</b></şrift></TD>
          </tr>
        ]]>
      </XSL:əgər>
    </XSL:dəyişən>

    <!--
      Digər dəyişən, tableEnd sadəcə yekun cədvəli tag müəyyən.

      TableStart ilə, həmişə hazırlayıb çap edir.  Onun dəyəri Buna görə
      .
    -->
    <XSL:dəyişən ad="tableEnd">
      <XSL:əgər sınaq="$CurPos Son $ =">
        <![CDATA[ </masa> ]]>
      </XSL:əgər>
    </XSL:dəyişən>

    <!--
      Həmişə tableStart məzmunu buraxmaq.  Bu ilk deyil
      , sonra biz onun qədrini bilmək
      .

      Qaçan çıxış Disable çünki zaman tableStart onu boş deyil, o
      .  Əgər
      , it will generate
      stuff like "&lt;masa&GT;" instead of "<masa>".
    -->
    <XSL:dəyər və seçmək="$tableStart" aradan çıxdı-qaçan="bəli"/>


    <tr>
      <!--
      P:Project_x005F_x0020_Name
      :Project_x005F_x0020_End_x005F_x0020_Date
      :Project_x005F_x0020_Budget
      :Project_x005F_x0020_Expenses
      :Project_x005F_x0020_Status
      -->
      <TD>
        <XSL:dəyər və seçmək="@ Project_x005F_x0020_Name"/>
      </TD>

      <TD align="sağ">
        <XSL:dəyər və seçmək="@ Project_x005F_x0020_End_x005F_x0020_Date"/>
      </TD>

      <TD align="sağ">
        <XSL:Zəng şablon ad="formatcurrency">
          <XSL:ilə-Param ad="dəyər" 
seçmək="@ Project_x005F_x0020_Budget"></XSL:ilə-Param> </XSL:Zəng şablon> </TD> <TD align="sağ"> <XSL:Zəng şablon ad="formatcurrency"> <XSL:ilə-Param ad="dəyər" seçmək="@ Project_x005F_x0020_Expenses">
</XSL:ilə-Param> </XSL:Zəng şablon> </TD> <TD> <XSL:dəyər və seçmək="@ Project_x005F_x0020_Status"/> </TD> <!-- Aşağıdakı hər şeyə aydınlıq üçün şərh edir. Lakin, geri gətirmək və onu mövzusu <TD> onun görmək         . --> <!-- <div id="linkitem" class="item"> <XSL:if test="string-length($SafeImageUrl) != 0"> <div class="image-area-left"> <a href="{$SafeLinkUrl}" target="{$LinkTarget}"> <img class="image-fixed-width" src="{$SafeImageUrl}"
alt="{@ ImageUrlAltText}"/> </bir> </div> </XSL:əgər> <div class="link-item"> <XSL:Zəng şablon
name="OuterTemplate.CallPresenceStatusIconTemplate"/> <a href="{$SafeLinkUrl}"
target="{$LinkTarget}" title="{@ LinkToolTip}"> <XSL:value-of select="$DisplayTitle"/> </bir> <div class="description"> <XSL:value-of select="@Description" /> </div> </div> </div>
--> </tr> <!-- Yekun masa tag buraxmaq. Biz son sırada deyilsə, Bu boş olacaq. --> <XSL:dəyər və seçmək="$tableEnd" aradan çıxdı-qaçan="bəli"/> </XSL:şablon> <XSL:şablon ad="formatcurrency"> <XSL:Param ad="dəyər" seçmək="0" /> <XSL:dəyər və seçmək='format nömrəsi($dəyər, "$DDD,DDD,DDD.DD", "staff")' /> </XSL:şablon>

Standard WSS / MOSS Veri Girişi ekranlar Cascading Drop-Downs bilmir (və ya rabitə daxili digər)

UPDATE (04/2008): Bu, böyük blog giriş bu problemi yaxşı bir javascript əsaslı yanaşmanı göstərir: http://webborg.blogspot.com/2008/04/add-functions-and-events-to-sharepoint.html

YENİLƏNİB II: (04/2008): Bu blog giriş, eləcə də perspektivli görünür: http://www.cleverworkarounds.com/2008/03/13/free-mosswss-2007-web-part-hide-controls-via-javascript/

Bir neçə dəfə bir həftə, gündəlik əgər, forum users describe a requirement that would normally be met via cascading drop-downs. Məsələn, Mən iki açılan nəzarət:

  • U.S siyahısı. dövlətlər
  • U.S siyahısı. şəhərlər.

Məsul UI təminatçıları kimi, biz bu kimi fəaliyyət istəyirəm:

  • Paul bir U.S seçir. state from the drop-down.
  • This causes the cities drop-down to filter only those cities that belong to the selected state.
  • Paul bu süzgəcdən siyahıdan bir şəhər seçir.

There is no out-of-the-box support for this feature. Faktiki olaraq, there is no OOB support for any kind of direct intra-form communication. This includes programmatically hiding/enabling/disabling fields in response to field changes elsewhere on the form.

Bu maddəyə əsl məqsədi mümkün həll yolları təsvir etmək və onların bildiyiniz kimi bu variantları:

  1. Develop a custom column type. As a custom-column-developer, you have full control over the "world" of that custom column. You can implement a cascading drop-down that way.
  2. Consider using workflow. In some cases, you want to automatically assign a value to field based on another field’s value. Bu halda, you would normally try to use a calculated column, but some times, it just won’t get the job done. SharePoint Designer workflow is a relatively administer-friendly alternative to dropping down into code and visual studio. If you go this route, be aware of the issue addressed by Bu maddənin (http://paulgalvin.spaces.live.com/blog/cns!CC1EDB3DAA9B8AA!405.entry).
  3. Event handlers: Like workflow, this is an after-the-fact solution. Your event handler is a .NET assembly (C #, VB.NET) to which SharePoint passes control. The object you develop has access to the data of the list (and the whole object model) and can do any needed calculation.
  4. Use SharePoint Designer to create custom entry forms. I don’t have direct experience with this approach, but I hear they are doing good things with NewForm.aspx these days 🙂
  5. Roll your own ASP.NET data entry function (as a stand-alone web page or as a web part) and use that instead.

If anyone knows other and/or better options, please post a comment and I’ll update the body of this post.

<Tamamlama />

Technorati Tags:

SharePoint ilə Bar grafik yaratmaq

Baxış:

(UPDATE 12/04/07: Çox maraqlı bir web hissəsi vasitəsilə bu müraciət ki, bir blog keçid sonunda bir maraqlı resurs Əlavə)

This blog entry describes how to create a bar graph in SharePoint. This works in both WSS and MOSS environments as it only depends upon the data view web part.

The overall approach is as follows:

  1. Create a list or document library that contains the data you want to graph.
  2. Place the associated document library / custom list onto a page and convert it to a data view web part (DVWP).
  3. Modify the DVWP’s XSL to generate HTML that shows as a graph.

Biznes Ssenari / Setup:

Mən standart Title sütun və bir əlavə sütun ilə xüsusi bir siyahısını yaratdıq,,en,"Status",,en,bu modellər,,en,çox simplistically,,en,Xərcləri üçün bir "Avtorizasiya,,en,title layihə və statusu siyahıdan bir dəyər təmsil ssenari,,en,Təklif olunan,,en,Prosesində,,en,dayandırılıbdır,,en,obyektiv, bu status kodları göstərir ki, interaktiv üfüqi bar grafik istehsal edir,,en,Mən siyahısını əhalisi var və bu kimi görünür,,en,Data View Web Part yarat,,en,Bir səhifə üçün xüsusi siyahı əlavə DVWP yarat,,en,mənim halda site səhifə,,en,və təlimatlara əməl edin,,en,Bundan əlavə, sadəcə DVWP yaratmaq üçün,,en,biz də bütün mövcud satır göstərmək paging əmlak qurmaq lazımdır,,en,bu kimi bir şey görünür,,en,Mən həmişə yaxın SPD və browser,,en,Mən browser istifadə edərək səhifə yenidən açmaq,,en, "Status". This models (very simplistically) an "Authorization For Expense" scenario where the title represents the project and the Status a value from the list of:

  • Proposed
  • In Process
  • Stalled

The objective is to produce an interactive horizontal bar graph that shows these status codes.

I have populated the list and it looks like this:

image

Create Data View Web Part:

Create the DVWP by adding the custom list to a page (site page in my case) and follow the instructions burada (http://paulgalvin.spaces.live.com/blog/cns!1CC1EDB3DAA9B8AA!395.entry).

In addition to simply creating the DVWP, we also need to set the paging property to show all available rows. Mənim üçün, this looks something like this:

image

Bu noktada, I always close SPD and the browser. I then re-open the page using the browser. This avoids accidentally mucking up the web part layout on the page.

Modify the XSLT:

It’s now time to modify the XSLT.

I always use visual studio for this. (Görmək burada for an important note about intellisense that will help you a lot).

I create an empty project add four new files (replacing the words "Original" and "New" as appropriate):

  • Original.xslt
  • New.xslt
  • Original Params.xml
  • New Params.xml

Mənə gəldikdə isə, bu kimi görünür:

image

Modify the web part and copy the params and XSL to the "Original" version in Visual Studio.

The objective here is to cause the XSL to transform the results we get back from the DVWP query into HTML that renders as a graph.

Bu məqsədlə, it helps to first consider what the HTML should look like before we get confused by the insanity that is known as "XSL". (To be clear, the following is simply an example; don’t type it or copy/paste into visual studio. I provide a full blow starting point for that later in the write-up). The following sample graph is rendered as per the HTML immediately following:

Sample Bar Graph

Corresponding HTML:

<html>
<orqan>
<mərkəz>
<table width=80%>
<tr><TD><mərkəz>Horizontal Bar Graph</TD></tr>
<tr>
<td align="center">
<table border="1" width=80%>
<tr>
<td width=10%>Open</TD>
<TD><table cellpadding="0" cellspacing="0" border=0 width=50%><tr bgcolor = red><TD>&nbsp;</TD></tr></masa></TD>
</tr>
<tr>
<td width=10%>Qapalı</TD>
<TD><table cellpadding="0" cellspacing="0" border=0 width=25%><tr bgcolor = red><TD>&nbsp;</TD></tr></masa></TD>
</tr>
<tr>
<td width=10%>Stalled</TD>
<TD><table cellpadding="0" cellspacing="0" border=0 width=25%><tr bgcolor = red><TD>&nbsp;</TD></tr></masa></TD>
</tr>
</masa>
</TD>
</tr>
</masa>
</orqan>
</html>

I used a dead simple approach to creating my bars by setting the background color of a row to "red".

The take-away here is this: Sonda, all we are doing is creating HTML with rows and columns.

Template XSLT:

I’ve copied the XSLT that generates a horizontal bar graph. It’s fairly well commented so I won’t add much here except for these notes:

  • I started with the default XSL that SharePoint Designer gave me when I first created the DVWP.
  • I was able to cut this down from SPD’s 657 lines to 166 lines.
  • I didn’t mess around with the parameters XML file (which is separate from the XSL and you’ll know what I mean when you go to modify the DVWP itself; there are two files you can modify). Lakin, in order to simplify it, I did remove nearly all of them from the XSL. This means that if you want to make use of those parameters, you just need to add their variable definitions back to the XSL. That will be easy since you will have the original XSL variable definitions in your visual studio project.
  • You ought to be able to copy and paste this directly into your visual studio project. Sonra, remove my calls and insert your own calls to "ShowBar".
  • The drill down works by creating an <a href> like this: http://server/List?FilterField1=fieldname&FilterValue1=actualFilterValue. This technique may be of value in other contexts. Əvvəlcə, I thought I would need to conform to a more complex format: http://server/List/AllItems.aspx?View={guid}&FilterField1=blah&FilterValue1=blah, but in my environment that is not necessary. The List’s URL is passed to us by SharePoint so this is quite easy to generalize.

Here it is:

<XSL:stylesheet variant="1.0" exclude-result-prefixes="rs z o s ddwrt dt msxsl" 
xmlns:msxsl="urn:schemas-microsoft-com:xslt" xmlns:XSL="http://www.w3.org/1999/XSL/Transform"
xmlns:SharePoint="Microsoft.SharePoint.WebControls" xmlns:__designer="http://schemas.microsoft.com/WebParts/v2/DataView/designer"
xmlns:asp="http://schemas.microsoft.com/ASPNET/20" xmlns:ddwrt="http://schemas.microsoft.com/WebParts/v2/DataView/runtime"
xmlns:bu="urn:schemas-microsoft-com:idarə" xmlns:s="uuid:BDC6E3F0-6DA3-11d1-A2A3-00AA00C14882"
xmlns:dt="uuid:C2F41010-65B3-11d1-A29F-00AA00C14882" xmlns:rs="urn:schemas-microsoft-com:rowset" xmlns:z="#RowsetSchema"
xmlns:ddwrt2="urn:frontpage:internal"
> <XSL:output üsul="html" indent="no" /> <XSL:Mexanizmi Boylam decimal format NaN="" /> <XSL:Param ad="ListUrlDir"></XSL:Param> <!-- I need this to support a drill-down. --> <XSL:şablon matç="/" xmlns:SharePoint="Microsoft.SharePoint.WebControls"
xmlns:__designer=http://schemas.microsoft.com/WebParts/v2/DataView/designer xmlns:asp="http://schemas.microsoft.com/ASPNET/20"
> <XSL:dəyişən ad="dvt_StyleName">Masa</XSL:dəyişən> <XSL:dəyişən ad="Rows" seçmək="/dsQueryResponse/Rows/Row" /> <XSL:dəyişən ad="dvt_RowCount" seçmək="count($Rows)" /> <XSL:dəyişən ad="IsEmpty" seçmək="$dvt_RowCount = 0" /> <XSL:dəyişən ad="dvt_IsEmpty" seçmək="$dvt_RowCount = 0" /> <XSL:seçmək> <XSL:zaman sınaq="$dvt_IsEmpty"> There is no data to graph!<br/> </XSL:zaman> <XSL:başqa cür> <!-- The interesting stuff begins here. We need to define a pair of variables for each row in the graph: total number of items and percent of total. --> <XSL:dəyişən ad="totalProposed" seçmək="count(/dsQueryResponse/Rows/Row[normalize-space(@Status) = 'Proposed'])" /> <XSL:dəyişən ad="percentProposed" seçmək="$totalProposed div $dvt_RowCount" /> <XSL:dəyişən ad="totalInProcess" seçmək="count(/dsQueryResponse/Rows/Row[normalize-space(@Status) = 'In Process'])" /> <XSL:dəyişən ad="percentInProcess" seçmək="$totalInProcess div $dvt_RowCount" /> <XSL:dəyişən ad="totalStalled" seçmək="count(/dsQueryResponse/Rows/Row[normalize-space(@Status) = 'Stalled'])" /> <XSL:dəyişən ad="percentStalled" seçmək="$totalStalled div $dvt_RowCount" /> <!-- We define our HTML table here. I'm borrowing from some standard SharePoint styles here to make it consistent. I think it will honor changes to the global css file as well as theme overrides. --> <masa en="100%" cellspacing="0" cellpadding="2" üslub="border-right: 1 solid #C0C0C0; border-bottom: 1 solid #C0C0C0; border-left-style: solid; border-left-width: 1; border-top-style: solid; border-top-width: 1;"> <tr> <TD align="mərkəz"> <masa sərhəd="1" en="100%"> <!-- For each status that we want to graph, we call the "ShowBar" şablon. We pass it: 1. A label for the row. This is transformed into a hyperlink. 2. The percent (variable from above). 3. The actual field name of the code from the underlying list. This does not need to match the display label. 4. Field value matched for #3. 5. Total items of this status code (not the grand total of all status codes). It emits a <tr></tr> and the horizontal bar graph line. We call this template for each status code we want to view. --> <XSL:Zəng şablon ad="ShowBar"> <XSL:ilə-Param ad="BarDisplayLabel" seçmək="'Proposed'"/> <XSL:ilə-Param ad="BarPercent" seçmək="$percentProposed"/> <XSL:ilə-Param ad="QueryFilterFieldName" seçmək="'Status'"/> <XSL:ilə-Param ad="QueryFilterFieldValue" seçmək="'Proposed'"/> <XSL:ilə-Param ad="TotalItems" seçmək="$totalProposed"></XSL:ilə-Param> </XSL:Zəng şablon> <XSL:Zəng şablon ad="ShowBar"> <XSL:ilə-Param ad="BarDisplayLabel" seçmək="'Stalled'"/> <XSL:ilə-Param ad="BarPercent" seçmək="$percentStalled"/> <XSL:ilə-Param ad="QueryFilterFieldName" seçmək="'Status'"/> <XSL:ilə-Param ad="QueryFilterFieldValue" seçmək="'Stalled'"/> <XSL:ilə-Param ad="TotalItems" seçmək="$totalStalled"></XSL:ilə-Param> </XSL:Zəng şablon> <XSL:Zəng şablon ad="ShowBar"> <XSL:ilə-Param ad="BarDisplayLabel" seçmək="'In Process'"/> <XSL:ilə-Param ad="BarPercent" seçmək="$percentInProcess"/> <XSL:ilə-Param ad="QueryFilterFieldName" seçmək="'Status'"/> <XSL:ilə-Param ad="QueryFilterFieldValue" seçmək="'In Process'"/> <XSL:ilə-Param ad="TotalItems" seçmək="$totalInProcess"></XSL:ilə-Param> </XSL:Zəng şablon> </masa> </TD> </tr> </masa> </XSL:başqa cür> </XSL:seçmək> </XSL:şablon> <!-- This template does the work of displaying individual lines in the bar graph. You'll probably do most of your tweaking here. --> <XSL:şablon ad="ShowBar"> <XSL:Param ad="BarDisplayLabel" /> <!-- label to show --> <XSL:Param ad="BarPercent"/> <!-- Percent of total. --> <XSL:Param ad="QueryFilterFieldName"/> <!-- Used to jump to the query & filter --> <XSL:Param ad="QueryFilterFieldValue"/> <!-- Used to jump to the query & filter --> <XSL:Param ad="TotalItems" /> <!-- total count of this barlabel --> <tr> <!-- The bar label itself. --> <TD sinfi="ms-formbody" en="30%"> <!-- This next set of statements builds a query string that allows us to drill down to a filtered view of the underlying data. We make use of a few things here: 1. We can pass FilterField1 and FilterValue1 to a list to filter on a column. 2. SharePoint is passing a key parameter to us, ListUrlDir that points to the underlying list against which this DVWP is "running". Isn't XSL fun? --> <XSL:text aradan çıxdı-qaçan="bəli"> <![CDATA[<a href ="]]></XSL:text> <XSL:dəyər və seçmək="$ListUrlDir"/> <XSL:text aradan çıxdı-qaçan="bəli"><![CDATA[?FilterField1=]]></XSL:text> <XSL:dəyər və seçmək="$QueryFilterFieldName"/> <XSL:text aradan çıxdı-qaçan="bəli"><![CDATA[&FilterValue1=]]></XSL:text> <XSL:dəyər və seçmək="$QueryFilterFieldValue"/> <XSL:text aradan çıxdı-qaçan="bəli"><![CDATA[">]]></XSL:text> <XSL:dəyər və seçmək="$BarDisplayLabel"/> <XSL:text aradan çıxdı-qaçan="bəli"><![CDATA[</bir>]]></XSL:text> <!-- The next bit shows some numbers in the format: "(total / % of total)" --> (<XSL:dəyər və seçmək="$TotalItems"/> / <!-- This creates a nice percent label for us. Təşəkkür, Microsoft! --> <XSL:Zəng şablon ad="percentformat"> <XSL:ilə-Param ad="percent" seçmək="$BarPercent"/> </XSL:Zəng şablon>) </TD> <!-- Nəhayət, emit a <TD> tag for the bar itself.--> <TD> <masa cellpadding="0" cellspacing="0" sərhəd="0" en="{round($BarPercent*100)+1}%"> <tr bgcolor="red"> <XSL:text aradan çıxdı-qaçan="bəli"><![CDATA[&nbsp;]]></XSL:text> </tr> </masa> </TD> </tr> </XSL:şablon> <!-- This is taken directly from some XSL I found in an MS template. --> <XSL:şablon ad="percentformat"> <XSL:Param ad="percent"/> <XSL:seçmək> <XSL:zaman sınaq="format nömrəsi($percent, '#,##0%;-#,##0%')= 'NaN'">0%</XSL:zaman> <XSL:başqa cür> <XSL:dəyər və seçmək="format nömrəsi($percent, '#,##0%;-#,##0%')" /> </XSL:başqa cür> </XSL:seçmək> </XSL:şablon> </XSL:stylesheet>

The Results:

The XSL from above generates this graph:

image

Drill down to the underlying data by clicking on the status code:

image

Concluding Thoughts:

Can This Be Generalized?

I love this graphing concept, but I hate the fact that I have to go in and do so much hand-coding. I’ve given a little thought to whether it can be generalized and I’m optimistic, but I’m also a little fearful that there may be a brick wall somewhere along the path that won’t offer any work-around. If anyone has some good ideas on this, please make a note in the comments or Mənə e-poçt.

Vertical Graphs:

This is a horizontal bar graph. It’s certainly possible to create a vertical graph. We just need to change the HTML. I would start the same way: Create an HTML representation of a vertical bar graph and then figure out how to get that via XSL. If anyone is interested in that, I could be persuaded to try it out and work out the kinks. If someone has already done that, please let me know and I’ll gladly link to your blog 🙂

I think that challenge with a vertical graph is that the labels for the graph are more difficult to manage, but certainly not impossible.

Field Name Gotcha’s:

There are at least two things to look out for with your field names.

Ilk, a field name with a space has to be escaped in the XSL. This will probably be an issue here:

        <XSL:dəyişən ad="totalProposed" 
seçmək="count(/dsQueryResponse/Rows/Row[normalize-space(@Status) = 'Proposed'])" />

If your "Status" column is actually named "Status Code" then you need to reference it as "Status_x0020_Code":

   <XSL:dəyişən ad="totalProposed" 
seçmək="count(/dsQueryResponse/Rows/Row[normalize-space(@Status_x0020_Code) = 'Proposed'])" />

Ikinci, and I’m a little fuzzy on this, but you also need to be on the alert for field name changes. If you name your field "Status Code" and then later on, rename it to "AFE Status", the "internal name" does not change. The internal name will still be "Status Code" and must be referenced as "Status_x0020_Code". The "other resources" links may help diagnose and correct this kind of problem.

About that Color:

I picked "red" because it’s pleasing to me at the moment. It would not be a big deal to show different colors so as to provide more than just a visual description of a number, but to also provide a useful KPI. Məsələn, if the percentage of "stalled" AFE’s is > 10% then show it red, otherwise show it in black. Istifadə <XSL:seçmək> to accomplish this.

Other Resources:

Happy transforming!

<Tamamlama />

Blog abunə!

Xüsusi siyahısı Via OM müasir Data (və ya, Lakin bir OM Data Displayor [YACC kimi, lakin müxtəlif])

Bugün, I spent a handful of hours tracking down the root cause behind the message "The column name that you entered is already in use or reserved. Choose another name."

Bu sütun yaradıla bilər, bir mühit silinmiş və yenidən yaradıldı, so I knew it wasn’t a reserved name. Lakin, I simply couldn’t find the column anywhere via the standard SharePoint user interface at any site in the site collection.

I posted to MSDN forums here and the indomitable Andrew Woodward pointed me in the direction of the underlying object model data.

I went off to codeplex to find some tools that would help me peer into the underlying OM data and help me locate the trouble.

I tried several tools and they were very cool and interesting but in the end, the UI wasn’t good enough for my purpose. I’m not criticizing them by any means, but clearly the tool-makers didn’t have my problem in mind when they created their UI :). Most people seem to be investing a fair amount of time and effort in creating workstation / client applications that provide tree views, right-click context menus and so forth. These are nice and all, but it’s a lot of work to create a top-of-the-line user experience that is also very flexible.

I really needed an answer to this problem. It occurred to me that if I could get all of the site columns in the site collection into a custom list, I could filter, sort and create views that would help me find this supposedly existing column (which it did, BTW). I went ahead and did that and an hour or two later, had all my site columns loaded into a custom list with grouping, sorting and so forth. I found my answer five minutes later.

If and when I successfully take over the world, I think I will decree that all SharePoint tools providers must seriously consider surfacing their object model data in a custom list. That way, I have the power to search any way I want (constrained, əlbəttə, by standard sharepoint features).