Configuration‎ > ‎

qbo.Panel Options: Attributes vs. JSON

posted Mar 18, 2011, 10:10 AM by Eric Patrick   [ updated Mar 25, 2011, 12:23 PM ]
The qbo.Panel javascript class (from which most qbo.* javascript classes derive) allows you to specify various options as either a direct attribute, or as part of a data-options attribute containing a JSON value.  The later is preferred.

For example, dropping in a qbo.ReportObject from XSLT can be done like this:

<div id="ResolutionMessageList" class="panel" type="qbo.ReportObject" method="RunXhtml" title="Resolution Comments" reportid="1" xslturl="/Templates/Debt/ResolutionMessageList.Ajax.xslt">.</div>

But this is preferred:

<div id="ResolutionMessageList" class="panel" type="qbo.ReportObject" method="RunXhtml" title="Resolution Comments" data-options="{{ reportid: 1, xslturl: '/Templates/Debt/ResolutionMessageList.Ajax.xslt' }}">.</div>

With the advent of HTML5, strict browser enforcement will reject the reportid attribute, since reportid is not a standard HTML attribute for <div> tags.  However, any attributes that begin with 'data-' will be accepted by HTML 5.

More practically, there exist other options ('save' comes to mind) that behave differently as an attribute than as part of data-options.  

save="true" sets options.save = "true" (a string)
data-options="{ save: true }" sets options.save = true (a boolean)

Only data-options gives you the ability to do non-string-based options.  Relevant for save, and for dates and such.

For more information on JSON, see: 
Comments