Oracle Application Express 4.0 with Ext JS电子书

Oracle Application Express 4.0 with Ext JS

Table of Contents

Oracle Application Express 4.0 with Ext JS

Credits

About the Author

About the Reviewer

www.PacktPub.com

Support files, eBooks, discount offers and more

Why Subscribe?

Free Access for Packt account holders

Instant Updates on New Packt Books

Preface

What this book covers

What you need for this book

Who this book is for

Conventions

Reader feedback

Customer support

Downloading the example code

Errata

Piracy

Questions

1. Setting up an Oracle APEX and Ext JS Environment

Setting up for success

Installing Oracle APEX

Downloading Ext JS

Which web server to use?

Storing your web assets

Customizing application builder files

Oracle HTTP Server

Loading Ext JS onto the Oracle HTTP Server

Embedded PL/SQL Gateway

Loading Ext JS onto the Embedded PL/SQL Gateway

Oracle APEX listener

Loading Ext JS for the Oracle APEX listener

Overviewing the production setup

Using Ext JS in a hosted APEX environment

Installing a source code repository

Automating the build process

Configuring and using APEXExport

More ideas for automating the build process

Setting up a local web server

Summary

2. Getting Acquainted with Ext

Building a sandbox

Cross-browser DOM manipulation with Ext.Element

Heavyweight versus flyweight

Sizing and positioning

CSS classes and styling

DOM traversal

Selecting multiple elements

DOM manipulation

Defining event handlers

Using event delegation to reduce memory consumption

One-off events

Parameter passing using object notation

Old-school parameters

Using object notation

Basic syntax

Use namespacing to avoid collisions

Ext.namespace

Ext.BLANK_IMAGE_URL

Summary

3. Building a Ext JS Theme into APEX

Theme basics

Separation of concerns

Standard themes

Creating a theme

Building a Viewport Page template

Starting with a standalone template

Loading the page template into APEX

Issue when input items are outside the form

Ensuring that input items always remain with the form

Summary

4. Ext Themed Regions, Labels, and Lists

Region templates

Report Region

Form Region

Additional region templates

Label templates

Optional label

QuickTips for error messages

Optional label with help

Mandatory label

Mandatory label with help

Hidden label

List templates

Vertical unordered list without bullets

Vertical unordered list with bullets

Building an Ext JS tree template using lists

APEX 4.0 tree template

Prior APEX versions tree template

Highlighting the current node

Customizing individual nodes

Summary

5. Ext Themed Buttons, Popups, Calendars, and Reports

Button templates

Sliding doors meet CSS sprites

APEX sliding door CSS sprite button template

Building a hideous Ext.Button

Converting our buttons

Popup List of Values template

Breadcrumb templates

Benefits of using breadcrumbs

When not to use breadcrumbs

Basic horizontal breadcrumb template

Report templates

It's a classic

A better sorting indicator

CSS for the standard report

Calendar templates

Removing unused templates quickly

Publishing your theme

Summary

6. Adding Ext Layout Elements

Speed dating with a Date Picker

Converting Classic Dates to the Ext.DatePicker

Resizable text areas

Auto-sizing text areas

Auto-completing text fields

Adding auto-complete to select lists

Building tab panels using subregions

Building the tab panel template

Configuring the tab panel template

Toolbars and menus

Attaching the toolbar to the center panel

Summary

7. Working with Plug-ins and Dynamic Actions

A home for your plug-ins and dynamic actions

Building a better Number Field

Creating a plug-in item

Defining the plug-in Callback functions

Creating a page item based on the Number Field plug-in

Render functionality for the Number Field plug-in

Validation functionality for the Number Field plug-in

Summary

8. Data Stores, AJAX-enabled Plug-ins, and Dynamic Actions

Storing data on the browser client

Using Data Stores with large datasets

Building a ComboBox plug-in

Defining the ComboBox plug-in

Defining the ComboBox plug-in callback functions

Rendering functionality for the ComboBox plug-in

AJAX functionality for the ComboBox plug-in

Using the Ext.XTemplate to provide enhanced formatting

Validation functionality for the ComboBox plug-in

Mixing ComboBoxes with Dynamic Actions

Integrating plugins with the Dynamic Action framework

Defining custom events for the ComboBox

Summary

9. Getting Interactive with GridPanels

Components making up a GridPanel

Defining the Data Store

Configuring the Column Model

Defining the GridView

Defining the Selection Model

Built-in features

Getting the GridPanel into APEX

Testing the concepts first

Converting APEX-generated table into a GridPanel

Idea: Use APEX report table as local Data Store

GridPanel pagination using APEX Partial Page Refreshes

GridPanel as a region plug-in

Plug-in definition

Plug-in package

Render functionality for the GridPanel plug-in

Minor pagination issue

AJAX functionality for the GridPanel plug-in

Building a custom DataReader

Creating a custom TableGrid component

Making the TableGrid Stateful

Using the TableGrid

TableGrid template

Convert Classic Reports to TableGrids

Summary

10. IFrame Tabs, Panels, and Popup Windows

Embedding pages using iFrame panels

Reusable iFrameComponent

Resizable iFrame panel

Pre-configured components using the factory pattern

IFrame panel factory pattern

IFrame panel plug-in

Plug-in package

Render functionality for the iFrame panel plug-in

Modal popup windows

Modal iFramed window

Popup window component

Ext.apex.PopupWindow example

Link Column settings

Classic Report link settings

Create Button settings

Closing the PopupWindow

Cancel Button functionality

Apply Changes functionality

Creating a tabbed document interface

Examining the HTML page

Examining the JavaScript

Adding the tabbed document interface to APEX

Summary

11. Performance Tuning Your JavaScript

Best practices for JavaScript and CSS

HTTP compression

Externalize JavaScript and CSS

Combining JavaScript and CSS files

Minifying JavaScript and CSS files

Ordering CSS and JavaScript files

JSBuilder2 installation and usage

Installation

JSBuilder2 usage

JSB2 file format

Eliminating unused Ext JS library components

Removing duplicate functionality

Removing unused components

Minimizing Application JavaScript

Summary

Index