Hi Ian,
Greetings from Syncfsuion.
Selecting will be triggered once the tab item is clicked just like action begin action. When the tab item is interacted (enable / disable), Selecting will be triggered and the previous tab item values will be maintained in previousIndex and selectedIndex. For example, when the 2nd index item is selected then its previousIndex (0) and selectedIndex (1) will be based on 1st index tab item. We have modified the wizard sample, so that Selecting event will be triggered twice instead of thrice.
function tabNavigations(args) {
switch (args.target.id) {
case 'searchNext':
debugger
/* Validate the Source, Destination, Date and Class chosen and proceed only if all the fields are selected */
if (!ej.base.isNullOrUndefined(startPoint.value) && !ej.base.isNullOrUndefined(endPoint.value) &&
!ej.base.isNullOrUndefined(ticketType.value) && !ej.base.isNullOrUndefined(journeyDate.value)) {
if (!ej.base.isNullOrUndefined(startPoint.value) && startPoint.value === endPoint.value) {
document.getElementById('err1').innerText = '* Arrival point can\'t be same as Departure';
}
else {
console.log("-------------------------");
// no select needed
console.log("Beginning of else block for searchNext case statement")
console.log("enabling tab: 1");
tabObj.enableTab(1, true);
console.log("disabling tab: 0");
tabObj.enableTab(0, false);
filterTrains(args);
console.log("End of else block for searchNext case statement")
console.log("-------------------------");
}
}
else {
document.getElementById('err1').innerText = '* Please fill all the details before proceeding';
}
break;
case 'bookTickets':
/* Based on the selected station generate Grid content to display trains available */
if (availTrainGrid.getSelectedRecords() === undefined || availTrainGrid.getSelectedRecords().length === 0) {
document.getElementById('err2').innerText = '* Select your convenient train';
}
else {
// no select needed
tabObj.enableTab(2, true);
tabObj.enableTab(1, false);
document.getElementById('err2').innerText = '';
}
break;
case 'confirmTickets':
/* Get the Passenger details and validate the fields must not be left empty */
var name = document.getElementById('pass_name1');
var age = document.getElementById('pass_age1');
var gender = document.getElementById('pass_gender1');
if (name.value === '' || age.value === '' || gender.value === '') {
document.getElementById('err3').innerText = '* Please enter passenger details';
}
else {
// no select needed
tabObj.enableTab(3, true);
tabObj.enableTab(2, false);
document.getElementById('err3').innerText = '';
finalizeDetails(args);
}
break;
}
}
Regards,
Karthi
