The Ready Event

Client side libraries such as jQuery can be used to configure controls in Ebase Xi. This video demonstrates how to apply the jQuery datepicker widget onto a Date field.

With the jQuery libraries installed, the jQuery document.ready event can be attached to the form using a client script with the following code:

$(document).ready(function(){
	$(".datepicker").datepicker({ 
		showOn: "button", 
		buttonText: 'Select Date', 
		buttonImage: "images/calendar.gif", 
		buttonImageOnly: true, 
		dateFormat: 'dd/mm/yy', 
		showButtonPanel: false, 
		changeMonth: true, 
		changeYear: true 
	});	
});

A Date field on the form will have a class of datepicker and the above code will apply the jQuery widget at runtime.

A problem occurs if you have Ajax enabled on the form's properties. Enabling Ajax means that Ebase Xi will only refresh controls or parts of the page that have changed. This means that the whole page does not get reloaded and the document.ready event does not get re-executed and the datepicker will disappear.

Ebase Xi provides a READY event which can be found on any control's HTML Element Properties. The code to configure the datepicker is placed into the jQuery tab.

This event always fires when the page is loaded, controls are displayed, or refreshed after server side interaction.