সংক্ষিপ্ত বিবরণ এবং লক্ষ্য
বাক্সের বাইরে, শৈবাল’ বিষয়বস্তু প্রশ্নের ওয়েব পার্ট (CQWP) একটি তালিকা বিন্যাসে তার ফলাফল প্রদর্শন করা হয়, similar to search results. It is also possible to display the results in a grid format (I.E. HTML টেবিল বিন্যাসে). Grid formats are better in some circumstances. I describe how to achieve that effect in this article.
ব্যবসা দৃশ্যকল্প
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, যেমন শিরোনামের, বাজেট, প্রত্যাশিত সমাপ্তির তারিখ, remaining budget and other summary type fields. By "singleton" I mean a custom SharePoint list guaranteed to contain only one item. Simplistically, এটা ভালো দেখায়:
বর্ণনা অনুযায়ী প্রযুক্তিগত পদ্ধতির অনেক একই এখানে (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:
ভালো এইচটিএমএল যে ফলে উত্পন্ন:
|
|
<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>এসকিউএল আপগ্রেড বিধান সার্ভার</td>
<td সারিবদ্ধ= অধিকার>04/01/08</td>
<td সারিবদ্ধ= অধিকার>7,500.00</td>
<td সারিবদ্ধ= অধিকার>0.00</td>
<td>পরিকল্পনা</td>
</tr>
</টেবিল>
</কেন্দ্র>
</শরীর>
</HTML>
|
অভিগমন
গ্রিড তৈরি করতে নিম্নলিখিত ধাপগুলি অনুসরণ করুন:
- গ্রিড উপাদান শনাক্ত (সারি / কলাম).
- প্রয়োজনীয় সাইট কলাম নির্ধারণ এবং তৈরি করুন.
- প্রকল্প এবং একক বস্তু তালিকায় উপ সাইট তৈরি করুন.
- একটি ওয়েব পৃষ্ঠা CQWP যোগ করুন এবং আপনার তালিকার জন্য অনুসন্ধান করতে এই ব্যবস্থা কনফিগার করুন.
- অতিরিক্ত কলাম আপ জড়ো CQWP এর এক্সএমএল পরিবর্তন করুন.
- একটি টেবিল উৎপন্ন XSL পরিবর্তন করুন.
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 এখানে (http://msdn2.microsoft.com/en-us/library/bb897399.aspx) এবং হিদার সলোমন এর ব্লগ এখানে (http://www.heathersolomon.com/blog/articles/CustomItemStyle.aspx).
ব্যবহারিক খুঁটিনাটি
ধাপ MSDN ডকুমেন্টেশন এবং হিদার সলোমন এর নিবন্ধ অনুযায়ী পাঁচ মাধ্যমে শুরু করুন এবং বাস্তবায়ন.
এই বিন্দু, আপনি পৃষ্ঠায় আপনার নিজের CQWP যুক্ত করেছি এবং আপনি আপনার <CommonViewFields> প্রয়োজনীয় হিসাবে কনফিগার করা.
স্বাভাবিক পদক্ষেপগুলি অনুসরণ, আমি এই অন্তর্বর্তী ফলাফল পেতে:
1. একটি বিষয়বস্তু টাইপ তৈরি করুন, a templatized custom list for that content type and two sites. Here is the content type:
এখানে সাইট গঠন:
2. আমার প্রকল্প subsites এবং একক প্রকল্প করুন সংক্ষিপ্ত তালিকা তৈরি করার পর 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. এই বিন্দু, 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 একটি কাস্টমাইজড তৈরি করতে / unghosted version of ItemStyle.xsl. I follow Heather’s advice, ধাপ মাধ্যমে আপ 11 এবং এই অন্তর্বর্তী ফলাফল পেতে:
4.1: আমার XSL টেমপ্লেট নিম্নরূপ নাম:
<xsl:template name="Grid" match="Row[@Style=’Grid’]" mode="itemstyle">
আমি সামান্য তার প্রস্তাবিত পরিবর্তন করুন <xsl:-প্রতিটি জন্য …> একটি যোগ করে <বিআর /> একটি ক্লিনার তালিকা প্রদান ট্যাগ:
<xsl:-প্রতিটি জন্য নির্বাচন করা="@ *">
পি:<xsl:মান-এর নির্বাচন করা="নাম()" /><বিআর/>
</xsl:-প্রতিটি জন্য>
4.2: আমি ওয়েবে অংশ পরিবর্তন করুন, go to appearance and select my "Grid" শৈলী:
পরিবর্তন প্রয়োগ করুন এবং এখানে ফলাফল:
আমরা ক্ষেত্র আমরা চাই যে উপরে থেকে দেখতে পারেন (প্রকল্প নাম, ব্যয়, অবস্থা, প্রভৃতি) 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. উদাহরণস্বরূপ, we reference Project Status as "Project_x005F_x0020_Name".
এই বিন্দু, আমরা হিদার ব্লগ থেকে এবং এই দৈত্যদের কাঁধের ওপর থেকে চরা, আমি আমার নিজের সামান্য বিট যোগ করুন.
ContentQueryMain.xsl
উল্লেখ্য: উভয় ContentQueryMain.xsl পরিবর্তনের পাশাপাশি ItemStyle.xsl যখন, আপনার পরিবর্তনের প্রভাব দেখতে আগে আপনি ফিরে ফাইলগুলি পরীক্ষা প্রয়োজন.
গ্রিড তৈরি উদ্দেশ্যে, 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 <টেবিল> তথ্য প্রথম সারির emitting আগে ট্যাগ এবং ক্লোজিং <টেবিল> tag after emitting the last row. To accomplish this, ContentQueryMain.xsl is modified to pass two parameters to our "grid" ItemStyle.xsl মধ্যে ফর্মা, "last row" and "current row". ItemStyle.xsl uses these to conditionally emit the necessary tags.
হিদার সলোমন টেকনিক ব্যবহার করে, we locate ContentQueryMain.xsl. It is located in the same place as ItemStyle.xsl. This screen shot should help:
আমরা নিম্নলিখিত পরিবর্তন করা প্রয়োজন:
- একটি XSL টেমপ্লেট পরিবর্তন করুন, "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 <টেবিল> ট্যাগ.
- Modify another bit of ContentQueryMain.xsl that calls the "CallItemTemplate" to pass it a "LastRow" LastRow আমাদের গ্রিড টেমপ্লেট হস্তান্তর করা হতে পারে পরামিতি যাতে.
Locate the template named "OuterTemplate.CallItemTemplate" স্ট্রিং দ্বারা চিহ্নিত:
<xsl:টেমপ্লেট নাম="OuterTemplate.CallItemTemplate">
নিম্নরূপ গোটা টেমপ্লেট প্রতিস্থাপন করুন:
|
|
<xsl:টেমপ্লেট নাম="OuterTemplate.CallItemTemplate">
<xsl:PARAM নাম="CurPosition" />
<!--
Add the "LastRow" পরামিতি.
We only use it when the item style pass in is "Grid".
-->
<xsl:PARAM নাম="LastRow" />
<xsl:নির্বাচন করা>
<xsl:যখন পরীক্ষা="@ শৈলী = 'NewsRollUpItem'">
<xsl:-টেমপ্লেট আবেদন নির্বাচন করা="." মোড="itemstyle">
<xsl:সঙ্গে PARAM নাম="EditMode" নির্বাচন করা="$cbq_iseditmode" />
</xsl:-টেমপ্লেট আবেদন>
</xsl:যখন>
<xsl:যখন পরীক্ষা="@ শৈলী = 'NewsBigItem'">
<xsl:-টেমপ্লেট আবেদন নির্বাচন করা="." মোড="itemstyle">
<xsl:সঙ্গে PARAM নাম="CurPos" নির্বাচন করা="$CurPosition" />
</xsl:-টেমপ্লেট আবেদন>
</xsl:যখন>
<xsl:যখন পরীক্ষা="@ শৈলী = 'NewsCategoryItem'">
<xsl:-টেমপ্লেট আবেদন নির্বাচন করা="." মোড="itemstyle">
<xsl:সঙ্গে PARAM নাম="CurPos" নির্বাচন করা="$CurPosition" />
</xsl:-টেমপ্লেট আবেদন>
</xsl:যখন>
<!--
গ্রিড itemstyle.xsl টেমপ্লেটে বর্তমান অবস্থান এবং lastrow পাস.
ItemStyle.xsl খোলা এবং বন্ধের নির্গত যে ব্যবহার করা হবে <টেবিল> ট্যাগ.
-->
<xsl:যখন পরীক্ষা="@ শৈলী = 'গ্রিড'">
<xsl:-টেমপ্লেট আবেদন নির্বাচন করা="." মোড="itemstyle">
<xsl:সঙ্গে PARAM নাম="CurPos" নির্বাচন করা="$CurPosition" />
<xsl:সঙ্গে PARAM নাম="শেষ" নির্বাচন করা="$LastRow" />
</xsl:-টেমপ্লেট আবেদন>
</xsl:যখন>
<xsl:অন্যথায়>
<xsl:-টেমপ্লেট আবেদন নির্বাচন করা="." মোড="itemstyle">
</xsl:-টেমপ্লেট আবেদন>
</xsl:অন্যথায়>
</xsl:নির্বাচন করা>
</xsl:টেমপ্লেট>
|
মন্তব্য পরিবর্তন উদ্দেশ্য বর্ণনা.
অবশ্যই, the "OuterTemplate.CallItemTemplate" is itself called from another template. Locate that template by searching for this text string:
<xsl:টেমপ্লেট নাম="OuterTemplate.Body">
OuterTemplate.Body নির্দেশাবলী মাধ্যমে স্ক্রোল LastRow পরামিতি নিম্নরূপ সন্নিবেশ (italics মধ্যে একটি মন্তব্য হিসেবে দেখানো):
<xsl:কল-ফর্মা নাম="OuterTemplate.CallItemTemplate">
<xsl:সঙ্গে PARAM নাম="CurPosition" নির্বাচন করা="$CurPosition" />
<!-- LastRow পরামিতি ঢোকান. -->
<xsl:সঙ্গে PARAM নাম="LastRow" নির্বাচন করা="$LastRow"/>
</xsl:কল-ফর্মা>
এই সব করার পর, পরিশেষে আমরা জিনিসগুলি সঠিকভাবে যাতে আমাদের ItemStyle.xsl নির্গত করতে পারেন স্থাপন করেছেন <টেবিল> ঠিক জায়গায় ট্যাগ.
ItemStyle.Xsl
উল্লেখ্য: আবার, আপনি ঐ পরিবর্তনের প্রভাব দেখতে যাতে কোনো পরিবর্তনের পরে ItemStyle.xsl চেক.
আমরা এখানে দুই কাজগুলো আছে:
- 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. (আপনি আমি XSL নেভিগেশন একটি স্থায়ী হাতল আছে বলতে পারেন যে).
প্রথম, ItemStyle.xsl উপরের অংশে, এই পংক্তিটি যোগ করুন:
<!-- আমাদের যুক্তরাষ্ট্রের বাইরের প্রদর্শন করতে সক্ষম হবেন যে কিছু mumbo Jumbo. মুদ্রা. -->
<xsl:দশমিক ফরম্যাট নাম="স্টাফ" অঙ্ক="ডি" />
<xsl:টেমপ্লেট নাম="ডিফল্ট" দিয়াশলাই="*" মোড="itemstyle">
আমি আগে সরাসরি এখনো যোগ করেনি উল্লেখ্য, <xsl:template name="Default" …> সংজ্ঞা.
পরবর্তী, go back to our Grid template. Replace the entire Grid template with the code below. It is thoroughly commented, কিন্তু আমাকে ইমেইল দ্বিধা বা আপনার কোন প্রশ্ন থাকে, তাহলে আমার ব্লগে মন্তব্য ছেড়ে না.
|
|
<xsl:টেমপ্লেট নাম="গ্রিড" দিয়াশলাই="সারি[@ শৈলী = 'গ্রিড']" মোড="itemstyle">
<!--
ContentMain.xsl CurPos ও শেষ পাসের.
আমরা শর্তসাপেক্ষে খোলা এবং বন্ধের নির্গত এই ব্যবহার <টেবিল> ট্যাগ.
-->
<xsl:PARAM নাম="CurPos" />
<xsl:PARAM নাম="শেষ" />
<!-- নিম্নলিখিত ভেরিয়েবলের মান ItemStyle.xsl থেকে অপরিবর্তিত হয় -->
<xsl:পরিবর্তনশীল নাম="SafeImageUrl">
<xsl:কল-ফর্মা নাম="OuterTemplate.GetSafeStaticUrl">
<xsl:সঙ্গে PARAM নাম="UrlColumnName" নির্বাচন করা="'ImageUrl'"/>
</xsl:কল-ফর্মা>
</xsl:পরিবর্তনশীল>
<xsl:পরিবর্তনশীল নাম="SafeLinkUrl">
<xsl:কল-ফর্মা নাম="OuterTemplate.GetSafeLink">
<xsl:সঙ্গে PARAM নাম="UrlColumnName" নির্বাচন করা="'LinkUrl'"/>
</xsl:কল-ফর্মা>
</xsl:পরিবর্তনশীল>
<xsl:পরিবর্তনশীল নাম="DisplayTitle">
<xsl:কল-ফর্মা নাম="OuterTemplate.GetTitle">
<xsl:সঙ্গে PARAM নাম="শিরোনাম" নির্বাচন করা="@ শিরোনাম"/>
<xsl:সঙ্গে PARAM নাম="UrlColumnName" নির্বাচন করা="'LinkUrl'"/>
</xsl:কল-ফর্মা>
</xsl:পরিবর্তনশীল>
<xsl:পরিবর্তনশীল নাম="LinkTarget">
<xsl:যদি পরীক্ষা="@ OpenInNewWindow = 'সত্য'" >_blank</xsl:যদি>
</xsl:পরিবর্তনশীল>
<!--
এখানে আমরা একটি পরিবর্তনশীল সংজ্ঞায়িত, "tableStart". এই HTML রয়েছে
. উল্লেখ্য যে যদি CurPos = 1, এটি একটি CDATA ট্যাগের এইচটিএমএল অন্তর্ভুক্ত.
অন্যথায়, এটি খালি হবে.
tableStart মান প্রত্যেক সময় ItemStyle মাধ্যমে বলা হয় emited হয়
.
-->
<xsl:পরিবর্তনশীল নাম="tableStart">
<xsl:যদি পরীক্ষা="$CurPos = 1">
<![CDATA[
<সারণি সীমানা = 1>
<tr bgcolor="blue">
<td><font color="white"><বো>প্রকল্প নাম</বো></হয়></td>
<td align="right"><font color="white"><বো>জন্ম সমাপ্তি</বো></হয়></td>
<td align="right"><font color="white"><বো>বাজেট</বো></হয়></td>
<td align="right"><font color="white"><বো>প্রকৃত ব্যয়</বো></হয়></td>
<td><font color="white"><বো>সামগ্রিকভাবে স্থিতি</বো></হয়></td>
</tr>
]]>
</xsl:যদি>
</xsl:পরিবর্তনশীল>
<!--
অন্য পরিবর্তনশীল, tableEnd কেবল ক্লোজিং টেবিল ট্যাগ সংজ্ঞায়িত.
TableStart সঙ্গে, এটা সবসময় emited এর. তার মান হল এটা কেন
.
-->
<xsl:পরিবর্তনশীল নাম="tableEnd">
<xsl:যদি পরীক্ষা="$CurPos শেষ $ =">
<![CDATA[ </টেবিল> ]]>
</xsl:যদি>
</xsl:পরিবর্তনশীল>
<!--
সর্বদা tableStart বিষয়বস্তু নির্গত. এই প্রথম না হলে
, তারপর আমরা এর মান জানা
.
Escaping আউটপুট অক্ষম কারণ যখন tableStart এটি ফাঁকা না, এটা
. যদি
, it will generate
stuff like "<টেবিল&জি.টি.;" instead of "<টেবিল>".
-->
<xsl:মান-এর নির্বাচন করা="$tableStart" নিষ্ক্রিয়-আউটপুট-escaping="হ্যাঁ"/>
<tr>
<!--
পি: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:মান-এর নির্বাচন করা="@ Project_x005F_x0020_Name"/>
</td>
<td সারিবদ্ধ="অধিকার">
<xsl:মান-এর নির্বাচন করা="@ Project_x005F_x0020_End_x005F_x0020_Date"/>
</td>
<td সারিবদ্ধ="অধিকার">
<xsl:কল-ফর্মা নাম="formatcurrency">
<xsl:সঙ্গে PARAM নাম="মান"
নির্বাচন করা="@ Project_x005F_x0020_Budget"></xsl:সঙ্গে PARAM>
</xsl:কল-ফর্মা>
</td>
<td সারিবদ্ধ="অধিকার">
<xsl:কল-ফর্মা নাম="formatcurrency">
<xsl:সঙ্গে PARAM নাম="মান" নির্বাচন করা="@ Project_x005F_x0020_Expenses">
</xsl:সঙ্গে PARAM>
</xsl:কল-ফর্মা>
</td>
<td>
<xsl:মান-এর নির্বাচন করা="@ Project_x005F_x0020_Status"/>
</td>
<!--
নিম্নলিখিত সবকিছুর নির্মল খুঁজে মন্তব্য করা হয়.
কিন্তু, এটি ফিরিয়ে আনতে এবং সেটিকে সামগ্রী <td> তার দেখতে
.
-->
<!--
<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}"/>
</একটি>
</div>
</xsl:যদি>
<div class="link-item">
<xsl:কল-ফর্মা
name="OuterTemplate.CallPresenceStatusIconTemplate"/>
<a href="{$SafeLinkUrl}"
target="{$LinkTarget}" title="{@ LinkToolTip}">
<xsl:value-of select="$DisplayTitle"/>
</একটি>
<div class="description">
<xsl:value-of select="@Description" />
</div>
</div>
</div>
-->
</tr>
<!--
ক্লোজিং টেবিল ট্যাগ নির্গত. আমরা শেষ সারিতে না হন,
এই ফাঁকা হতে হবে.
-->
<xsl:মান-এর নির্বাচন করা="$tableEnd" নিষ্ক্রিয়-আউটপুট-escaping="হ্যাঁ"/>
</xsl:টেমপ্লেট>
<xsl:টেমপ্লেট নাম="formatcurrency">
<xsl:PARAM নাম="মান" নির্বাচন করা="0" />
<xsl:মান-এর নির্বাচন করা='বিন্যাস-সংখ্যা($মান, "$DDD,DDD,DDD.DD", "staff")' />
</xsl:টেমপ্লেট>
|
