AFRAIT

Die Standardanzeige innerhalb der Aufgabenliste lässt von Haus’ aus etwa zu wünschen übrig. Hier kommt das allseits beliebte CSR (Client Side Rendering) ins Spiel. Das Ergebnis sieht mit unten stehenden Skript wie folgt aus:

Füge eine Aufgabenliste deiner Seite hinzu und verwende das nachfolgende Javascript um die Anzeige wie oben anzupassen:

var taskSample = taskSample || {};

	taskSample.CustomizeFieldRendering = function () {
	RegisterSod('hierarchytaskslist.js', '/_layouts/15/hierarchytaskslist.js');
	LoadSodByKey('hierarchytaskslist.js', null);

	// Intialize the variables for overrides objects
	var overrideCtx = {
	Templates: {
	Fields: {
				'PercentComplete': { 
					'View' : taskSample.PercentCompleteRendering
				}
			}
		}
	};

	// Register the override of the field
	SPClientTemplates.TemplateManager.RegisterTemplateOverrides(overrideCtx);
}

taskSample.PercentCompleteRendering = function (ctx) {
	var output = [];
	  output.push('<div style="background: #c6c6c6; display:block; height: 20px; width: 100px;">');
	  output.push('<span style="color: #686868; position:absolute; text-align: center; width: 100px;">');
	  output.push(ctx.CurrentItem.PercentComplete);
	  output.push('</span>');
	  output.push('<div style="background: #ffdb16; height: 100%; width: ');
	  output.push(ctx.CurrentItem.PercentComplete.replace(" %", ""));
	  output.push('%;"></div></div>');
	  return output.join('');
}

taskSample.CustomizeFieldRendering();

Wie lädst du das Javascript in dein SharePoint und verbindest es mit deiner Aufgabenliste? Easy, klick hier!

Und wenn du sonst noch Fragen hast, don’t be afraIT! Frag einfach!

Einfach, schnell und wirksam, das war ein afraIT Shorty. Mehr aus der Kategorie gibt es hier.