EIEIOTECHNOVATION
← Training programmes

EIEIO / PROGRAMMING & DEVELOPMENT

DDJS8-Lotus Domino Designer 8 JavaScript

Course outline

3 days
Discuss this programme →

Duration

3 days

Course Description

During this course you will use Domino Designer 8 to add JavaScript to Domino applications that are accessed by browsers. The course covers the basic language elements of JavaScript, how to add scripts using Domino Designer, and how to exploit the various browser and language object event handlers. There is a strong emphasis on the browser object model and how it relates to the Domino object model. The course also touches on how to incorporate Dynamic HTML, Java Applets, LiveConnect, ActiveX controls, and AJAX into web-based applications.

Audience

This course assumes that you have:

  • thorough knowledge of the Domino Designer 8 development environment, including Form, Page, View, Frameset, and Agent design, as well as how to set properties and set the ACL
  • knowledge of Web technologies, including servers, browsers, HTML, Cascading Style Sheets, and some basic JavaScript (or other browser scripting language) and awareness of browser object properties and methods
  • basic understanding of LotusScript and the various Notes product objects
  • because this course does not review any aspects of the non-JavaScript aspects of developing applications with Domino Designer, mastery of the topics covered in these courses:
  • Lotus Domino Designer 8: Basic Notes Applications
  • Lotus Domino Designer 8: Basic Browser Applications courses.

This course is part of a series of Domino Designer 8 training courses. Follow these paths to master all aspects of developing applications using Domino Designer.

Domino Designer 8: Basic Notes Applications provides the base knowledge for this additional training:

Client Track

  • Configure Domino to use DB2 as a database engine and build applications that access relational data, DB2 for Domino 8 Administrators and Developers.
  • Specialize in programming Notes applications to respond to built-in user interface features, Domino Designer 8: Special Notes Features.
  • Convert an application written for Notes clients to be used in browsers, Domino Designer 8: Basic Browser Applications.
  • Provide data to cutting-edge Web applications, Domino Designer 8: Web Agents and Web Services.

Language Track. These languages apply to both Notes and browser clients:

  • Learn sophisticated application techniques that fully exploit the formula language in Domino Designer 8: Formula Language.
  • Develop sophisticated applications and Agents with LotusScript in Domino Designer 8: LotusScript.
  • Add powerful client-side scripting to browser applications in Domino Designer 8: JavaScript.

Duration

This course is sold as a 3-day course, but there is much more material than can be covered in that duration.

Course Goals

This course will:

  • build a fundamental knowledge of JavaScript as it is applied in Domino applications used by modern browsers
  • provide practical programming and debugging experience to ensure a foundation of JavaScript skills
  • understand the relationship between JavaScript and Domino data types
  • clarify the use of the various object models, including the Domino Object Model, the original browser Document Object Model, JavaScript language objects, and the newer W3C Level 1 Document Object Model
  • use JavaScript to code the Field, Button, and Form event handlers
  • build a practical understanding of data validation and error trapping
  • use DHTML to create interactive web pages
  • control Java applets using LiveConnect
  • remotely access Domino objects via CORBA
  • script ActiveX objects
  • use AJAX to request and process Domino-generated XML and JSON
  • develop practical ways to detect which browser is being used and how to code appropriately.

Course Design

The course takes a task-oriented approach, during which you will work with JavaScript code that will have immediate application to your Domino applications.

Because this course instructs you how JavaScript works with respect to Domino, you will be able to leverage the many JavaScript resources available to you as a developer.

Course Outline

Topic 1: Browser Objects and JavaScript

Preview of the Domino/browser exchangeProgramming challengeThe history of client-side scriptingBrief history of browser object modelsLaunch browser from Lotus NotesBrowser Object Model (DOM Level 0)JavaScript vis-a-vis browser objectsMozillas DOM and JavaScript object InspectorDomino as a Web serverThe Domino "Web Server"Third-party Web server plug-insExercise: Create project databasesTopic 2: Coding JavaScript in Domino Designer

HTML page structureCode your own HTMLOther sources of HTMLGetting JavaScript into the HEAD tagExercise: JavaScript functionGetting JavaScript onto an HTML pageExercise: Create a buttonTroubleshooting button problemsJavaScript librariesJS files on PagesJavaScript library securitySyntax checkingRuntime error reportingMicrosoft Script EditorMozilla JavaScript DebuggerCommercial debuggersHome grown debugging Topic 3: Basic Language Elements

Walkthrough: Basic elementsSimple data typesBuilt-in functionsvar keyword and variable scopeSimple dialog boxesCommented codeExercise: Dialog boxestry/catch statementthrow statementCustom error objectGarbage collectionTopic 4: Branching and Looping Structures

If structureExercise: If structureBoolean operatorsExercise: Boolean operatorSimple if using ?SwitchWhile structureDo while structureFor structureBreakContinueExercise: Looping structuresTopic 5: Custom Functions

Function statementFunction argumentsHow to call a functionWhere to call a function Return a value from a functionExercise: Function to test numberPassing argument by valueRecursive functionsConversion of @Commands to JavaScript functionsTopic 6: JavaScript Objects

Date objectBrowser or Domino Server time?Create date objectDomino-acceptable date entryExercise: Date objectMath objectNumber objectString objectString object parsing methodsRegular expressionsSimple examplesValid numberIntermediate example: ReplaceAdvanced example: Patterns and literalsExercise: Fix URL functionRegExp (regular expression) objectScreen objectCustom objectsforin statementwith statementdelete operatorCustom object prototypingExample: Custom classExample: Add method to JavaScript objectEnumerator objectImage objectTopic 7: Arrays

Array attributesHow to declare an arrayCreate array from @DbColumnNumber of elementsAppend elementsRead one elementRead all elementsOut-of-bound errorsCopy entire arrayArray object methodsDelete elementFind values in an array"Multi-dimension" arraysAssociative arraysExercise: Parse URL command stringParse URL command string using formulaUnique array elementsObject LiteralNested LiteralsTopic 8: Browser Object Model

Browser object hierarchyBrowser object browserTable of browser objectsTraverse the hierarchyExample: Access Form objectExample: Access Field objectChaining object referencesthis keywordself keywordHelp with the Browser Object ModelExercise: Accessing a Field objectBrowser object and Domino object interactionExample: Form processingBrowser object to Domino object limitationsTopic 9: Browser Event Handlers

Possible eventsEvent handler basicsCommonly-coded eventsWalkthrough: Investigate event handlersCapture key pressesExample 1: Capture key pressesExample 2: Capture ESC and double-clickEvent handler registrationthis keywordObject event default actionsCoding the javascript: pseudo-protocolCoding javascript: in a formulaTopic 10: Field Access

HTML field data typeText field accesswith statementJavaScript access to Computed/Hidden Fields in Edit mode<INPUT> tag and FieldsJavaScript access to Computed/Hidden Fields in Read modeParsing a multi-value Field into an array<SELECT> field accessSelect an optionAdd new option to a select listRemove optionRadio ButtonCheckboxSelect all check boxesExercise: Accessing fieldsExercise: Searching from a PageRich text valuesTopic 11: Field Input Translation and Validation

Field-level help Field translationField validationTest data typeValidate for numberTest for NaNTest for "null" and "undefined" and ""Validate for file attachment nameonblur, alert, and focus interactionsSelect field validationRadio and check box validationString format validationDate validation with JavaScriptHandling leap yearsForcing valid date entriesField computationWhen you must use Server-side input translation/validationExample: Server-side input validationDate validation via @FunctionsExercise: Recalc using JavaScriptTopic 12: Form Validation

Field-level event handler caveats"Object is not defined" erroronsubmit event handlerKeep the <FORM> tag compactConditionally call form.submit()Exercise: Form validationHybrid Form validationEnsure just one submissionwindow.onerror event handlerTopic 13: Window Object

Open window using HTMLOpen window using JavaScriptHybrid HTML Link/JavaScript linkWindow featuresReferring to windowsCross-domain script security restrictionFocus on a windowPrint windowWrite to windowResize, move windowClose a windowWindow opener propertyExercise: Help windowCustom dialog boxesSimulating @Picklist using standard window.openSimulating @Dialogbox with a modal dialog boxAddress book lookup dialog boxsetTimeout methodwindow.findclipboardData objectTopic 14: Frame Object

Frames are windowsFrameset basicsSupport browsers that dont support FramesExample framesetTargeting frame content using HTMLDynamic frames from JavaScriptCall a function from another frameExercise: Help frameExample: On-Form help frameIFrame ObjectTopic 15: Location Object

Location is where you areDatabase propertiesLocation propertiesLocation object versus CGI variableSet location to the current databaseURL encoding Setting the locationReplacing the locationExample: ESC and Double-clickRefresh/Reload a windowWorking with frame locationsRedirectionRedirection to user mailRedirect to SSL connectionManual redirection: "Menu Options"Menu Option 1: Select with buttonMenu Option 2: Select w/o buttonExercise: Page chooserPrevent from being framedFrame your pagesInvalid URLs and buffer overflowsTopic 16: Browser State Persistence

Who is the user?What is a cookie?Privacy issuesSet cookie using META tagRead cookie using CGI variableWeaknesses of HTTP/HTML methodsSet cookie using JavaScriptExample: Set cookieGet cookie using JavaScriptSet cookie using formulaParse cookie valuesDelete cookieExercise: Default Field values using cookieProfile documentsProfile documents and securityCreate Profile document Read from Profile document FieldsExample: Profile documentBehaviors and data persistenceUserdata and IE securityExample: UserdataTopic 17: Dynamic HTML

DOM Level 1 enhancementsDOM Level 1 hierarchyElement nodesBrowsing the node hierarchyMozillas DOM and JavaScript object InspectorInstantiate a node objectExample: Instantiate Subject FieldGet and set Field valueSet Field style propertiesElement object shortcutTextNode objectsNode event handlersDHTML examplesExample: Change style sheets on Form loadExample: Change style sheets on the flyExample: Reset style on elementsExample: Hide WhenExample: Expand all sectionsExample: Disable elementExercise: Disable elementTablesElement positioningDate pickerField input mask behavior Topic 18: JavaScript and Java Applets

Java and Domino Import/embed single file Java appletEmbed applet with parametersImport/embed multiple file applet with parametersApplet parametersShared Applet ResourceLiveConnectApplet access to JavaScript objectsDate picker Java appletDomino appletsExercise: Editor Java appletlotus.domino.AppletBase appletHow the lotus.domino.AppletBase applet worksDomino Server settingsClient settingsHow to embed the lotus.domino.AppletBase applet Accessing Domino objects via JavaScriptJava ConsoleCommon errors with lotus.domino.AppletBaseTopic 19: Domino Views

$$ViewTemplateDefault as redirectorJavaScript function calls in column formulasExercise: JavaScript in column formulaHTML check boxes in ViewsDocument processing in applet ViewAlphabetic indexSearch from ViewTopic 20: JavaScript and ActiveX Controls

ActiveX and securityExample 1: Shockwave not scriptedExample 2: Flash - scripted Example 3: Windows Media PlayerExample 4: Calendar controlExample 5: Run methods in embedded Editor controlTopic 21: Asynchronous JavaScript and XML

AJAX rediscoveredGET data from DominoPOST data to DominoXMLHttpRequest object XMLHttpRequest object exampleXMLHttpRequest and securityLimit and control data from viewJavaScript Object Notation (JSON)XML document transformation Other examples of using Domino XML outputTopic 22: Browser Compatibility

What browsers are being used?The issuesCode strategiesServer-side branching with @BrowserInfo@GetHTTPHeaderClient-side browser type/version detectionDetect browser type/version using CGI variableHide JavaScript from non-compliant browsersJavaScript version detectionClient-side object detectionCase Study: "Layers"Programmatic access to "layers"Cross-browser codingThe problem with either type of browser detection with JavaScriptTopic 23: JavaScript Resources

JScript referenceECMAScript-262 referenceBrowser object models (DOM)JavaScript example codeDHTML examplesJava appletsActiveX controlsAJAXJavaScript toolkits/function libraries/frameworksDomino AJAX examplesJSON

Programme scope, delivery arrangements and suitability are confirmed during enquiry.