123
Like
Share
ReportBack in the days when BC was NAV this was your typical card/document page:
This is where the history lesson stops and the new wave comes in. I’ve been dealing with a prospective client who uses an old version of AX and the switch to vertical tabs lacked some appeal. My initial thought of course was PowerApps but I wanted to challenge myself with BC page design. This blog is to show a concept which I think is nice but maybe on the novelty side for some. This is how it looks and functions on a card page for items:
The main thing to share here is the code so please check it out if you would like to try this on a page you think this fits. So which is faster? Horizontal tabs or BC Fast tabs? who wins the fight? You decide! 
page 50204 "Horizontal Tab Item Card"
{
Caption = 'Item Query';
PageType = Card;
SourceTable = Item;
Editable = true;
InsertAllowed = false;
DeleteAllowed = false;
layout
{
area(content)
{
group(ItemTabs)
{
Caption = '';
grid(buttonrow)
{
GridLayout = Rows;
field(GeneralTab; General)
{
ApplicationArea = All;
ShowCaption = false;
DrillDown = true;
StyleExpr = GeneralStyleText;
trigger OnDrillDown()
begin
VisOption := VisOption::General;
ChangeStyleExpr(VisOption);
CurrPage.Update(false);
end;
}
field(OnHand; OnHand)
{
ApplicationArea = All;
ShowCaption = false;
DrillDown = true;
StyleExpr = OnHandStyleText;
trigger OnDrillDown()
begin
VisOption := VisOption::OnHand;
ChangeStyleExpr(VisOption);
CurrPage.Update(false);
end;
}
field(SaleOrd; SaleOrd)
{
ApplicationArea = All;
ShowCaption = false;
DrillDown = true;
StyleExpr = SaleOrdStyleText;
trigger OnDrillDown()
var
SL: Record "Sales Line";
begin
VisOption := VisOption::SaleOrd;
ChangeStyleExpr(VisOption);
CurrPage.Update(false);
end;
}
field(PurchOrd; PurchOrd)
{
ApplicationArea = All;
ShowCaption = false;
DrillDown = true;
StyleExpr = PurchOrdStyleText;
trigger OnDrillDown()
var
PL: Record "Purchase Line";
begin
VisOption := VisOption::PurchOrd;
ChangeStyleExpr(VisOption);
CurrPage.Update(false);
end;
}
field(Transac; Transac)
{
ApplicationArea = All;
ShowCaption = false;
DrillDown = true;
StyleExpr = TransacStyleText;
trigger OnDrillDown()
var
ILE: Record "Item Ledger Entry";
begin
VisOption := VisOption::Transac;
ChangeStyleExpr(VisOption);
CurrPage.Update(false);
end;
}
field(Website; Website)
{
ApplicationArea = All;
ShowCaption = false;
DrillDown = true;
StyleExpr = WebsiteStyleText;
trigger OnDrillDown()
begin
VisOption := VisOption::Website;
ChangeStyleExpr(VisOption);
CurrPage.Update(false);
end;
}
field(Stats; Stats)
{
ApplicationArea = All;
ShowCaption = false;
DrillDown = true;
StyleExpr = StatsStyleText;
trigger OnDrillDown()
begin
VisOption := VisOption::Stats;
ChangeStyleExpr(VisOption);
CurrPage.Update(false);
end;
}
}
}
part(AXItemCard; "Item Card General")
{
Visible = VisOption = VisOption::General;
ApplicationArea = All;
SubPageLink = "No." = FIELD("No."),
"Date Filter" = FIELD("Date Filter"),
"Global Dimension 1 Filter" = FIELD("Global Dimension 1 Filter"),
"Global Dimension 2 Filter" = FIELD("Global Dimension 2 Filter"),
"Location Filter" = FIELD("Location Filter"),
"Drop Shipment Filter" = FIELD("Drop Shipment Filter"),
"Bin Filter" = FIELD("Bin Filter"),
"Variant Filter" = FIELD("Variant Filter"),
"Lot No. Filter" = FIELD("Lot No. Filter"),
"Serial No. Filter" = FIELD("Serial No. Filter");
}
part(SalesOrdsPart; "Sales Orders List Part")
{
Visible = VisOption = VisOption::SaleOrd;
ApplicationArea = All;
SubPageLink = "No." = FIELD("No.");
}
part(PurchOrdsPart; "Purchase Order Line ListPart")
{
Visible = VisOption = VisOption::PurchOrd;
ApplicationArea = All;
SubPageLink = "No." = FIELD("No.");
}
part(Transactions; ItemTransactionsCardPart)
{
Visible = VisOption = VisOption::Transac;
ApplicationArea = All;
SubPageLink = "Item No." = FIELD("No.");
}
part(SKuList; "SKU List")
{
Visible = VisOption = VisOption::OnHand;
ApplicationArea = All;
SubPageLink = "Item No." = field("No.");
}
part(picture; "Item Picture")
{
Visible = VisOption = VisOption::Picture;
ApplicationArea = All;
SubPageLink = "No." = field("No.");
}
}
}
trigger OnOpenPage()
begin
VisOption := VisOption::General;
end;
procedure ChangeStyleExpr(VisOption: Option General,OnHand,SaleOrd,PurchOrd,Transac,Picture,Stats): Text[50]
Begin
ResetTabs();
case VisOption of
VisOption::General:
GeneralStyleText := 'StrongAccent';
VisOption::OnHand:
OnHandStyleText := 'StrongAccent';
VisOption::PurchOrd:
PurchOrdStyleText := 'StrongAccent';
VisOption::SaleOrd:
SaleOrdStyleText := 'StrongAccent';
VisOption::Stats:
StatsStyleText := 'StrongAccent';
VisOption::Transac:
TransacStyleText := 'StrongAccent';
VisOption::Website:
WebsiteStyleText := 'StrongAccent';
end;
End;
local procedure ResetTabs();
begin
GeneralStyleText := 'Standard';
OnHandStyleText := 'Standard';
SaleOrdStyleText := 'Standard';
PurchOrdStyleText := 'Standard';
TransacStyleText := 'Standard';
WebsiteStyleText := 'Standard';
StatsStyleText := 'Standard';
end;
var
General: Label 'General';
OnHand: Label 'On Hand';
PurchOrd: Label 'Purchase Orders';
SaleOrd: Label 'Sales Orders';
Transac: Label 'Transactions';
Website: Label 'Picture';
Stats: Label 'Statistics';
[InDataSet]
VisOption: Option General,OnHand,SaleOrd,PurchOrd,Transac,Picture,Stats;
[InDataSet]
GeneralStyleText: Text;
[InDataSet]
OnHandStyleText: Text;
[InDataSet]
PurchOrdStyleText: Text;
[InDataSet]
SaleOrdStyleText: Text;
[InDataSet]
TransacStyleText: Text;
[InDataSet]
WebsiteStyleText: Text;
[InDataSet]
StatsStyleText: Text;
}
*This post is locked for comments