Code Example

This is the code for this test form.

/* My form field validation */
function validateMyForm(nextFormPartNum, nextFormPart, theatre) {
	var currPart=theatre.actors[theatre.index];
	var retVal=true;
	$("*:input.required", currPart)
		.each(function() {
			if (!$(this).val()) {
				$(this).addClass('error').focus().et({color: red});
				retVal=false; /* Prevent movement */
			} else {
				$(this).et('hide');
            }
		});

        // Hide next/prev buttons as needed
        if (retVal) $('#testNext').css('visibility', nextFormNum == theatre.actors.length - 1 ? 'hidden' : 'visible');
        if (retVal) $('#testPrev').css('visibility', nextFormNum == 0 ? 'hidden' : 'visible');

	return retVal;
}

/* Theatre Initialization */
$('#test').theatre({
	itemWidth:"max", /* Stretch to fit container */
	itemHeight:"max", /* Stretch to fit container */
	controls: "none",
	onMove: validateMyForm, /* Form validation */
	autoplay: false,
    paging: '#testPaging'
});