Startschwierigkeiten mit JSLink

Andi Fandrich Als Antwort am 7 Sept. 2016 16:25

Ich nehme mal an, daß die Datei einfach nicht korrekt eingebunden und deshalb gar nicht geladen wurde. Hast Du das mal geprüft?

Am sinnvollsten gehören diese Dateien in die Masterpage Gallery. Verlinkt werden sie dann so:
~site/_catalogs/masterpage/jslink.js

Pyro Als Antwort am 7 Sept. 2016 17:36

Ok aber zum Testen würde es auch gehen wenn die datei in einer anderen dokumentbibliothek liegt? 

Ok dann probiere ich das morgen nochmal.

Gruß Andre

Andi Fandrich Als Antwort am 8 Sept. 2016 08:00

Im Grunde ist es ziemlich egal, wo die Datei liegt. Hauptsache der Pfad stimmt und die Datei ist für den aufrufenden User erreichbar.

Patrick Als Antwort am 8 Sept. 2016 08:04

Ich habe in meinem Blog einige Dinge zum Thema JS-Link.

Auch den eventuell hilfreichen Blogpost https://afrait.com/blog/upload-js-files-and-link-it-to-lists-in-9-steps-de-en/

Ich hoffe dieser bringt dir noch etwas Licht ins dunkle.

Pyro Als Antwort am 19 Sept. 2016 16:40

Hallo,

leider bin ich erst heute wieder dazu gekommen, mich weiter mit JSLink zu beschäftigen. Es funktioniert allerdings immer noch nicht.

Ich habe mir eine andere Sharpoint-Seite angesehen, auf welcher über "~sitecollection/_catalogs/masterpage/Display Templates/Scripts/Prozentbalken.js" ein script eingebunden wird, welches die Prozentanzeige von einer Task-Liste als Balken darstellt. Ich habe den code unverändert übernommen und in einer Dokumentbibliothek mit dem Name JSLink hinterlegt, eine neue Task-Liste erstellt und den code über "/sites/meineSeite/JSLink/Prozentbalken.js" eingebunden.

Unter Gestaltungsvorlagen, kann ich leider kein neues Dokument erstellen, da das Steuerelemten deaktiviert ist. Aber ansonsten hab ich mich an die Anleitung im Blogpost gehalten. Muss ich die JSLink Datei anders angeben? Ich hab es auch mit "~sitecollection/JSLink/Prozentbalken.js" versucht, aber auch das hat nicht funktioniert.

// List view, display, add and edit – Percent Complete Sample
// Muawiyah Shannak , @MuShannak

(function () {
    // Create object that have the context information about the field that we want to change it's output render
    var percentCompleteFiledContext = {};
    percentCompleteFiledContext.Templates = {};
    percentCompleteFiledContext.Templates.Fields = {
        // Apply the new rendering for PercentComplete field on List View, Display, New and Edit forms
        "PercentComplete": {
            "View": percentCompleteViewFiledTemplate,
            "DisplayForm": percentCompleteViewFiledTemplate,
            "NewForm": percentCompleteEditFiledTemplate,
            "EditForm": percentCompleteEditFiledTemplate
        }
    };
    SPClientTemplates.TemplateManager.RegisterTemplateOverrides(percentCompleteFiledContext);
})();

// This function provides the rendering logic for View and Display form
function percentCompleteViewFiledTemplate(ctx) {
    var percentComplete = ctx.CurrentItem[ctx.CurrentFieldSchema.Name];
    return "<div style='background-color: #e5e5e5; width: 100px;  display:inline-block;'> \
            <div style='width: " + percentComplete.replace(/\s+/g, '') + "; background-color: #0094ff;'> \
            &nbsp;</div></div>&nbsp;" + percentComplete;
}

// This function provides the rendering logic for New and Edit forms
function percentCompleteEditFiledTemplate(ctx) {
    var formCtx = SPClientTemplates.Utility.GetFormContextForCurrentField(ctx);
    // Register a callback just before submit.
    formCtx.registerGetValueCallback(formCtx.fieldName, function () {
        return document.getElementById('inpPercentComplete').value;
    });
    return "<input type='range' id='inpPercentComplete' name='inpPercentComplete' min='0' max='100' \
            oninput='outPercentComplete.value=inpPercentComplete.value' value='" + formCtx.fieldValue + "' /> \
            <output name='outPercentComplete' for='inpPercentComplete' >" + formCtx.fieldValue + "</output>%";
}

Shomann Als Antwort am 27 Okt. 2016 15:27

Hallo Pyro,

kämpfe / kämpfte mit den selben Problemen. Meine (kurzzeitige) Erfahrung:

• Variante 1:
  Entgegen aller Dokumentationen funktionieren die Beispiel-Scripte nur, im JSLink-Bereich (Webpart --> Eigenschaften (Webpart bearbeiten) --> Verschiedene --> JS-Link), wenn ich diese in Gestaltungsvorlagen einbinde
  Genau so, wie Patrik es im verlinkten Post beschrieben hat.
  Das Verlinken einer Script-Datei in einer anderen Quelle (beliebige Dokumentenbibliothek) über das Feld JS-Link klappt bei mir auch nicht.
• Variante 2:
  Wenn ich die Seite bearbeite und einen Script-Editor-Webpart unter den Ansicht-Webpart eínbinde und dort den Text! der Scriptdatei 'reinkopiere, dann funktioniert dies auch (bitte alles noch in <script type="text/javascript"> und </script> klammern, ggf. darauf achten, dass das Script erst nach dem Laden der Seite ausführbar ist)
• Variante 3:
  Stammt noch aus den Zeiten von Vor-SharePoint 2013. Man bearbeitet wieder die Seite und fügt ein  HTML-Formularwebpart ein und in den Quelltext schreibt man, den Verweis auf die eigentliche Script-Datei (die in einer Dokumentenbibliothek liegen kann). In der Art:
  "...
  <script type="text/javascript" src="/ScriptLib/name.js"></script>
  ..." 

Ich habe auch das Problem oder den Wunsch spezifische Java-Scripts, die einmalig sind (d.h. nur auf eine Liste/Ansicht) zur Anwendung kommen, nicht unbedingt in den Gestaltungsvorlagen (Masterpage) ablegen zu wollen.

Soweit meine kurzen Erfahrungen mit JavaScripten in SharePoint und SharePointOnline.

Sven