Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Episerver Forms (fi)

2,230 views

Published on

Episerver Developer Meetup 21.4.2016 slides

Published in: Technology

Episerver Forms (fi)

  1. 1. EPISERVER FORMS Episerver Developer Meetup 21.4.2016 Mikko Huilaja
  2. 2. MIKKO HUILAJA › Software Architect @Solita › twitter.com/huilaaja blog.huilaaja.net github.com/huilaaja
  3. 3. AGENDA 1. Ominaisuudet • DEMO 2. Laajennettavuus • DEMO 3. Visuaalisuus • DEMO 4. Käytännön neuvoja
  4. 4. New beginning of Forms and R.I.P. Episerver XForms
  5. 5. FORMS (LOMAKE-EDITORI) › 1.0 versio julkaistiin helmikuussa › Nyt jo versiossa 2.0.0.2 (eli vasta teini-iässä) › Add-on eli erillinen NuGet › Vaatii Episerver 9 MVC projektin › Helppo asentaa NuGetista ja SMTP-asetukset
  6. 6. OMINAISUUDET • Helppokäyttöinen • Forms gadget • Form Elements gadget • Drag and drop • Elementit ovat blockeja eli samat ominaisuudet lokalisointi, versiointi, käyttöoikeudet • Voi tehdä “sivu lomakkeita” ja “globaaleja lomakkeita”
  7. 7. OMINAISUUDET • Multi-step forms • S-posti templatet • Käyttäjän profilointi • Laajennettavuus “Dev<3” • Käännetty vain Englanniksi (tulossa suomeksi)
  8. 8. SPAMMIN ESTO 1. Käyttöoikeuksilla sallit vain kirjautuneiden käyttäjien päästä lomakkeelle 2. CAPTCHA-elementti 3. Tai voit tehdä oman esim. Honeypot -elementin.
  9. 9. LAAJENNUKSET JA INTEGRAATIOT
  10. 10. EXTENSIONS › Custom Elements › Events › Repositoryn käsittely › Actors › Controllerit › Service API › Web Hooks › IoC implementaatiot › Alf Nilssonilla on hyviä esimerkkejä: https://github.com/alfnilsson/Episerver Forms
  11. 11. CUSTOM ELEMENTS › Forms vaatii MVC projektin (ei WebForms) › Peri luokasta ElementBlockBase › Tee MVC näkymä kansioon Views/Shared/ElementBlocks › Custom Elementtien validointiin toteuta seuraavat interfacet • IElementValidatable • IExcludeValidatorTypes
  12. 12. EVENTS › FormsEvents.Instance.FormsSubmitting += FormsSubmitting; › FormsEvents.Instance.FormsStepSubmitted += FormsStepSubmitted; › FormsEvents.Instance.FormsSubmissionFinalized += FormsSubmissionFinalized; › FormsEvents.Instance.FormsStructureChange += FormsStructureChange;
  13. 13. REPOSITORYN / DDS:N KÄSITTELY › IFormDataRepository › var repo = ServiceLocator.Current.GetInstance<IFormDataRepository>(); var submissionData = new Dictionary<string, object>() { {"elementId", "esimerkki"} }; var friendlyNames = new FriendlyNameInfo[] { new FriendlyNameInfo("elementId", "friendlyName", "label", FormatType.String) }; var removeNonFriendlyFields = false; repo.TransformSubmissionDataWithFriendlyName( submissionData, friendlyNames, removeNonFriendlyFields); › DDS Storageen tiedon vienti DdsPermanentStorage.SaveToStorage( EPiServer.Forms.Core.Models.FormIdentity formIden, EPiServer.Forms.Core.Models.Submission submission )
  14. 14. ACTORS › PostSubmissionActorBase › UI interface IUIPropertyCustomCollection › https://github.com/episerver/EPiServer.Forms.Demo • A very simple Actor, with no UI, just do some business after Form finalize it submission • A configurable Actor, has UI in EditView for Editor, and use that information to do its business
  15. 15. CONTROLLERIT › On mahdollista ylikirjoittaa Epin omat Controllerit: • SubmitFormController • PreviewFormController
  16. 16. SERVICE API › Web API Episerver contentin kyselyyn REST kutsuina. › Forms käyttää EPiServer.ServiceApi ominaisuutta › http://world.episerver.com/documentation/Items/Developers- Guide/Episerver-CMS/9/forms/how-to-use-the-episerver-forms- service-api/
  17. 17. IOC IMPLEMENTAATIOT › Inversion of Control eli StructureMap ja Epin luokkien korvaavat implementaatiot › http://world.episerver.com/Modules/Forum/Pages/Thread.aspx?id =146780 ›
  18. 18. IOC IMPLEMENTAATIOT
  19. 19. VISU JA TEMPLATES
  20. 20. CUSTOM TEMPLATES
  21. 21. ELEMENT TEMPLATES › Kaikkien elementtien ulkoasut on muuteltavissa › MVC mallilla tehty › Helppo muutella › Html-rakenne ja class nimet ovat herkkiä rikkoontumaan
  22. 22. FORMS WITH BOOTSTRAP › Jos käytätte Bootstrappiä tai haluat yhtenäisemmän ulkoasun/html sisällön lomakkeiden elementeille. › Responsiivinen ja mobile friendly › https://github.com/huilaaja/EpiserverFormsWithBootstrap
  23. 23. XSS JA TIETOTURVA › Oletuksena mitään lähetettyjä tietoja ei näytetä julkisella puolella. › Ylläpito näkymät on suojattu XSS:ltä • Eli kaikki kentät näkyvät vain tekstinä. Esim. <SCRIPT>alert(“Cookie”+document.cookie)</SCRIPT> › XSS ei ole OOTB huomioitu teidän omissa laajennuksissa tai Service API käytettäessä.
  24. 24. KÄYTÄNNÖN NEUVOJA Näihin tulet törmäämään
  25. 25. PRO TIP › Required Client Resources!
  26. 26. PRO TIP › Jos Forms-tab ei näy, niin Palauta näkymät . › "Display options" and click the "Reset views" button.
  27. 27. PRO TIP › Rich text editor näkyy vain kun lomake on jo submitoitu eli se on “lomake kooste elementti”.
  28. 28. Twitter @SolitaOy www.solita.fi KIITOS MIKKO HUILAJA Software Architect +358503293279 mikko.huilaja@Solita.fi

×