Créer un site internet

SharepointJSLink

Sharepoint JSLink client-side rendering

Configurejslink

 

// ~sitecollectionlayouts/AFDI/TestJSlink/customForm.js
//Form Template Name = CSRListForm
//CSR Render Mode = standard layout

(function () {
    if (typeof SPClientTemplates === 'undefined')
        return;

    var formTemplateCtx = {};

    formTemplateCtx.Templates = {};
 //formTemplateCtx.Templates.NewForm = NewAndEditTemplate;
 //ormTemplateCtx.Templates.EditForm = NewAndEditTemplate;

 formTemplateCtx.Templates.Item = DisplayTemplate;
 //debugger;
    //register the template to render our field

    SPClientTemplates.TemplateManager.RegisterTemplateOverrides(formTemplateCtx);

})();

//function called when an item with our field is in edit mode or new mode.
function DisplayTemplate(ctx) {
    if (ctx == null)
        return '';

    var formCtx = SPClientTemplates.Utility.GetFormContextForCurrentField(ctx);
    if (formCtx == null)
        return '';
   
    //render the display controls for the ingredient
    var html = RenderDisplayFields(ctx, formCtx);
   
   return html;
}

function RenderDisplayFields(ctx, formCtx){
var formTable = "".concat("<table width='100%' cellpadding='5'>",
        "<tr>",
         "<td><div>&nbsp;</div></td>",
         "<td><div><a href='http://fdi-sp2013-1:2921/sites/testPubFred1/Lists/aTestForm1/DispForm.aspx?ID=1&Source=http%3A%2F%2Ffdi%2Dsp2013%2D1%3A2921%2Fsites%2FtestPubFred1%2FLists%2FaTestForm1%2FAllItems%2Easpx&ContentTypeId=0x0100C156F387E797094D9986AFBFBA123BF200685DFE049D301D4186F92C5A4DBAB46E'>reload</a></div></td>",
        "</tr>",
        "<tr>",
         "<td><div></div></td>",
         "<td><div>{{TitleCtrl}}</div></td>",
        "</tr>",
        "<tr>",
         "<td><div>Choice</div></td>",
         "<td><div>{{ChoiceCtrl}}</div></td>",
        "</tr>",
        "<tr>",
         "<td><div>Link</div></td>",
         "<td><div>{{LinkCtrl}}</div></td>",
        "</tr>",
        "<tr>",
         "<td><div>Check</div></td>",
         "<td><div>{{CheckCtrl}}</div></td>",
        "</tr>",
        "<tr>",
         "<td><div>Rich text</div></td>",
         "<td><div>{{RichCtrl}}</div></td>",
        "</tr>",
        "<tr>",
         "<td><div>current user login</div></td>",
         "<td><div>{{CurrentUser}}</div></td>",
        "</tr>",
        "<tr>",
         "<td><div>current user id</div></td>",
         "<td><div>{{CurrentId}}</div></td>",
        "</tr>",
        "<tr>",
         "<td><div>current user Email</div></td>",
         "<td><div>{{CurrentEmail}}</div></td>",
        "</tr>",
        "<tr>",
         "<td><div>current user IsSiteAdmin</div></td>",
         "<td><div>{{CurrentIsSiteAdmin}}</div></td>",
        "</tr>",
        "<tr>",
         "<td><div>current user Title</div></td>",
         "<td><div>{{CurrentTitle}}</div></td>",
        "</tr>",
        "</table>");
       
        /*
       
        "<tr>",
         "<td><input type='button' value='Save' onclick=\"SPClientForms.ClientFormManager.SubmitClientForm('{{FormId}}')\" style='margin-left:0' ></td>",
        "</tr>",
        */

   
    //Replace the tokens with the default sharepoint controls
    formTable = formTable.replace("{{TitleCtrl}}", getSPFieldRender(ctx, "Title"));
    formTable = formTable.replace("{{ChoiceCtrl}}", getSPFieldRender(ctx, "aFdiChoice"));
    formTable = formTable.replace("{{LinkCtrl}}", getSPFieldRender(ctx, "aFDiLink"));
    formTable = formTable.replace("{{CheckCtrl}}", getSPFieldRender(ctx, "aFdiCheck"));
    //formTable = formTable.replace("{{RichCtrl}}", getSPFieldRender(ctx, "aFdiRich"));
 var currentUser;
 
 //asynchrone call to get current user datas

 $.ajax({
        async: false,
        headers: { "accept": "application/json; odata=verbose" },
        method: "GET",
        url: formCtx.webAttributes.WebUrl + "/_api/web/CurrentUser",
        success: function (data) {
            // Set the current user
            currentUser = data.d;
        }
    });
 
    formTable = formTable.replace("{{CurrentUser}}", currentUser.LoginName);
    formTable = formTable.replace("{{CurrentId}}", currentUser.Id);
    formTable = formTable.replace("{{CurrentEmail}}", currentUser.Email);
    formTable = formTable.replace("{{CurrentIsSiteAdmin}}", currentUser.IsSiteAdmin);
    formTable = formTable.replace("{{CurrentTitle}}", currentUser.Title);

    return formTable;
}


//This function code set the required properties and call the OOTB (default) function that use to render Sharepoint Fields
function getSPFieldRender(ctx, fieldName)

    var fieldContext = ctx;

    //Get the filed Schema
    var result = ctx.ListSchema.Field.filter(function(obj) {
        return obj.Name == fieldName;
    });

    //Set the field Schema  & default value
    fieldContext.CurrentFieldSchema = result[0];
    fieldContext.CurrentFieldValue = ctx.ListData.Items[0][fieldName];

    //Call  OOTB field render function
    return ctx.Templates.Fields[fieldName](fieldContext);
}

Link to text file

Last edited: 28/09/2018

  • No ratings yet - be the first to rate this.

Add a comment

Anti-spam