Bienvenue à Blogs CodeS-SourceS Identification | Inscription | Aide

The Mit's Blog

En plus d'intégrer et skier, il sait même écrire !
(Blog de Renaud Comte)

Actualités


  • Ancien MVP SharePoint 8 ans ...
    Des projets .Net, SharePoint 2013 ou Office 365 ??

    Contactez-nous :

Archives

[SPC12] JS Client Side Rendering

SPC-2012_thumb1_thumb_thumb_thumb2_t[1]

Restons sur la thématique du développement Javascript. Client Rendering ou comment remplacer le rendu des champs de liste via JS

Une session ne comportant qu’un seul slide à priori : du Client Side, MDS, Odata

La session commence par une revue du _api et de l’affichage de retour via json et odata

P1040751

  • Démonstration avec fiddler de la feature MDS : Minimum Download Stategy
    • la navigation dans le site montre une diminution énorme du trafic
      • tout fonctionne par delta
      • plus de full reload de la page
  • Utilisation du JS Link des listviewWP
    • ajout d’un template remplaçant le current item rendering
      • ajout d’un site bold sur le title
      • advance : call REST sur une liste d’image et injection d’une vignette dans le rendu de la liste
        • simple et terriblement efficace
        • clin d’oeil Old School : concaténation et XmlHttp

P1040754

P1040755

P1040757

Avec cet ajout de js, on peut overrider n’importe quel rendu de liste sans aucun hack particulier !!!
>>> sans forcement devoir passer par la XSL et ou SPD Sourire

Ce fameux paramètre JSLink existe aussi dans la définition d’un Content type dans la déclaration du Field

Exemple venant de CKSScript.codeplex.com

il suffit d’ajouter le CT à la liste de demo et un simple champs texte devient un drop down avec un control de saisie en edit ainsi qu’un render particulier

P1040758

http://blog.aptillon.com/2012/10/12/custom-field-types-in-sharepoint-2013-apps/

La même technique du JSLink peut être utiliser dans un custom field type par simple changement dynamique du param : soit un control complet du render via du JS en edit et en render

>>> aka MicroRendering

P1040762

Demo

  • Ajout d’une MAP view
    • JSlink pointant un autre render template
    • Server Render : la compo html se fait coté serveur désormais

SP2013 permet de Controller finement via JS le rendu de ces valeurs avec ou sans le MDS

Dernière demo bonus

  • les display template de recherche
    • utilise un html avec des tokens _# #_
    • on peut aussi utilise le js sur le current context comme pour les JSLink et interagir sur le rendu du template
    • conversion dynamique du html en template JS

P1040766

Conclusion

Enfin un contrôle fin sur les champs avec toute la puissance du JS et Rest sans les problèmes de déclaration de custom field types : Merci

Surtout ca ouvre de sacrée possibilité comme injecter un player video dans un liste de lien , non ? Sourire 

Renaud Comte [MVP]
Live from Vegas

Mots clés Technorati : ,,
Ce post vous a plu ? Ajoutez le dans vos favoris pour ne pas perdre de temps à le retrouver le jour où vous en aurez besoin :
Posted: jeudi 15 novembre 2012 00:03 par themit
Classé sous : , ,

Commentaires

Pas de commentaires

Les commentaires anonymes sont désactivés

Les 10 derniers blogs postés

- Merci par Blog de Jérémy Jeanson le 10-01-2019, 20:47

- Office 365: Script PowerShell pour auditer l’usage des Office Groups de votre tenant par Blog Technique de Romelard Fabrice le 04-26-2019, 11:02

- Office 365: Script PowerShell pour auditer l’usage de Microsoft Teams de votre tenant par Blog Technique de Romelard Fabrice le 04-26-2019, 10:39

- Office 365: Script PowerShell pour auditer l’usage de OneDrive for Business de votre tenant par Blog Technique de Romelard Fabrice le 04-25-2019, 15:13

- Office 365: Script PowerShell pour auditer l’usage de SharePoint Online de votre tenant par Blog Technique de Romelard Fabrice le 02-27-2019, 13:39

- Office 365: Script PowerShell pour auditer l’usage d’Exchange Online de votre tenant par Blog Technique de Romelard Fabrice le 02-25-2019, 15:07

- Office 365: Script PowerShell pour auditer le contenu de son Office 365 Stream Portal par Blog Technique de Romelard Fabrice le 02-21-2019, 17:56

- Office 365: Script PowerShell pour auditer le contenu de son Office 365 Video Portal par Blog Technique de Romelard Fabrice le 02-18-2019, 18:56

- Office 365: Script PowerShell pour extraire les Audit Log basés sur des filtres fournis par Blog Technique de Romelard Fabrice le 01-28-2019, 16:13

- SharePoint Online: Script PowerShell pour désactiver l’Option IRM des sites SPO non autorisés par Blog Technique de Romelard Fabrice le 12-14-2018, 13:01