Преглед и цел
На кутията, МОС’ Заявка за съдържание уеб част (CQWP) показва резултатите от нея в списък формат, подобни на резултатите от търсенето. Също така е възможно да покажете резултатите в мрежа формат (т.е.. HTML таблица формат). Формати на мрежата са по-добре в някои обстоятелства. Ще опиша как да се постигне този ефект в тази статия.
Бизнес сценарий
Работил съм с клиент на предприятие широк Мос внедряването. Ние сме проектирали им класификация, така че проектите са първа класа граждани в йерархията и имат свои собствени връх на ниво сайт. Ръководители на проекти поддържа Сингълтън списък с обобщена информация за проекта, например заглавие, бюджет, Очаквана дата на завършване, оставащият бюджет и други сумарен тип полета. От "Сингълтън" Искам да кажа на потребителски SharePoint списък гарантирано да съдържа само един елемент. Опростенчески, Тя изглежда така:
Техническия подход е почти същия, както е описано Тук (http://paulgalvin.spaces.live.com/blog/cns!1CC1EDB3DAA9B8AA!447.entry). CQWP използва XSL трансформация, за да излъчват HTML за браузър, за да направи.
Аз винаги си представим резултата преди да се гмурне в XSL защото XSL е кошмар. Ето моите желания резултат:
HTML като това генерира този резултат:
|
|
<HTML>
<тяло>
<център>
<таблица граница= 1>
<!-- Етикети-->
<TR BGColor= синьо>
<TD><шрифт цвят= бяло><б>Име на проекта</б></шрифт></TD>
<TD Подравняване= надясно><шрифт цвят= бяло><б>Попълнете датата</б></шрифт></TD>
<TD Подравняване= надясно><шрифт цвят= бяло><б>Бюджет</б></шрифт></TD>
<TD Подравняване= надясно><шрифт цвят= бяло><б>Действителни разходи</б></шрифт></TD>
<TD><шрифт цвят= бяло><б>Цялостното състояние</б></шрифт></TD>
</TR>
<TR>
<TD>Ре-тел компютърна зала.</TD>
<TD Подравняване= надясно>02/01/08</TD>
<TD Подравняване= надясно>22,500.00</TD>
<TD Подравняване= надясно>19,000.00</TD>
<TD>В ход</TD>
</TR>
<TR>
<TD>Разпоредба сървъри за надграждане на SQL</TD>
<TD Подравняване= надясно>04/01/08</TD>
<TD Подравняване= надясно>7,500.00</TD>
<TD Подравняване= надясно>0.00</TD>
<TD>Планирани</TD>
</TR>
</таблица>
</център>
</тяло>
</HTML>
|
Подход
Изпълнете следните стъпки за създаване на мрежа:
- Идентифициране на компонентите на мрежата (редове/колони).
- Определяне и създаване на необходимите сайт колони.
- Създаване на подсайтове за проектите и лъжливо списъци.
- Добави CQWP към web страница и да го конфигурирате за търсене за вашите списъци.
- Модифициране на CQWP XML, за да събират допълнителни колони.
- Промяна на XSL за генериране на таблица.
Аз отивам да се концентрира върху номер шест. Числата едно чрез четири са прав-напред и нещо, което вече е направено от всеки потребител, CQWP. Номер пет е била добре документирани от други включително този изчерпателен екрана изстрел натоварено статия от MSDN Тук (http://msdn2.microsoft.com/en-us/library/bb897399.aspx) и блога на Хедър Соломон Тук (http://www.heathersolomon.com/blog/articles/CustomItemStyle.aspx).
Гайки и болтове
Започват и изпълнение на стъпките от едно до пет според документацията на MSDN и Хедър Соломон статия.
В този момент, Вие сте добавили вашия CQWP на страницата и имате си <CommonViewFields> конфигуриран при необходимост.
След обичайните стъпки, Получавам тези междинни резултати:
1. Създаване на тип съдържание, шаблонирана потребителски списък за този тип съдържание и два сайтове. Тук е типа на съдържанието:
Ето структурата на сайта:
2. Добавете CQWP след създаването си проект подсайтове и лъжливо проект обобщени списъци:
3. Добавяне на цялата допълнителна информация, искам чрез <CommonViewFields>:
<имоти Име="CommonViewFields" тип="низ">Project_x0020_Name;Project_x0020_Expenses;Project_x0020_Status;Project_x0020_Start_x0020_Date;Project_x0020_End_x0020_Date;Project_x0020_Budget</имоти>
Имайте предвид, че трябва да запазите всички полета за свойства на един ред, или няма да работи (CQWP ще ми каже, че заявката не върна елементи).
4. В този момент, Ние сме готови да преминете отвъд статията на MSDN and флип на Хедър Соломон статия. Следвайте си стъпки, започва близо до стъпка #5 за да създадете персонализиран / unghosted версия на ItemStyle.xsl. Аз следват Хедър съвети, нагоре през стъпка 11 и да получите тези междинни резултати:
4.1: Името ми XSL шаблон както следва:
<XSL:име на шаблон = "мрежа" съвпадение = "ред[@Style = "Мрежа"]" режим = "itemstyle">
Аз също така леко я предложи промяна <XSL:за всеки …> чрез добавяне на <BR /> етикет да предостави чист списък:
<XSL:за всеки Изберете="@*">
P:<XSL:стойността на Изберете="Име()" /><br/>
</XSL:за всеки>
4.2: Модифициране на уеб част, отидете на външния вид и изберете моя "мрежа" стил:
Прилагане на промените и тук е резултат:
Можем да видим от по-горе, че полетата искаме (Име на проекта, разходи, статус, н) са достъпни за нас да използва, когато ние излъчваме HTML. Не само, че, но ние виждаме имената, с които ние трябва да препращат тези колони в XSL. За пример, Ние позоваване статус на проекта като "Project_x005F_x0020_Name".
В този момент, тръгва се от блога на Хедър и от раменете на тези гиганти, Аз добавя моя собствена малко.
ContentQueryMain.xsl
ЗАБЕЛЕЖКА: Когато правите промени в ContentQueryMain.xsl, както и ItemStyle.xsl, Вие трябва да проверите тези файлове обратно в преди да видите ефекта от промените.
За целите на правене на мрежа, Мос използва две различни XSL файлове, за да доведе до резултати, виждаме от CQWP. За генериране на предишния малко на продукцията, Ние промяна ItemStyle.xsl. Мос действително използва друг XSL файл, ContentQueryMain.xsl да във връзка с ItemStyle.xsl да генерирате си HTML. Както предполага неговото име, ContentQueryMain.xsl е главният"" XSL, който контролира общия поток на превод. Тя повтаря през всички елементи, намерени и ги преминава един по един да шаблони в ItemStyle.xsl. Ние ще променят ItemStyle.xsl за генериране на открито <таблица> етикет преди излъчване на първия ред от данни и затваряне <таблица> етикет след излъчване на последния ред. За да постигнем това, ContentQueryMain.xsl е променен, за да премине два параметъра на нашата "мрежа" шаблон в ItemStyle.xsl, "последния ред" и "текущ ред". ItemStyle.xsl използва тези условно излъчват необходимите Тагове.
С помощта на Хедър Соломон техника, Ние поставяме ContentQueryMain.xsl. Той се намира на същото място като ItemStyle.xsl. Този екран изстрел трябва да помогне:
Ние трябва да направите следните промени:
- Модифициране на шаблон на xsl, "CallItemTemplate" Това всъщност се позовава ни мрежа шаблон в ItemStyle.xsl. Ние ще преминават два параметъра на шаблона на мрежата, така че той ще има данни, необходими за условно генериране на отваряне и затваряне <таблица> Тагове.
- Промените още малко на ContentQueryMain.xsl, която призовава "CallItemTemplate" да го предаде "LastRow" параметър, така че LastRow може да бъдат прехвърлени към нашите мрежата шаблон.
Намерете шаблона на име "OuterTemplate.CallItemTemplate" идентифицирани от низ:
<XSL:шаблон Име="OuterTemplate.CallItemTemplate">
Замени целия шаблон както следва:
|
|
<XSL:шаблон Име="OuterTemplate.CallItemTemplate">
<XSL:param Име="CurPosition" />
<!--
Добави "LastRow" параметър.
Ние само го използвам, когато елемент стил проход в е "Мрежа".
-->
<XSL:param Име="LastRow" />
<XSL:Изберете>
<XSL:Когато тест="@Style = "NewsRollUpItem"">
<XSL:приложи-шаблони Изберете="." режим="itemstyle">
<XSL:с Албена Име="EditMode" Изберете="$cbq_iseditmode" />
</XSL:приложи-шаблони>
</XSL:Когато>
<XSL:Когато тест="@Style = "NewsBigItem"">
<XSL:приложи-шаблони Изберете="." режим="itemstyle">
<XSL:с Албена Име="CurPos" Изберете="$CurPosition" />
</XSL:приложи-шаблони>
</XSL:Когато>
<XSL:Когато тест="@Style = "NewsCategoryItem"">
<XSL:приложи-шаблони Изберете="." режим="itemstyle">
<XSL:с Албена Име="CurPos" Изберете="$CurPosition" />
</XSL:приложи-шаблони>
</XSL:Когато>
<!--
Проход текущата позиция и lastrow в мрежата itemstyle.xsl шаблон.
ItemStyle.xsl ще я използва, да излъчват отваряне и затваряне <таблица> Тагове.
-->
<XSL:Когато тест="@Style = "Мрежа"">
<XSL:приложи-шаблони Изберете="." режим="itemstyle">
<XSL:с Албена Име="CurPos" Изберете="$CurPosition" />
<XSL:с Албена Име="Последно" Изберете="$LastRow" />
</XSL:приложи-шаблони>
</XSL:Когато>
<XSL:в противен случай>
<XSL:приложи-шаблони Изберете="." режим="itemstyle">
</XSL:приложи-шаблони>
</XSL:в противен случай>
</XSL:Изберете>
</XSL:шаблон>
|
Коментарите описват целта на промените.
Разбира се, "OuterTemplate.CallItemTemplate" е самата нарича от друг шаблон. Намерете този шаблон чрез търсене на този текстов низ:
<XSL:шаблон Име="OuterTemplate.Body">
Превъртете през инструкциите в OuterTemplate.Body и вмъкнете параметъра LastRow както следва (показани като коментар в курсив):
<XSL:повикване-шаблон Име="OuterTemplate.CallItemTemplate">
<XSL:с Албена Име="CurPosition" Изберете="$CurPosition" />
<!-- Вмъкнете параметъра LastRow. -->
<XSL:с Албена Име="LastRow" Изберете="$LastRow"/>
</XSL:повикване-шаблон>
След всичко това, най-накрая имаме неща настроен правилно, така че да могат да излъчват нашите ItemStyle.xsl <таблица> Етикети на точното място.
ItemStyle.Xsl
ЗАБЕЛЕЖКА: Отново, Проверете в ItemStyle.xsl след като всички промени, така че да виждате ефекта от тези промени.
Тук имаме две задачи:
- Замени цялата мрежа шаблон. Можете да копирате/паста от долу.
- Добави някои mumbo джъмбо извън дефиницията на шаблон, който позволява "formatcurrency" шаблон за работа. (Можете да кажете, че имам слаба дръжка на XSL).
Първо, близо до горната част на ItemStyle.xsl, Добави този ред:
<!-- Някои mumbo джъмбо, който ни позволява да покажете САЩ. валута. -->
<XSL:десетичен формат Име="персонал" цифра="D" />
<XSL:шаблон Име="По подразбиране" мач="*" режим="itemstyle">
Имайте предвид, че аз го добавя непосредствено преди <XSL:име на шаблон = "по подразбиране" …> дефиниция.
Следващ, върнете се към нашия мрежа шаблон. Замените шаблона на цялата мрежа с кода по-долу. Тя е добре коментира, но не се колебайте да пишете ми или оставите коментар в моя блог, ако имате въпроси.
|
|
<XSL:шаблон Име="Мрежа" мач="Ред[@Style = "Мрежа"]" режим="itemstyle">
<!--
ContentMain.xsl минава CurPos и последно.
Използваме условно излъчват отваряне и затваряне <таблица> Тагове.
-->
<XSL:param Име="CurPos" />
<XSL:param Име="Последно" />
<!-- Следващите променливи са непроменени от стандартните ItemStyle.xsl -->
<XSL:променлива Име="SafeImageUrl">
<XSL:повикване-шаблон Име="OuterTemplate.GetSafeStaticUrl">
<XSL:с Албена Име="UrlColumnName" Изберете=""ImageUrl""/>
</XSL:повикване-шаблон>
</XSL:променлива>
<XSL:променлива Име="SafeLinkUrl">
<XSL:повикване-шаблон Име="OuterTemplate.GetSafeLink">
<XSL:с Албена Име="UrlColumnName" Изберете=""LinkUrl""/>
</XSL:повикване-шаблон>
</XSL:променлива>
<XSL:променлива Име="DisplayTitle">
<XSL:повикване-шаблон Име="OuterTemplate.GetTitle">
<XSL:с Албена Име="Заглавие" Изберете="@Title"/>
<XSL:с Албена Име="UrlColumnName" Изберете=""LinkUrl""/>
</XSL:повикване-шаблон>
</XSL:променлива>
<XSL:променлива Име="LinkTarget">
<XSL:Ако тест="@OpenInNewWindow = "True"" >_blank</XSL:Ако>
</XSL:променлива>
<!--
Тук ние определяме променлива, "tableStart". Това съдържа HTML, които използваме за определяне на откриването на таблицата, както и етикетите на колоните. Обърнете внимание, че ако CurPos = 1, Тя включва HTML в CDATA етикет.
В противен случай, Той ще бъде празен.
Стойността на tableStart е отделяния, всеки път, когато ItemStyle се нарича чрез ContentQueryMain.xsl.
-->
<XSL:променлива Име="tableStart">
<XSL:Ако тест="$CurPos = 1">
<![НЕЗАТВОРЕН[
<граница на таблица = 1>
<TR bgcolor = "синя">
<TD><цвят на шрифта = "бяло"><б>Име на проекта</б></шрифт></TD>
<Подравняване на TD = "право"><цвят на шрифта = "бяло"><б>Попълнете датата</б></шрифт></TD>
<Подравняване на TD = "право"><цвят на шрифта = "бяло"><б>Бюджет</б></шрифт></TD>
<Подравняване на TD = "право"><цвят на шрифта = "бяло"><б>Действителни разходи</б></шрифт></TD>
<TD><цвят на шрифта = "бяло"><б>Цялостното състояние</б></шрифт></TD>
</TR>
]]>
</XSL:Ако>
</XSL:променлива>
<!--
Друга променлива, tableEnd просто определя крайната маса етикет.
Както и при tableStart, Тя винаги е отделяния. Ето защо неговата стойност се присвоява условно въз основа на това дали сме били преминали последния ред от ContentQueryMain.xsl.
-->
<XSL:променлива Име="tableEnd">
<XSL:Ако тест="$CurPos = $Last">
<![НЕЗАТВОРЕН[ </таблица> ]]>
</XSL:Ако>
</XSL:променлива>
<!--
Винаги излъчват съдържанието на tableStart. Ако това не е първия ред премина към нас от ContentQueryMain.xsl, след това ние знаем стойността му ще бъде празна.
Забраняване на изход да избяга, защото когато tableStart тя не празно, Тя включва действителните HTML, които искаме да бъдат предоставени от браузъра. Ако ние не казвайте на XSL анализатора да забраните продукция бягство, Той ще генерира неща като"<таблица>" Вместо това на"<таблица>".
-->
<XSL:стойността на Изберете="$tableStart" забрани продукция бягство="Да"/>
<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:стойността на Изберете="@Project_x005F_x0020_Name"/>
</TD>
<TD Подравняване="десен">
<XSL:стойността на Изберете="@Project_x005F_x0020_End_x005F_x0020_Date"/>
</TD>
<TD Подравняване="десен">
<XSL:повикване-шаблон Име="FormatCurrency">
<XSL:с Албена Име="стойност"
Изберете="@Project_x005F_x0020_Budget"></XSL:с Албена>
</XSL:повикване-шаблон>
</TD>
<TD Подравняване="десен">
<XSL:повикване-шаблон Име="FormatCurrency">
<XSL:с Албена Име="стойност" Изберете="@Project_x005F_x0020_Expenses">
</XSL:с Албена>
</XSL:повикване-шаблон>
</TD>
<TD>
<XSL:стойността на Изберете="@Project_x005F_x0020_Status"/>
</TD>
<!--
Всички от следните е коментира да изясни нещата.
Въпреки това, носят го обратно и вещество то в <TD> за да видите нейния ефект.
-->
<!--
<DIV id = "linkitem" клас = "позиции">
<XSL:Ако тест = "-дължина на низа($SafeImageUrl) != 0">
<DIV клас = "изображение-зона-ляво">
<a href = "{$SafeLinkUrl}" TARGET = "{$LinkTarget}">
<IMG клас = "изображение-фиксирана ширина" SRC = "{$SafeImageUrl}"
ALT = "{@ImageUrlAltText}"/>
</а>
</DIV>
</XSL:Ако>
<DIV клас = "връзката-елемент">
<XSL:повикване-шаблон
name="OuterTemplate.CallPresenceStatusIconTemplate"/>
<a href = "{$SafeLinkUrl}"
TARGET = "{$LinkTarget}" заглавие = "{@LinkToolTip}">
<XSL:стойността на изберете = "$DisplayTitle" />
</а>
<DIV клас = "Описание">
<XSL:стойност на select="@Description" />
</DIV>
</DIV>
</DIV>
-->
</TR>
<!--
Излъчват затваряне маса етикет. Ако не сме на последния ред,
Това ще бъде празно.
-->
<XSL:стойността на Изберете="$tableEnd" забрани продукция бягство="Да"/>
</XSL:шаблон>
<XSL:шаблон Име="FormatCurrency">
<XSL:param Име="стойност" Изберете="0" />
<XSL:стойността на Изберете='Форматиране на число($стойност, "$DDD,DDD,DDD. DD", "персонал")' />
</XSL:шаблон>
|
