TRY IT FREE FOR 30 DAYS
Full version  •  Quick installation  •  No spam
Download now

Tech Talk
LIGHTLY TECHNICAL OBSERVATIONS ON PEOPLESOFT, SQR, AND RELATED AND UNRELATED TOPICS

Archives

Using HTML Areas

In the last post I showed how to use an HTML area by adding one to the page and using PeopleCode (with or without an HTML object) to fill it. Now let's consider some specific uses of HTML areas.

PeopleSoft styles and CSS

PeopleSoft has a stylesheet object that you can use to modify the look of many pages or your entire system, but HTML areas are an easy way to style just one page or a few elements on a page.

Suppose that we want certain text elements, field labels or other things to be a particular size or color. When you add an object to the page you can specify the style by choosing from a dropdown list. If you are using the standard stylesheet then you are limited to what has been predefined. But we can override those styles.

Choose a style that is not normally used on the page. MUTE, RESET, and STRONG are good examples. Assign that style to the object you are adding to the page (in place of "Use default style"). Then add an HTML area to the page. It doesn't matter how you fill it (using the "constant" HTML box, or PeopleCode, or an HTML object). Here is the text:

   <style type="text/css">
     .MUTE  {font-size: 8pt; font-weight: normal; color: #aaa;}
   </style>

PeopleSoft "styles" are CSS classes. View the source of your page in the browser to see which classes are used by default for input fields, buttons, grid headers/borders and such. You can override any of those as shown above.

HTML areas and CSS can be used in many other ways to modify your page. Let's say that we want an overlay—sort of like a popup page but actually a part of the main page. It could be a set of instructions, some type of error message box, or anything else. Also, let's have PeopleCode control when and where this box appears.

   <div style="position: relative;">
     <div style="position: absolute; top: %BIND(:1)px; left: %BIND(:2)px; 
                 display: %BIND(:3); 
                 border: 1px solid black; padding: 8px;">
       Here is the text shown<br>
       in our pop-up box
     </div>
   </div>

The relative positioning followed by absolute positioning allows the text to "escape" from its usual position (where you put it on the page) and show up anywhere you want. (The "top" and "left" values start from where the HTML is located on the page, so use negative values to move it up or to the left.) For the "display" value, specify either "block" to make the box appear or "none" to hide it.

That example built the entire element within the HTML area. But you can also control existing elements. View the page source to determine the ID of the element you want to play with. It will often be something like MY_RECORD_MY_FIELD. Specify the ID with "#" like this:

   <style type="text/css">
     #MY_RECORD_MY_FIELD  {color: green;}
   </style>

Now that PeopleSoft is using Ajax techniques to handle some of the input on pages, you will sometimes not be able to find an element easily.

You may find a few quirks related to positioning and sizing an HTML area. In general, the width of the area is more important than the height. For example, if a large amount of text is sent into the HTML area, it will wrap at the width defined on the page but the height of the area will increase as needed to fit the text. No matter where you place the HTML area, you will usually find that blank space above and below the area tends to disappear when the page is rendered. I generally put everything within a DIV and specify top and bottom margins, like this:

   <div style="margin-top: 10px; margin-bottom: 20px;">
     Text or other elements here
   </div>

JavaScript

The other major use for HTML areas is in adding scripts to the page. JavaScript can grab and manipulate elements, capture events, and do many other things. Here is a very simple example just to get you started:

   <script type="text/javascript">
     alert("Hello World");
   </script>

As with CSS, there are special considerations related to PeopleSoft's use of Ajax when you are working with JavaScript. More on that next time.

PSSQRWhen 1 > 1 (or even 9999) 10-31-2014
SQRSQR colors 08-11-2014
SQRSQR lines, boxes and images 08-10-2014
SQRSQR one-point coordinate grid 08-09-2014
SQRSQR proportional fonts 08-08-2014
SQRSQR print positioning 08-07-2014
SQRSQR reports: The basics 08-06-2014
PS Fear of customization 07-18-2014
SQRSQR variable names 07-02-2014
PS Concatenating strings in PCode05-12-2014
PS HTML and server communication 05-05-2014
PS JavaScript in HTML areas 04-21-2014
PS Using HTML areas 04-18-2014
PS The HTML object 04-11-2014
PS Types of HTML areas 03-14-2014
SQREmbedded SELECTs in SQR 01-31-2014
PS Exporting all PeopleCode 11-30-2013
PS Disabling autocomplete 09-29-2013
SQRSP Debugger for SQR update 09-12-2013
General Stopping... and restarting 09-02-2013
SQRSQR debugger version 2 09-29-2010
SQRA few SQR items 05-20-2009
PS Ignoring "component changed" 05-07-2008
PS App Engine 04-30-2008
PS Commenting code 04-02-2008
PS The "Powered By" page 03-05-2008
PS Formats in PeopleCode vars 01-30-2008
PS Page layout with group boxes 01-09-2008
PS Meta-SQL wrappers 12-19-2007
PS Derived record PeopleCode 12-05-2007
PS A Cancel button 11-28-2007
General "Leading" the test effort 11-07-2007
SQRTemporary tables in SQR 10-31-2007
SQRUpdating long character data 10-24-2007
PS Record.Field specification 10-17-2007
PSSQRRELLANG.SQC 10-03-2007
PS Migrating project definitions 09-26-2007
PS Derived records 09-19-2007
PS Positioning elements on pages 08-29-2007
General Thanks 08-22-2007
SQRSQR "code alerts" 08-08-2007
PS Styles in HTML Areas 08-01-2007
SQRDynamic SQL for performance? 07-25-2007
PS Page Field Name 07-18-2007
PS PeopleCode event order 06-27-2007
SQRFormatting Excel using HTML 06-06-2007
Component-changed state 05-23-2007
PS Selecting styles for page fields05-16-2007
SQRSending email from SQR 05-02-2007
General Contractor networking 04-25-2007
PS Project X--and another project04-18-2007
PS Effective and data entry dates04-11-2007
PS A PeopleSoft home page 04-04-2007
PSSQRHyperion and the future of SQR03-21-2007
General The data doesn't lie 03-14-2007
PSSQRHyperion acquisition 03-07-2007
General Taking ownership 02-28-2007
PS Source control 02-21-2007
PS Sandboxes 02-14-2007
PS Migration instructions 02-07-2007
PS PeopleSoft environment usage 01-31-2007
PS Multiple environment strings 01-24-2007
PS Multiple testing environments 01-17-2007
PS PeopleSoft support environments 01-10-2007
General A single source of truth 01-03-2007
Nothing Smile 12-27-2006
PS Navigating the component buffer 12-20-2006
PS JavaScript and styles 12-13-2006
PS SQL for common HR queries 12-06-2006
SQRSQR program complexity 11-29-2006
SQRFrequent SQR questions 11-22-2006
PS Followup 11-15-2006
PS Expanding subrecords 11-08-2006
PS Bind variables 10-25-2006
PS Attaching objects to projects 10-18-2006
PS Partial transaction completion10-11-2006
PS The multi-process component 10-04-2006
PS Employee rows lost to security09-27-2006
SQRSQR document sections 09-20-2006
PS Empty-string compares in SQL 09-13-2006
SQRNulls, blanks, empty strings 09-06-2006
General Company policy 08-30-2006
PS Auto-lookup exclusion 08-23-2006
PS Effective status 08-16-2006
PS A couple of HRMS/HCM utilities08-02-2006
PS Translate value changes 07-26-2006
General Updating views 07-19-2006
General Set-based updates 07-12-2006
PS SQL set-based processing 07-05-2006
Being happy about bugs 06-28-2006
Busy in the PS marketplace 06-21-2006
General 2-way documentation 06-14-2006
PS Interfaces as views 06-07-2006
PS Hijacked fields 05-31-2006
General Agile software development 05-24-2006
General Working within Waterfall 05-17-2006
General Over the Waterfall 05-10-2006
PS Experimentation in PeopleSoft 05-03-2006
PS Unlimited enhancements? 04-26-2006
PS Testing direct DB updates 04-19-2006
SQRDelayed evaluation of SQL 04-12-2006
PS Database compares 04-05-2006
General Support problem? Call FBI! 03-29-2006
SQRFinding SQR errors 03-22-2006
PS Finding PeopleSoft Queries 03-15-2006
PS PeopleSoft Query support 03-08-2006
PS JOB table and SetIDs 03-01-2006
PS Migrating the project 02-22-2006
PS Compare and Report options 02-15-2006
PS Comparing and migrating projects 02-08-2006
PS Object security in App Designer 02-01-2006
PS Automation of App Designer 01-25-2006
General Contractors on PS projects 01-18-2006
General "Smart coding" 01-11-2006
SQRDebugger tricks 01-04-2006
PS EFFDT and component processing12-28-2005
PS Referential integrity 12-21-2005
PS Menu navigation using SQL 12-14-2005
SQRA coding standards wish list 12-07-2005
PS More App Designer options 11-30-2005
PS Pages in App Designer 11-23-2005
PS Finding objects on the menu 11-14-2005
PS Magic search record fields 10-31-2005
PS Documenting object attributes 10-24-2005
PS Monitoring server performance 10-17-2005
PS Searching PeopleCode 10-10-2005
PS Speeding up App Designer 10-03-2005
PS Using the message catalog 09-26-2005
PS Good ideas that sometimes aren't09-19-2005
PS And now Siebel 09-12-2005
SQRDate comparisons 09-05-2005
PSSQRFTP options 08-29-2005
PSSQRMoving code across environments08-22-2005
PS Spring cleaning 08-15-2005
SQRBuild your own SQR "IDE" 08-08-2005
PS Change control in App Designer08-01-2005
PS App Engine: disadvantages 07-25-2005
PS App Engine: advantages 07-18-2005
SQRCoding Excel file output 07-11-2005
General Creating Excel files 07-05-2005
PS Dave's next move 06-27-2005
SQRSQR variable oddities 06-20-2005
SQRSQR arrays 06-13-2005
SQRCompiling SQRs 06-06-2005
PS 5-character SETIDs 05-30-2005
PS Use all of the keys 05-23-2005
SQRDynamic SQL in SQR 05-16-2005
PS Running the in-place conv 05-09-2005
PS Searching for fields in DB 05-02-2005
PS Converting setup data 04-25-2005
PS Associating effective-dated tables 04-18-2005
PS Upgrading without an upgrade 04-04-2005
PS Scheduling patches 03-28-2005
PS To patch or not? 03-21-2005
PS Basic tools 03-14-2005
SQRWay back with sqrtools.com 03-07-2005
PS Meta-SQL 02-28-2005
PS Dropping the user index 02-21-2005
PS User indexes 02-14-2005
PS Page changes in App Designer 02-07-2005
General Generate SQL from SQL 01-31-2005
SQRSQR report viewer 01-24-2005
General Bug or enhancement? 01-17-2005
PSSQRTagging objects and code 01-10-2005
General Issue tracking 01-03-2005
PS PeopleSoft 10? 12-27-2004
PS Purging tables 12-20-2004
PS Acquisition 12-13-2004
PS Exporting PCode as text 12-06-2004
PS Simplify SQR code 11-29-2004
PS New site for SQR info 11-22-2004
PS Comparing objects 11-08-2004
PS Applying SQL-from-SQL 11-01-2004
General Generating SQL with SQL 10-25-2004
General Generating SQL 10-18-2004
PS Scrambling data 10-11-2004
PS What's going on with PS? 10-04-2004
SQRPrint positioning in SQR 09-27-2004
PS Oracle vs. PeopleSoft 09-13-2004
General Word, email, and lava lamps 09-06-2004
PS Custom run control: tips 08-30-2004
PS Custom run control: building 08-23-2004
PS PeopleCode, behind the scenes 08-16-2004
PS Language-specific pages 08-09-2004
SQRUsing substitution variables 08-02-2004
SQRSQR substitution variables 08-02-2004
PS HTML areas 07-19-2004
SQRRecursion in SQR 07-12-2004
SQRSQR code formatting 07-06-2004
SQRDebugger beta release 06-28-2004
PS Application Designer tidbits 06-27-2004
PS Configuration for custom SQR 06-14-2004
PSSQRModify or clone? 06-07-2004
PS Identifying custom objects 06-01-2004
PS EFFDT again 05-24-2004
General Change-only interface: impl 05-17-2004
General Change-only interface: concept05-10-2004
PS Cache troubles 05-03-2004
PS Component PeopleCode 04-25-2004
PS EFFDT and EFF_STATUS 04-18-2004
PS SETID in subselects 04-11-2004
PS Denormalized tables 04-04-2004
PS Documenting retired custom 03-28-2004
PS Sharing login IDs 03-21-2004
SQRGlobal and local SQR variables03-14-2004
SQRDISPLAY and MOVE 03-07-2004
PSSQRRun control in SQR 02-29-2004
SQRCommon sources of SQR bugs 02-22-2004
PS Implementation setup data 02-15-2004
PS Managing setup data 02-08-2004
PS Managing objects 02-01-2004
PS Make a home page 01-01-2004