Appendix D: XHTML

This Appendix presents a drill-down into the new output XHTML as it is, before it is manipulated by JavaScript. Items between [brackets] refer to variables or variable content.

[PAGE]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
  <head>
    <title>[PAGETITLE]</title>
    <link rel="stylesheet" type="text/css" href="cs/ui/jquery-ui-1.7.2.custom.css" />
    <link rel="stylesheet" type="text/css" href="cs/div_oriented.css" />
    <link rel="stylesheet" type="text/css" href="cs/ui.itppreview.css" />
    <link rel="stylesheet" type="text/css" href="cs/ui.itpselect.css" />
    <script type="text/javascript" src="js/jquery-1.4.1.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui-1.7.2.custom.min.js"></script>
    <script type="text/javascript" src="js/ui.itppreview.js"></script>
    <script type="text/javascript" src="js/ui.itpselect.js"></script>
    <script type="text/javascript" src="js/itpcommon.js"></script>
    <script type="text/javascript" src="resources/[LANGUAGE].js"></script>
    <script type="text/javascript" src="support/javascript/itp_ajax.js"></script>
    <script type="text/javascript" src="support/javascript/itp_textblocks.js"></script>
    <script type="text/javascript" src="support/javascript/mktree.js"></script>
    <script type="text/javascript" src="support/javascript/parse.js"></script>
    <script type="text/javascript" src="js/itpmessage.js"></script>
    <script type="text/javascript" src="js/itpelementfactory.js"></script>
    <script type="text/javascript" src="js/itpelementfactorymappings.js"></script>
    <script type="text/javascript" src="js/itpelement.js"></script>
    <script type="text/javascript" src="js/itprootelement.js"></script>
    <script type="text/javascript" src="js/itppage.js"></script>
    <script type="text/javascript" src="js/itppageelement.js"></script>
    <script type="text/javascript" src="js/itpform.js"></script>
    <script type="text/javascript" src="js/itpgroup.js"></script>
    <script type="text/javascript" src="js/itpsubmitbutton.js"></script>
    <script type="text/javascript" src="js/itpquestion.js"></script>
    <script type="text/javascript" src="js/itpnumberquestion.js"></script>
    <script type="text/javascript" src="js/itpboolquestion.js"></script>
    <script type="text/javascript" src="js/itpdatequestion.js"></script>
    <script type="text/javascript" src="js/itptimequestion.js"></script>
    <script type="text/javascript" src="js/itpsimplesingleselectquestion.js"></script>
    <script type="text/javascript" src="js/itpradiosingleselectquestion.js"></script>
    <script type="text/javascript" src="js/itpsimplemultiselectquestion.js"></script>
    <script type="text/javascript" src="js/itptextblocksingleselectquestion.js"></script>
    <script type="text/javascript" src="js/itptextblockmultiselectquestion.js"></script>
    <script type="text/javascript" src="js/itpetbquestion.js"></script>
    <script type="text/javascript" src="js/itpfilequestion.js"></script>
    <script type="text/javascript" src="js/itptextquestion.js"></script>
    <script type="text/javascript">
      var implementation ='[IMPLEMENTATION]';
      var uploadpath='[UPLOADPATH]';
      var amInSecureMode=true/false;
      var itppage = itpelementfactory.getITPElement([JSONINFO]);</xsl:text>
    </script>
  </head>
  <body onload="itppage.initialise(function(pObj){});">
    <div class="main [TYPE]">
      <script type="text/javascript">
        itppage.registerElement([JSONINFO]);
      </script>
      <form id="id_form" action="[LINKPAGE]" enctype="multipart/form-data" accept-charset="UTF-8" method="post">
[GROUP]n
        <div class="buttons">
[BUTTON(ok back1 cancel)]n
[BUTTON(other)]n
        </div>
      </form>
    </div>
    <input class="initmarker" style="display: none;" type="checkbox"/>
  </body>
</html>

[GROUP]

  <script type="text/javascript">
    itppage.registerElement([JSONINFO]);
  </script>
  <div class="group level[LEVEL]" id="id_[ID]_container">
    <fieldset>
      <legend>
        <span class="groupheader" id="id_[ID]_groupheader">
          <span class="grouptitle">
            [TITLE]
          </span>
        </span>
      </legend>
      <div class="groupbody" id="id_[ID]_groupbody">
[GROUP/TABLE/QUESTION]n
      </div>
    </fieldset>
  </div>

[TABLE]

  <table class="itptable">
[ROW]n
  </table>

[ROW]

  <tr>
[CELL]n
  </tr>

[CELL]

  <td>
[QUESTION]n
  </td>

[KEYLIST]

  <div class="keylist group level[LEVEL]" id="id_keylist_container">
    <fieldset title="[KEYLISTPROMPT]">
      <legend>
        <span class="groupheader" id="id_keylist_groupheader">
          <span class="grouptitle">
            [KEYLISTPROMPT]
          </span>
        </span>
      </legend>
      <div class="groupbody" id="id_[ID]_groupbody">
[KEY]n
      </div>
    </fieldset>
  </div>

[KEY]

  <script type="text/javascript">
    itppage.registerElement([JSONINFO]);
  </script>
  <div class="key" id="id_[ID]_container">
    <input type="submit" id="id_[ID]_submit" name="submission" value="[SUBMISSION]"/>
  </div>

[SIMPLETEXT]

  <div class="statictext">
    [TEXT]
  </div>

[QUESTION]

<!-- Note: in a Content Wizard some section questions are suppressed. -->
  <script type="text/javascript">
    itppage.registerElement([JSONINFO]);
  </script>
  <div class="question [STRUCTURETYPE] [CONTROLTYPE] [RENDERINGCONTEXT] [PARITY] question_[PARITY]" id="id_[IDHASH]_container">
    <div class="label [STRUCTURETYPE] [isempty/haslabel]">
      <span class="annotation">
        <img id="[ID]_help" src="cs/img/helpicon.gif" class="help" alt="help" title="[HELPTEXT]" [style="visibility:hidden"]/>
        <img id="[ID]_feedback" src="cs/img/feedbackicon.gif" class="feedback" alt="feedback" title="[FEEDBACK]" [style="visibility:hidden"]/>
      </span>
      <span class="labelwrap">
        <label for="[REF]">
          [LABEL]
        </label>
      </span>
    </span>
    <div class="input [STRUCTURETYPE]">
[ETBQ/DATE/TIME/TEXT/NUMBER/FILE/BOOL/TEXTBLOCKMULTISELECT/SIMPLEMULTISELECT/TEXTBLOCKSINGLESELECT/RADIOSINGLESELECT/SIMPLESINGLESELECT]
    </div>
  </div>

[ETBQ]

  <script language="javascript">
    online_tbk_manager.registerTextBlock('[REF]', [READONLY?]);
   [online_tbk_manager.registerFieldSet('[REF]', '[FIELDSETNAME]');
     [online_tbk_manager.registerField('[REF]', '[FIELDSETNAME]', '[FIELDNAME]);]n
   ]n
  </script>
  <input class="ui-widget" type="text" id="id_[REF]" name="[REF]" value="[DEFAULT]" [disabled="true"]>
  </input>

[DATE]

  <input class="ui-widget" type="text" id="id_[REF]" name="[REF]" size="10" maxlength="10" value="[DEFAULT]" [disabled="true"]/>

[TIME]

  <input class="ui-widget" type="text" id="id_[REF]" name="[REF]" size="8" maxlength="8" value="[DEFAULT]" [disabled="true"]/>

[TEXT length >= 50]

  <textarea id="[REF]" name="id_[REF]" cols="40" cols="[10 or less]" [disabled="true"]>
    [DEFAULT]
  </textarea>

[TEXT length < 50]

  <input class="ui-widget" type="text" id="id_[REF]" name="[REF]" value="[DEFAULT]" [maxlength="[LENGTH]" size="[LENGTH]"] [disabled="true"]/>

[NUMBER]

  <input class="ui-widget" type="text" id="id_[REF]" name="[REF]" size="[SIZE]" maxlength="[SIZE]" value="[DEFAULT]" [disabled="true"]/>

[FILE]

  <input class="ui-widget" type="file" id="id_[REF]" name="[REF]" size="40" [disabled="true"]/>

[BOOL]

  <input class="ui-widget" type="checkbox" id="id_[REF]" name="[REF]" [checked="Y"] [disabled="true"]/>

[TEXTBLOCKMULTISELECT]

    <select id="[REF]" name="id_[REF]" size="[NROFOPTIONS]" multiple="multiple" [disabled="true"]>
[OPTION]n
    </select>

[SIMPLEMULTISELECT]

    <select id="[REF]" name="id_[REF]" size="[NROFOPTIONS]" multiple="multiple" [disabled="true"]>
[OPTION]n
    </select>

[TEXTBLOCKSINGLESELECT]

    <select id="[REF]" name="id_[REF]" size="[NROFOPTIONS]" [disabled="true"]>
[OPTION]n
    </select>

[RADIOSINGLESELECT]

    <select id="[REF]" name="[REF]" size="[NROFOPTIONS]" [disabled="true"]>
[OPTION]n
    </select>

[SIMPLESINGLESELECT]

    <select id="[REF]" name="[REF]" size="[NROFOPTIONS]" [disabled="true"]>
[OPTION]n
    </select>

[OPTION]

  <option value="{$optioninfo/value}" [selected="true"]>
[LABEL]
  </option>

[BUTTON]

  <script type="text/javascript">
    itppage.registerElement([JSONINFO]);
  </script>
  <span id="id_[ID]_container">
    <input type="submit" id="id_[ID]_submit" name="submission" value="[SUBMISSION]"/>
  </span>