این نمونه JSLink به شما این امکان را می دهد که متن پیام کوتاه کرده و کل متن را با قرار دادن موس بر روی متن و به صورت یک صفحه ی راهنمای کوچک مشاهده کنید.
1.یک فایل js شامل کد زیر ایجاد کنید.
// List View – Substring Long String Sample // Sharepointech.ir (function () { //خروجی رندر شامل اطلاعات متنی در مورد زمینه ای است که ما می خواهیم آن را تغییر دهیم var bodyFiledContext = {}; bodyFiledContext.Templates = {}; bodyFiledContext.Templates.Fields = { //رندر جدید برای فیلد مورد نظر را در نمای لیست اعمال کنید “Body”: { “View”: bodyFiledTemplate } }; SPClientTemplates.TemplateManager.RegisterTemplateOverrides(bodyFiledContext); })(); // این تابع یک رندر منطقی تعریف می کند function bodyFiledTemplate(ctx) { var bodyValue = ctx.CurrentItem[ctx.CurrentFieldSchema.Name]; //این عبارت regex برای حذف تگ های html از فیلد Body استفاده می شود var regex = /(<([^>]+)>)/ig; bodyValue = bodyValue.replace(regex, “”); var newBodyValue = bodyValue; if (bodyValue && bodyValue.length >= 100) { newBodyValue = bodyValue.substring(0, 100) + ” …”; } return “<span title='” + bodyValue + “‘>” + newBodyValue + “</span>”; } |
2. یک لیست به نام Announcements ایجاد کنید که شامل ستونی به نام Body باشد.
3. فایل js را در کتابخانه ی SiteAssests آپلود کنید.
4. صفحه ی شامل نمای لیست را ویرایش کنید.
5. به web-part properties بروید و آدرس فایل (~sitecollection/Style%20Library/JSLink-Samples/SubstringLongText.js) را در قسمت Miscellaneous در JS link property قرار دهید.
6. بر روی Apply کلیک کنید و توقف ویرایش صفحه را بزنید.
همان طور که در تصویر مشاهده می کنید در انتهای ستون Body سه نقطه نمایش داده شده و کل متن در یک کادر جداگانه نمایش داده می شود.
محصولات ویژه شیرپوینتک: فارسی ساز شیرپوینت 2016+ تقویم شمسی شیرپوینت