2022.2

Passing Variable Data to client-side JavaScript
WhenservingWebpagesusingWorkflow,theHTMLisfirstpersonalizedandthenservedtotheweb
browserbyaWorkflowprocess.AtthatstagecustomJavaScriptsdonothaveaccesstotheinform-
ationstoredintheDataModel.Toenableaclient-sidescripttousevariabledata,youneedtocreatea
TextScriptthatproducesaJSONstringandstoresthatintheattributeofanHTMLelement,thevalue
attributeofahiddenfieldforexample.ThecustomJavaScriptcanthenretrievethatinformationand
useittocreatedynamicpageelements.ProducingaJSONstringandstoringtheresultsintheattribute
ofanHTMLelementarebothoptionsintheTextScriptwizard;see"UsingtheTextScriptWizard"on
page729.
StylingandformattingaWebpage
ThecontentsofaWebsectioncanbeformatteddirectly,orstyledwithCascadingStyleSheets(CSS).
See"Stylingandformatting"onpage671and"Stylespane"onpage986.
Inorderforastylesheettobeappliedtoaspecificsection,itneedstobeincludedinthatsection.
Therearetwowaystodothis.
Drag & drop a style sheet
1. ClickandholdthemousebuttononthestylesheetontheResourcespane.
2. MovethemousecursorwithintheResourcespanetothesectiontowhichthestylesheetshould
beapplied.
3. Releasethemousebutton.
Using the Includes dialog
1. OntheResourcespane,right-clickthesection,thenclickIncludes.
2. FromtheFile typesdropdown,selectStylesheets.
3. ChoosewhichCSSfilesshouldbeappliedtothissection.Theavailablefilesarelistedattheleft.
Usethearrowbuttonstomovethefilesthatshouldbeincludedtothelistattheright.
4. YoucanalsochangetheorderinwhichtheCSSfilesareread:clickoneoftheincludedCSSfiles
andusetheUpandDownbuttons.Notethatmovingastylesheetupinthelistgivesitless
weight.Incaseofconflictingrules,stylesheetsreadlaterwilloverridepreviousones.
Note: Stylesheetsareappliedintheorderinwhichtheyareincludedinasection.Thestylesin
eachfollowingstylesheetadduptothestylesfoundinpreviouslyreadstylesheets.Whenstyle
sheetshaveaconflictingruleforthesameelement,classorID,thelaststylesheet‘wins’and
overridestherulefoundinthepreviousstylesheet.
Page 500