AJAX
ajax:delayedload ajax:event ajax:region
Data
data:calendar data:column data:postrepeater data:productbrandrepeater data:productcategoryrepeater data:productrepeater data:repeater data:table data:template data:tree
Forms
forms:address forms:captcha forms:checkbox forms:checkboxgroup forms:codeeditor forms:combobox forms:datepicker forms:dialogbox forms:editbox forms:fileupload forms:form forms:hidden forms:money forms:officeuseregion forms:option forms:password forms:paymentmethod forms:radiobutton forms:radiobuttongroup forms:row forms:searchbox forms:signature forms:slider forms:spinbox forms:submitbutton forms:submitimage forms:submitlink forms:successcontent forms:textarea forms:timepicker
Layout
layout:gallery layout:productgallery layout:rotator layout:stepper layout:stepperpanel layout:tablist layout:tablistitem
Logic
logic:dependency logic:parse logic:if logic:else logic:include logic:variable
Navigation
navigation:breadcrumbs navigation:item navigation:primary navigation:secondary
Standard
standard:audio standard:embed standard:icon standard:image standard:link standard:script standard:tooltip standard:video
Templates
templates:button templates:card templates:column templates:fancybox templates:faq templates:flexlayout templates:header templates:row templates:section templates:teammember templates:testimonial
Regions
regions:content regions:contentadditional regions:security regions:togglable
Third Party
thirdparty:googlemap thirdparty:googlemapmarker
Attributes
Examples

<ajax:event />

AJAX events define an interaction sequence between a client and the server.
Typically, javascript will trigger the AJAX event which executes code and updates a region on the page.
For example, ticking a box might send data to the server, and depending on it's value, show or hide additional content on the page.

Any javascript event on an Oncord control can trigger an ajax event.
Just specify the native event name, suffixed by ajax.
For instance: onclickajax="..." and onchangeajax="...".

Attributes

id
string
Give this control a unique id. Can be accessed in the client DOM (eg, document.getElementById('myid') or in the server DOM using [? $myid ?] or [? $('myid') ?]).
showLoading
bool
Whether or not to show a loading message. Default = true.
updateRegions
string|array
Sets which ajax:region controls to refresh

Examples

Checkbox Show / Hide

Shows or hides a block of content based on a checkbox.

HTML:

<p>Tick the box below to see a block show or hide.</p> <ajax:event id="showhide_checkbox_ajaxevent" updateregions="showhide_ajaxregion" /> <forms:form> <forms:row label="Tick this box..."> <forms:checkbox id="showhide_checkbox" onclickajax="showhide_checkbox_ajaxevent" label="Click for More Options" /> </forms:row> <ajax:region id="showhide_ajaxregion"> <logic:if test="$showhide_checkbox.checked"> <forms:row label="And then these options show..."> <forms:editbox id="moreoptions" /> </forms:row> </logic:if> </ajax:region> <forms:row type="one_column"> <forms:submitbutton>Submit Enquiry</forms:submitbutton> </forms:row> </forms:form>

Run Example

MD5 Calculator

Demonstrates an AJAX event and region to calculate a MD5 of the edit box value.

HTML:

<p>Enter text into the edit box to calculate the md5</p> <ajax:event id="ajaxevent1" updateregions="ajaxregion1" /> <forms:form> <forms:editbox id="editbox1" onkeyupajax="ajaxevent1" /> </forms:form> <br /><br /> <ajax:region id="ajaxregion1"> [? md5($editbox1.value) ?] </ajax:region>

Run Example