selectTabPane method not working

[gfspeter]

I have a simple dialog2 form with a Tab control. The tab control is "based on" the ship-to address type in that each tab represents a different address type.
The address type value associated with the currently selected tab is shown beside the title. As the user selects the different tabs, the corresponding tab value
is shown in the text box. In the example below, the user has selected the 3rd tab for "freeform input" and the tab number 3 is shown in the text box.

selectTabPane dialog2.jpg

When the user presses the "Save Selection" button, the calling dialog is updated with the ship-to address type value and the associated address information. This works correctly.
If the user then re-opens this dialog to make a different selection, I would like this dialog to open to the correct tab pane - i.e. the user selected
FreeForm last time and wants to change his/her mind so the form should open with the current selection of 3 / FreeForm showing.

However, this is where my problem lies. As you can see below, the correct ship-to type (3) is showing in the text box but the first tab is in view, not the 3rd (FreeForm).

selectTabPane dialog.jpg

I have the following code in the onRenderComplete client side event and have also tried it in the onInitializeComplete event.

function setInitialTabPane()
{
	//Get the current value in 'ShipToTypeID'
	var curShipToTypeID = {dialog.object}.getValue('ShipToTypeID');

	//Set the current pane number
	if (curShipToTypeID == 0)
	{
	{dialog.object}.selectTabPane('TAB_1',4);
	}
	else
	{
	{dialog.object}.selectTabPane('TAB_1',curShipToTypeID);
	}
}

At first thought, it would seem that the .selectTabPane is simply being ignored but I don't think so. I added 3 buttons to the dialog for testing, each one with a specific statement for selecting a tab pane and they all worked just fine.

{dialog.object}.selectTabPane('TAB_1',1);
...
{dialog.object}.selectTabPane('TAB_1',2);
...
{dialog.object}.selectTabPane('TAB_1',3);

It would seem perhaps that I just have the code to select the initial tab pane in the wrong event to get the dialog to initialize properly or there is something a little off in my JavaScript (which would not be a bit surprise).

Any suggestions would be very helpful. Likely something quite simple that I am overlooking.

Thanks for your help,
Peter

[RichCPT]

Re: selectTabPane method not working

Peter G.,

I have not done this in a Dialog2 before, but I do have a grid and a linked grid with 4 comments tabs where I'm able to keep a particular tab selected as the user navigates records in the main grid. Maybe what I did for linked grids will give some ideas on how to do this in a Dialog2.

In the linked grid client-side events for "OnGridInitializeComplete" event I put this:

// Select the tab we really want, instead of the one Alpha selected for us.
TryShowPrefCmntTab();

And in the "AfterAjaxCallbackComplete" event I put this:

if( e.ajaxEvent == 'SynchronizeGridInWindow' ) {
// Select the tab we really want, instead of the one Alpha selected for us.
TryShowPrefCmntTab();
}

You would have to figure-out what to put in place of "'SynchronizeGridInWindow' ".

My Javascript for "TryShowPrefCmntTab()" looks like this:

function TryShowPrefCmntTab () {

// If tab control not created yet then exit.
ctl_id = '{Grid.ComponentName}' + '_' + 'DVTAB_CMNTS' + 'R_1';
obj = $(ctl_id);
if ( obj == false ) return;

var tb = {grid.Object}.getSessionVariable('SWPDRCMNTTAB'); // Replace with desired var
// Exit if preferred comment Tab not set or out of range.
if( tb == false || tb < "1" || tb > "4") return;
// See if the chosen comment Tab is allowed for this record
var hasCmntFldId = 'DRHAS_ROLE' + tb + '_COMMENT_NY';
var hasCmntYN = {grid.Object}.getValue('G', hasCmntFldId, 1); // always using just row # 1 here
if( hasCmntYN == 'Y' ) {
// Replace 'CMTEXT' ID prefix with control ID prefix on the desired tab
// Replace 'G' with 'D' if on detail view.
// Replace 1 with current row number of grid, if allow more than 1 record row.
{grid.Object}.activateControlContainer('ROLE' + tb,'G',1);
}
}

Ignore the stuff in the above code that applies to security checking - "hasCmntYN" and "hasCmntFldId ". Some users don't get to see all the possible tabs.

In the above code the line that would be of interest to you is:

{grid.Object}.activateControlContainer('ROLE' + tb,'G',1);

You'd need to replace the {grid.Object} placeholder with the one used for dialogs. And you would replace 'ROLE' with the control name prefix you have on your tabs. And tb would be replaced with the tab number you want to show. In the above code I track the desired tab number by putting it into a session variable:
'SWPDRCMNTTAB'.

However, the session variable is not the best place to store this info. If the user opens more than one instance of my browse form then both instances would probably use the same default tab number. Which they may or may not want. But in my case, it is very unlikely a user will ever open two instances. I think videos M43 and M45 present another way of passing data between components.
-Rich