Merge remote-tracking branch 'origin/mac3' into mac3

kgOrdersClient/AddCustomer.dfm

 object FViewAddCustomer: TFViewAddCustomer
   Width = 842
   Height = 607
-  OnShow = WebFormShow
+  CSSLibrary = cssBootstrap
+  ElementFont = efCSS
+  object lblFormState: TWebLabel
+    Left = 18
+    Top = 16
+    Width = 3
+    Height = 15
+    ElementID = 'lbl_form_state'
+    HeightPercent = 100.000000000000000000
+    WidthPercent = 100.000000000000000000
+  end
   object dtpStartDate: TWebDateTimePicker
     Left = 19
     Top = 216
@@ -236,7 +246,7 @@ object FViewAddCustomer: TFViewAddCustomer
     BorderColor = clSilver
     ChildOrder = 11
     ElementFont = efCSS
-    ElementHeaderClassName = 'thead-light sticky-top bg-light'
+    ElementHeaderClassName = 'thead-light sticky-top bg-light border-light'
     ElementPosition = epRelative
     ElementTableClassName = 'table table-striped table-hover table-bordered text-sm'
     Footer.ButtonActiveElementClassName = 'btn btn-primary'
@@ -313,6 +323,7 @@ object FViewAddCustomer: TFViewAddCustomer
     Width = 121
     Height = 22
     ChildOrder = 22
+    EditType = weNumeric
     ElementID = 'edtshippingzip'
     Enabled = False
     HeightPercent = 100.000000000000000000
@@ -432,18 +443,6 @@ object FViewAddCustomer: TFViewAddCustomer
     WidthPercent = 100.000000000000000000
     OnClick = btnShipAddClick
   end
-  object btn_confirm_delete: TWebButton
-    Left = 725
-    Top = 433
-    Width = 96
-    Height = 25
-    Caption = 'Delete'
-    ChildOrder = 82
-    ElementID = 'btn_confirm_delete'
-    HeightPercent = 100.000000000000000000
-    WidthPercent = 100.000000000000000000
-    OnClick = btn_confirm_deleteClick
-  end
   object edtFirstLine: TWebEdit
     Left = 190
     Top = 430
@@ -475,12 +474,12 @@ object FViewAddCustomer: TFViewAddCustomer
     Top = 72
   end
   object WebDataSource1: TWebDataSource
+    AutoEdit = False
     DataSet = XDataWebDataSet1
     Left = 532
     Top = 126
   end
   object XDataWebDataSet1: TXDataWebDataSet
-    AfterEdit = XDataWebDataSet1AfterEdit
     Connection = DMConnection.ApiConnection
     Left = 426
     Top = 132
@@ -528,12 +527,12 @@ object FViewAddCustomer: TFViewAddCustomer
     end
   end
   object wdsShipTo: TWebDataSource
+    AutoEdit = False
     DataSet = xdwdsShipTo
     Left = 698
     Top = 128
   end
   object xdwdsShipTo: TXDataWebDataSet
-    AfterEdit = xdwdsShipToAfterEdit
     Left = 698
     Top = 44
     object xdwdsShipToADDRESS: TStringField
@@ -565,6 +564,7 @@ object FViewAddCustomer: TFViewAddCustomer
     Top = 42
   end
   object wdsUsers: TWebDataSource
+    AutoEdit = False
     DataSet = xdwdsUsers
     Left = 776
     Top = 144

kgOrdersClient/AddCustomer.html

-<nav class="navbar navbar-expand navbar-light bg-light sticky-top"  style="z-index: 100;">
-    <div class="container-fluid ps-0">
-        <ul class="navbar-nav me-auto ps-2">
+
+<nav class="navbar navbar-expand navbar-light bg-light sticky-top border-light" style="z-index: 100;">
+  <div class="container-fluid d-flex align-items-center ps-0 pe-0">
+
+    <!-- Left-aligned form state label -->
+    <div class="me-auto ps-3">
+      <label id="lbl_form_state" class="form-label mb-0 fw-bold text-uppercase text-nowrap text-danger" style="font-size: 16px;">View Mode</label>
+    </div>
+
+    <!-- Right-aligned buttons -->
+    <ul class="navbar-nav ms-auto pe-2 mb-0">
       <li class="nav-item pe-2">
         <button id="btnadd" class="btn btn-primary btn-sm">Add</button>
       </li>
@@ -20,9 +28,10 @@
         <button id="btnclose" class="btn btn-primary btn-sm">Close</button>
       </li>
     </ul>
+
   </div>
 </nav>
-    <div class="row mx-5">
+<div class="row mx-5">
     <h4 class="custom-h4 mt-3">Customer Information</h4>
     <hr class="custom-hr">
     <div class="row">
@@ -120,17 +129,20 @@
     <h4 class="custom-h4 mt-3">Shipping Addresses</h4>
     <hr class="custom-hr">
     <div class="row">
+        <div class="overflow-auto mt-2"
+             style="max-height: calc(100vh - 250px); padding-bottom: 0; width: 100%;">
           <table id="tblPhoneGrid" class="table table-striped table-bordered" style="width: 100%;">
             <thead class="sticky-top thead-light">
               <tr style="font-size: 0.875rem;">
-                        <!-- Table headers are dynamically generated -->
+                <!-- headers -->
               </tr>
             </thead>
             <tbody id="orderTableBody" class="align-middle">
-                    <!-- Table rows are dynamically generated -->
+              <!-- rows -->
             </tbody>
           </table>
         </div>
+    </div>
     <div class="row mt-1">
         <div class="col-auto">
             <button id="btnshipadd" class="btn btn-primary btn-sm">Add</button>
@@ -201,29 +213,6 @@
             </div>
         </div>
      </div>
-    </div>
-
+</div>
 
 
-<div class="modal fade" id="confirmation_modal" tabindex="-1" aria-labelledby="confirmation_modal_label" aria-hidden="true">
-  <div class="modal-dialog">
-    <div class="modal-content">
-      <div class="modal-header">
-        <h5 class="modal-title" id="confirmation_modal_label">Confirm</h5>
-        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-      </div>
-      <div class="modal-body" id="modal_body">
-        Are you sure you want to delete this order?
-      </div>
-      <div class="modal-footer">
-        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal" id= 'btn_confirm_cancel'>Cancel</button>
-        <button type="button" class="btn btn-primary" data-bs-dismiss="modal" id="btn_confirm_delete">Delete</button>
-      </div>
-    </div>
-  </div>
-</div>
-<style>
-    .modal-backdrop {
-        opacity: 0 !important;
-    }
-</style>

kgOrdersClient/AddCustomer.pas

@@ -70,7 +70,6 @@ type
     btnShipDelete: TWebButton;
     btnShipEdit: TWebButton;
     btnShipAdd: TWebButton;
-    btn_confirm_delete: TWebButton;
     tmrReturn: TWebTimer;
     edtFirstLine: TWebEdit;
     wdsUsers: TWebDataSource;
@@ -79,11 +78,9 @@ type
     xdwdsUsersuserID: TStringField;
     XDataWebDataSet1REP_USER_ID: TStringField;
     xdwdsUsersfull_name: TStringField;
-    procedure WebFormShow(Sender: TObject);
+    lblFormState: TWebLabel;
     procedure btnSaveClick(Sender: TObject);
     procedure btnCancelClick(Sender: TObject);
-    procedure xdwdsShipToAfterEdit(DataSet: TDataSet);
-    procedure XDataWebDataSet1AfterEdit(DataSet: TDataSet);
     procedure btnCloseClick(Sender: TObject);
     procedure btnEditClick(Sender: TObject);
     procedure wdbtcAddressesDblClickCell(Sender: TObject; ACol, ARow: Integer);
@@ -91,13 +88,13 @@ type
     procedure AddressEditMode();
     procedure edtShippingAddressChange(Sender: TObject);
     procedure btnAddClick(Sender: TObject);
-    procedure btn_confirm_deleteClick(Sender: TObject);
     procedure tmrReturnTimer(Sender: TObject);
     procedure btnDeleteClick(Sender: TObject);
     procedure btnShipAddClick(Sender: TObject);
     procedure btnShipEditClick(Sender: TObject);
-    procedure btnShipSaveClick(Sender: TObject);
+    [async] procedure btnShipSaveClick(Sender: TObject);
     procedure btnShipDeleteClick(Sender: TObject);
+    procedure btnShipCancelClick(Sender: TObject);
   private
     { Private declarations }
     procedure ViewMode();
@@ -110,6 +107,7 @@ type
     function VerifyAddress(): boolean;
     procedure Clear();
     procedure ShowSelectCustomerForm();
+    [async] procedure InitializeForm;
   var
     customerID: string;
     notification: string;
@@ -129,6 +127,45 @@ implementation
 
 uses View.Main, View.Customers, View.SelectCustomer, Utils;
 
+
+class function TFViewAddCustomer.CreateForm(AElementID, customerInfo, info: string): TWebForm;
+begin
+  Application.CreateForm(TFViewAddCustomer, AElementID, Result,
+    procedure(AForm: TObject)
+    begin
+      with TFViewAddCustomer(AForm) do
+      begin
+        customerID := customerInfo;
+        notification := info;
+
+        InitializeForm;
+      end;
+    end
+  );
+end;
+
+
+[async] procedure TFViewAddCustomer.InitializeForm;
+begin
+  if customerID = '' then
+    mode := 'ADD'
+  else
+    mode := 'EDIT';
+
+  if notification <> '' then
+    ShowToast(notification);
+
+  if mode = 'ADD' then
+    EditMode()
+  else
+    ViewMode();
+
+  await(GetCustomer);
+
+  dtpStartDate.Date := 0;
+  dtpEndDate.Date := 0;
+end;
+
 procedure TFViewAddCustomer.Clear();
 // Clears the shipping address fields.
 begin
@@ -227,27 +264,28 @@ begin
   ShowSelectCustomerForm();
 end;
 
+
 procedure TFViewAddCustomer.btnCancelClick(Sender: TObject);
-// Shows a pop-up to confirm the user would like to cancel their changes.
 begin
-  document.getElementById('modal_body').innerHTML := 'Are you sure you want to cancel all changes to the customer?';
-  document.getElementById('btn_confirm_cancel').innerText := 'No';
-  document.getElementById('btn_confirm_delete').innerText := 'Yes';
-  asm
-    var modal = document.getElementById('confirmation_modal');
-
-    // Ensure modal is a direct child of <body> to avoid z-index/backdrop issues
-    if (modal && modal.parentNode !== document.body) {
-      document.body.appendChild(modal);
-    }
-
-    var confirmationModal = new bootstrap.Modal(modal, {
-      keyboard: false
-    });
-    confirmationModal.show();
+  ShowConfirmationModal(
+    'Are you sure you want to cancel all changes to the customer?',
+    'Yes',
+    'No',
+    procedure(confirmed: Boolean)
+    begin
+      if confirmed then
+      begin
+        FViewMain.change := false;
+        if CustomerID <> '' then
+          FViewMain.ViewAddCustomer(CustomerID, 'Failure: Changes Discarded')
+        else
+          FViewMain.ShowForm(TFViewCustomers);
       end;
+    end);
 end;
 
+
+
 procedure TFViewAddCustomer.btnClearClick(Sender: TObject);
 // Clears the shipping address fields.
 begin
@@ -265,7 +303,8 @@ procedure TFViewAddCustomer.btnDeleteClick(Sender: TObject);
 // Eventually will delete customers after a confirmation
 // TODO implement deleting customers
 begin
-  ShowErrorModal('Deleting Customers Is Not Yet Available');
+  ShowToast('Deleting Customers Is Not Yet Available', 'danger');
+  Exit;
 end;
 
 procedure TFViewAddCustomer.btnEditClick(Sender: TObject);
@@ -280,119 +319,29 @@ begin
   AddressEditMode();
 end;
 
-procedure TFViewAddCustomer.EditMode;
-// Enables Customer Fields while disabling shipping address fields.
-begin
-  FViewMain.change := true;
-  btnAdd.Enabled := false;
-  btnDelete.Enabled := false;
-  btnClose.Enabled := false;
-  btnSave.Enabled := true;
-  btnCancel.Enabled := True;
-  btnEdit.Enabled := false;
-
-  // Disable Shipping Address Editting
-  edtShippingAddress.Enabled := false;
-  edtShippingCity.Enabled := false;
-  edtShippingState.Enabled := false;
-  edtShippingZip.Enabled := false;
-  edtShippingContact.Enabled := false;
-  edtFirstLine.Enabled := false;
-
-  btnShipDelete.Enabled := false;
-  btnShipSave.Enabled := false;
-  btnShipCancel.Enabled := false;
-  btnShipEdit.Enabled := false;
-  btnShipAdd.Enabled := false;
-
-end;
-
-procedure TFViewAddCustomer.AddressEditMode;
-// Enables Shipping Address fields while disabling customer fields.
-begin
-  FViewMain.change := true;
-  btnDelete.Enabled := false;
-  btnClose.Enabled := false;
-  btnSave.Enabled := false;
-  btnCancel.Enabled := false;
-  btnEdit.Enabled := false;
-  btnAdd.Enabled := false;
-
-  btnShipDelete.Enabled := false;
-  btnShipSave.Enabled := true;
-  btnShipCancel.Enabled := true;
-  btnShipEdit.Enabled := false;
-  btnShipAdd.Enabled := false;
-
-  edtShippingAddress.Enabled := true;
-  edtShippingCity.Enabled := true;
-  edtShippingState.Enabled := true;
-  edtShippingZip.Enabled := true;
-  edtShippingContact.Enabled := true;
-  edtFirstLine.Enabled := true;
-
-  edtName.Enabled := false;
-  edtShortName.Enabled := false;
-  edtBillAddress.Enabled := false;
-  edtBillCity.Enabled := false;
-  edtBillState.Enabled := false;
-  edtBillZip.Enabled := false;
-  edtBillContact.Enabled := false;
-  dtpStartDate.Enabled := false;
-  dtpEndDate.Enabled := false;
-  edtFax.Enabled := false;
-  edtPhone.enabled := false;
-  wdblcbRep.Enabled := false;
-end;
-
-procedure TFViewAddCustomer.ViewMode;
-// Enables Customer Fields while disabling shipping address fields.
-begin
-  btnAdd.Enabled := true;
-  btnDelete.Enabled := true;
-  btnClose.Enabled := true;
-  btnSave.Enabled := false;
-  btnCancel.Enabled := false;
-  btnEdit.Enabled := true;
-  FViewMain.change := false;
-
-  btnShipAdd.Enabled := true;
-  if ( not xdwdsShipTo.IsEmpty ) then
-    btnShipDelete.Enabled := true;
-  btnShipSave.Enabled := false;
-  btnShipCancel.Enabled := false;
-  btnShipEdit.Enabled := true;
-  FViewMain.change := false;
-
-  edtName.Enabled := true;
-  edtShortName.Enabled := true;
-  edtBillAddress.Enabled := true;
-  edtBillCity.Enabled := true;
-  edtBillState.Enabled := true;
-  edtBillZip.Enabled := true;
-  edtBillContact.Enabled := true;
-  dtpStartDate.Enabled := true;
-  dtpEndDate.Enabled := true;
-  edtFax.Enabled := true;
-  edtPhone.enabled := true;
-  wdblcbRep.Enabled := true;
-
-end;
 
 procedure TFViewAddCustomer.wdbtcAddressesDblClickCell(Sender: TObject; ACol,
   ARow: Integer);
 // Retrieves the shipping address allowing it to be edited.
 begin
   xdwdsShipTo.Locate('ship_id', wdbtcAddresses.Cells[0, ARow], []);
+
   edtShippingAddress.Text := xdwdsShipTo.FieldByName('shipping_address').AsString;
   edtShippingCity.Text := xdwdsShipTo.FieldByName('city').AsString;
   edtShippingState.Text := xdwdsShipTo.FieldByName('state').AsString;
   edtShippingZip.Text := xdwdsShipTo.FieldByName('zip').AsString;
   edtShippingContact.Text := xdwdsShipTo.FieldByName('contact').AsString;
   memoShipBlock.Text := xdwdsShipTo.FieldByName('ADDRESS').AsString;
-  edtFirstLine.Text := memoShipBlock.Lines[0];
+
+  if memoShipBlock.Lines.Count > 0 then
+    edtFirstLine.Text := memoShipBlock.Lines[0]
+  else
+    edtFirstLine.Text := '';
+
+  btnShipEdit.Enabled := true;
 end;
 
+
 procedure TFViewAddCustomer.SendCustomerToServer();
 // Creates the customer JSON and then sends it to the server.
 var
@@ -489,112 +438,79 @@ begin
   AddressEditMode();
 end;
 
-procedure TFViewAddCustomer.btnShipDeleteClick(Sender: TObject);
-// Allows the user to delete a Shipping Address.
-begin
-  document.getElementById('modal_body').innerHTML := 'Are you sure you want to delete this address?';
-  document.getElementById('btn_confirm_cancel').innerText := 'Cancel';
-  document.getElementById('btn_confirm_delete').innerText := 'Delete';
-  asm
-    var confirmationModal = new bootstrap.Modal(document.getElementById('confirmation_modal'), {
-    keyboard: false });
-    confirmationModal.show();
-  end;
-end;
-
-procedure TFViewAddCustomer.btnShipEditClick(Sender: TObject);
-// Sets the form into AddressEdit mode.
-begin
-  shipmode := 'EDIT';
-  AddressEditMode();
-end;
 
-procedure TFViewAddCustomer.btnShipSaveClick(Sender: TObject);
-// After Verifying the Address it sends the address down to the server.
+procedure TFViewAddCustomer.btnShipCancelClick(Sender: TObject);
 begin
-  if VerifyAddress() then
+  ShowConfirmationModal(
+    'Are you sure you want to cancel address editing?',
+    'Yes',
+    'No',
+    procedure(confirmed: Boolean)
+    begin
+      if confirmed then
       begin
-    SendAddressToServer();
+        shipmode := '';
         Clear();
         ViewMode();
       end;
+    end);
 end;
 
-procedure TFViewAddCustomer.btn_confirm_deleteClick(Sender: TObject);
-// Modal Confirmation button. Checks if the user is cancelling changes, or
-// Deleting a shipping address/ customer
+
+procedure TFViewAddCustomer.btnShipDeleteClick(Sender: TObject);
 begin
-  FViewMain.change := false;
-  if  document.getElementById('btn_confirm_delete').innerText = 'Yes' then
-  // checks if the user is canceling or deleting
-  begin
-    if CustomerID <> '' then
-    begin
-      FViewMain.ViewAddCustomer(CustomerID, 'Failure:Changes Discarded');
-    end
-    else
-      FViewMain.ShowForm(TFViewCustomers);
-  end
-  else if document.getElementById('modal_body').innerHTML.Contains('customer') then
-  // checks if the user is deleting a customer or a shipping address
+  ShowConfirmationModal(
+    'Are you sure you want to delete this address?',
+    'Delete',
+    'Cancel',
+    procedure(confirmed: Boolean)
     begin
-    asm
-      var confirmationModal = new bootstrap.Modal(document.getElementById('confirmation_modal'), {
-      keyboard: false });
-      confirmationModal.hide();
-    end;
-    Utils.ShowSpinner('spinner');
-    //delCustomer();
-    tmrReturn.Enabled := true;
-  end
-  else
+      if confirmed then
       begin
-    asm
-      var confirmationModal = new bootstrap.Modal(document.getElementById('confirmation_modal'), {
-      keyboard: false });
-      confirmationModal.hide();
-    end;
         Utils.ShowSpinner('spinner');
-    delAddress();
+        DelAddress();
       end;
+    end);
 end;
 
-class function TFViewAddCustomer.CreateForm(AElementID: string; customerInfo: string; info: string): TWebForm;
-// Creates the Add Customer form. Setting the customer id so the customer can be
-// Retrieved and the notification to be shown.
+
+
+procedure TFViewAddCustomer.btnShipEditClick(Sender: TObject);
+// Sets the form into AddressEdit mode.
 begin
-  Application.CreateForm(TFViewAddCustomer, AElementID, Result,
-    procedure(AForm: TObject)
-    begin
-      with TFViewAddCustomer(AForm) do
+  shipmode := 'EDIT';
+  AddressEditMode();
+end;
+
+[async] procedure TFViewAddCustomer.btnShipSaveClick(Sender: TObject);
+begin
+  if (customerID = '') then
   begin
-        TFViewAddCustomer(AForm).customerID := customerInfo;
-        TFViewAddCustomer(AForm).notification := info;
+    ShowErrorModal('Cannot save address: Customer ID is not set.');
+    Exit;
   end;
-    end
-  );
+  console.log('Saving address. CustomerID = ' + customerID);
 
+  if VerifyAddress() then
+  begin
+    await(SendAddressToServer);
+    Clear();
+    await(GetCustomer); // Ensures xdwdsShipTo is refreshed with server data
+    ViewMode();
+  end;
 end;
 
+
 procedure TFViewAddCustomer.GetCustomer;
 // Retrieves a customer for a given CustomerID.
 var
   xdcResponse: TXDataClientResponse;
   customer : TJSObject;
-  address: string;
   items: TJSObject;
   ship_block: TStringList;
 begin
-  if CustomerID = '' then
-  begin
-    mode := 'ADD';
-  end
-  else
-    mode := 'EDIT';
-  xdcResponse := await(XDataWebClient1.RawInvokeAsync('ILookupService.GetCustomer',
-        [customerID]));
+  xdcResponse := await(XDataWebClient1.RawInvokeAsync('ILookupService.GetCustomer', [customerID]));
   customer :=  TJSObject(xdcResponse.Result);
-  console.log(customer);
 
   xdwdsUsers.Close;
   xdwdsUsers.SetJSONData(customer['USERS']);
@@ -629,46 +545,8 @@ begin
     edtFirstLine.Text := memoShipBlock.Lines[0]
   else
     edtFirstLine.Text := '';
-
 end;
 
-procedure TFViewAddCustomer.WebFormShow(Sender: TObject);
-// Sets the form up whenever it is shown.
-var
-  SQL: string;
-begin
-  if customerID = '' then
-    mode := 'ADD'
-  else
-    mode := 'EDIT';
-
-  if notification <> '' then
-  begin
-    showToast(notification);
-  end;
-
-  if mode = 'ADD' then
-    EditMode()
-  else
-    ViewMode();
-
-  getCustomer();
-
-  dtpStartDate.Date := 0;
-  dtpEndDate.Date := 0;
-end;
-
-procedure TFViewAddCustomer.XDataWebDataSet1AfterEdit(DataSet: TDataSet);
-begin
-  EditMode();
-end;
-
-procedure TFViewAddCustomer.xdwdsShipToAfterEdit(DataSet: TDataSet);
-begin
-  EditMode();
-end;
-
-
 procedure TFViewAddCustomer.tmrReturnTimer(Sender: TObject);
 // Timer to returnto the customer page  because it takes slightly too long to
 // Delete customers causing ghost customers to show up.
@@ -814,4 +692,124 @@ begin
 
 end;
 
+procedure TFViewAddCustomer.EditMode;
+// Enables Customer Fields while disabling shipping address fields.
+begin
+  XDataWebDataSet1.Edit;
+  FViewMain.change := true;
+  btnAdd.Enabled := false;
+  btnDelete.Enabled := false;
+  btnClose.Enabled := false;
+  btnSave.Enabled := true;
+  btnCancel.Enabled := True;
+  btnEdit.Enabled := false;
+
+  // Disable Shipping Address Editting
+  edtShippingAddress.Enabled := false;
+  edtShippingCity.Enabled := false;
+  edtShippingState.Enabled := false;
+  edtShippingZip.Enabled := false;
+  edtShippingContact.Enabled := false;
+  edtFirstLine.Enabled := false;
+
+  btnShipDelete.Enabled := false;
+  btnShipSave.Enabled := false;
+  btnShipCancel.Enabled := false;
+  btnShipEdit.Enabled := false;
+  btnShipAdd.Enabled := false;
+
+  lblFormState.Caption := 'Edit Mode';
+  lblFormState.ElementHandle.classList.remove('text-danger');
+  lblFormState.ElementHandle.classList.add('text-success');
+end;
+
+procedure TFViewAddCustomer.AddressEditMode;
+// Enables Shipping Address fields while disabling customer fields.
+begin
+  xdwdsShipTo.Edit;
+  FViewMain.change := true;
+  btnDelete.Enabled := false;
+  btnClose.Enabled := false;
+  btnSave.Enabled := false;
+  btnCancel.Enabled := false;
+  btnEdit.Enabled := false;
+  btnAdd.Enabled := false;
+
+  btnShipDelete.Enabled := false;
+  btnShipSave.Enabled := true;
+  btnShipCancel.Enabled := true;
+  btnShipEdit.Enabled := false;
+  btnShipAdd.Enabled := false;
+
+  edtShippingAddress.Enabled := true;
+  edtShippingCity.Enabled := true;
+  edtShippingState.Enabled := true;
+  edtShippingZip.Enabled := true;
+  edtShippingContact.Enabled := true;
+  edtFirstLine.Enabled := true;
+
+  edtName.Enabled := false;
+  edtShortName.Enabled := false;
+  edtBillAddress.Enabled := false;
+  edtBillCity.Enabled := false;
+  edtBillState.Enabled := false;
+  edtBillZip.Enabled := false;
+  edtBillContact.Enabled := false;
+  dtpStartDate.Enabled := false;
+  dtpEndDate.Enabled := false;
+  edtFax.Enabled := false;
+  edtPhone.enabled := false;
+  wdblcbRep.Enabled := false;
+
+  lblFormState.Caption := 'Edit Address';
+  lblFormState.ElementHandle.classList.remove('text-danger');
+  lblFormState.ElementHandle.classList.add('text-success');
+end;
+
+
+procedure TFViewAddCustomer.ViewMode;
+// Enables Customer Fields while disabling shipping address fields.
+begin
+  btnAdd.Enabled := true;
+  btnDelete.Enabled := true;
+  btnClose.Enabled := true;
+  btnSave.Enabled := false;
+  btnCancel.Enabled := false;
+  btnEdit.Enabled := true;
+  FViewMain.change := false;
+
+  btnShipAdd.Enabled := true;
+
+  if not xdwdsShipTo.IsEmpty then
+  begin
+    btnShipDelete.Enabled := true;
+    btnShipEdit.Enabled := true;
+  end
+  else
+  begin
+    btnShipDelete.Enabled := false;
+    btnShipEdit.Enabled := false;
+  end;
+
+  btnShipSave.Enabled := false;
+  btnShipCancel.Enabled := false;
+
+  edtName.Enabled := true;
+  edtShortName.Enabled := true;
+  edtBillAddress.Enabled := true;
+  edtBillCity.Enabled := true;
+  edtBillState.Enabled := true;
+  edtBillZip.Enabled := true;
+  edtBillContact.Enabled := true;
+  dtpStartDate.Enabled := true;
+  dtpEndDate.Enabled := true;
+  edtFax.Enabled := true;
+  edtPhone.Enabled := true;
+  wdblcbRep.Enabled := true;
+
+  lblFormState.Caption := 'View Mode';
+  lblFormState.ElementHandle.classList.remove('text-success');
+  lblFormState.ElementHandle.classList.add('text-danger');
+end;
+
 end.
\ No newline at end of file

kgOrdersClient/Utils.pas

@@ -3,7 +3,7 @@ unit Utils;
 interface
 
 uses
-  System.Classes, SysUtils, JS, Web, WEBLib.Forms, WEBLib.Toast, DateUtils;
+  System.Classes, SysUtils, JS, Web, WEBLib.Forms, WEBLib.Toast, DateUtils, WebLib.Dialogs;
 
 procedure ShowStatusMessage(const AMessage, AClass: string; const AElementId: string);
 procedure HideStatusMessage(const AElementId: string);
@@ -14,6 +14,7 @@ function CalculateAge(DateOfBirth: TDateTime): Integer;
 function FormatPhoneNumber(PhoneNumber: string): string;
 procedure ApplyReportTitle(CurrentReportType: string);
 procedure ShowToast(const MessageText: string; const ToastType: string = 'success');
+procedure ShowConfirmationModal(msg, leftLabel, rightLabel: string; ConfirmProc: TProc<Boolean>);
 // function FormatDollarValue(ValueStr: string): string;
 
 
@@ -67,6 +68,13 @@ begin
   SpinnerElement := TJSHTMLElement(document.getElementById(SpinnerID));
   if Assigned(SpinnerElement) then
   begin
+    // Move spinner to the <body> if it's not already there
+    asm
+      if (SpinnerElement.parentNode !== document.body) {
+        document.body.appendChild(SpinnerElement);
+      }
+    end;
+
     SpinnerElement.classList.remove('d-none');
     SpinnerElement.classList.add('d-block');
   end;
@@ -84,7 +92,7 @@ begin
   end;
 end;
 
-// The $IFNDEF WIN32 was recommended by Holger to deal with any modal issues
+
 procedure ShowErrorModal(msg: string);
 begin
   asm
@@ -113,6 +121,58 @@ begin
 end;
 
 
+// ShowConfirmationModal displays a two-button modal with custom labels.
+// Params:
+// - messageText: text shown in the modal body
+// - leftButtonText: label for the left button (e.g., "Cancel")
+// - rightButtonText: label for the right button (e.g., "Delete")
+// - callback: procedure(confirmed: Boolean); confirmed = True if right button clicked
+//
+// Example:
+// ShowConfirmationModal('Delete this?', 'Cancel', 'Delete',
+//   procedure(confirmed: Boolean)
+//   begin
+//     if confirmed then DeleteOrder();
+//   end);
+
+procedure ShowConfirmationModal(msg, leftLabel, rightLabel: string; ConfirmProc: TProc<Boolean>);
+var
+  modal, body, btnLeft, btnRight: TJSHTMLElement;
+  bsModal: JSValue;
+begin
+  asm
+    modal = document.getElementById('main_confirmation_modal');
+    body = document.getElementById('main_modal_body');
+    btnLeft = document.getElementById('btn_confirm_left');
+    btnRight = document.getElementById('btn_confirm_right');
+
+    if (body) body.innerText = msg;
+    if (btnLeft) btnLeft.innerText = leftLabel;
+    if (btnRight) btnRight.innerText = rightLabel;
+
+    if (modal && modal.parentNode !== document.body) {
+      document.body.appendChild(modal);
+    }
+
+    btnLeft.onclick = null;
+    btnRight.onclick = null;
+
+    btnLeft.onclick = function () {
+      bsModal.hide();
+      ConfirmProc(true); // user confirmed
+    };
+
+    btnRight.onclick = function () {
+      bsModal.hide();
+      ConfirmProc(false); // user canceled
+    };
+
+    bsModal = new bootstrap.Modal(modal, { keyboard: false });
+    bsModal.show();
+  end;
+end;
+
+
 function CalculateAge(DateOfBirth: TDateTime): Integer;
 var
   Today, BirthDate: TJSDate;

kgOrdersClient/View.Customers.dfm

 object FViewCustomers: TFViewCustomers
   Width = 640
   Height = 480
+  CSSLibrary = cssBootstrap
+  ElementFont = efCSS
   OnCreate = WebFormCreate
   object lblEntries: TWebLabel
     Left = 12

kgOrdersClient/View.Main.dfm

@@ -157,6 +157,12 @@ object FViewMain: TFViewMain
     ChildOrder = 3
     ElementFont = efCSS
     ElementPosition = epIgnore
+    Font.Charset = ANSI_CHARSET
+    Font.Color = clBlack
+    Font.Height = -11
+    Font.Name = 'Arial'
+    Font.Style = []
+    ParentFont = False
     Role = 'null'
     TabOrder = 0
   end
@@ -167,12 +173,14 @@ object FViewMain: TFViewMain
     Height = 83
     ElementID = 'main.debugmemo'
     ElementPosition = epRelative
+    Enabled = False
     HeightPercent = 100.000000000000000000
     Lines.Strings = (
       'WebMemo1')
     Role = 'null'
     SelLength = 0
     SelStart = 0
+    ShowFocus = False
     Visible = False
     WidthPercent = 100.000000000000000000
   end

kgOrdersClient/View.Main.html

@@ -95,25 +95,25 @@
         Please contact EMSystems to solve the issue.
       </div>
       <div class="modal-footer justify-content-center">
-        <button type="button" id="btn_modal_restart" class="btn btn-primary">Restart WebApp</button>
+        <button type="button" id="btn_modal_restart" class="btn btn-primary">Back to Orders</button>
       </div>
     </div>
   </div>
 </div>
 
-<div class="modal fade" id="confirmation_modal" tabindex="-1" aria-labelledby="confirmation_modal_label" aria-hidden="true">
+<div class="modal fade" id="main_confirmation_modal" tabindex="-1" aria-hidden="true">
   <div class="modal-dialog">
     <div class="modal-content shadow-lg">
       <div class="modal-header">
-        <h5 class="modal-title" id="confirmation_modal_label">Confirm</h5>
+        <h5 class="modal-title">Confirm</h5>
         <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
       </div>
-      <div class="modal-body fs-6 fw-bold" id="modal_body">
-        Are you sure you want to delete this order?
+      <div class="modal-body fw-bold" id="main_modal_body">
+        Placeholder text
       </div>
       <div class="modal-footer justify-content-center">
-        <button type="button" class="btn btn-secondary me-3" data-bs-dismiss="modal" id="btn_confirm_cancel">Cancel</button>
-        <button type="button" class="btn btn-primary" data-bs-dismiss="modal" id="btn_confirm_delete">Delete</button>
+        <button type="button" class="btn btn-primary me-3" id="btn_confirm_left">Cancel</button>
+        <button type="button" class="btn btn-secondary" id="btn_confirm_right">Confirm</button>
       </div>
     </div>
   </div>
@@ -127,3 +127,4 @@
 
 
 
+

kgOrdersClient/View.Main.pas

@@ -47,7 +47,6 @@ type
     function GetUserInfo: string;
     procedure setActive(page: string);
     procedure ConfirmLogout;
-    procedure OnConfirmLogout(Event: TJSEvent);
   public
     { Public declarations }
     class procedure Display(LogoutProc: TLogoutProc);
@@ -118,7 +117,7 @@ begin
     setActive('Customers');
   end
   else
-    ShowErrorModal('Please Save or Cancel your changes');
+    ShowToast('Please Save or Cancel your changes', 'danger');
 end;
 
 procedure TFViewMain.lblHomeClick(Sender: TObject);
@@ -130,12 +129,11 @@ begin
     //setActive('Home');
   end
   else
-    ShowErrorModal('Please Save or Cancel your changes');
+    ShowToast('Please Save or Cancel your changes', 'danger');
 end;
 
 procedure TFViewMain.lblordersClick(Sender: TObject);
 begin
-  console.log(change);
   if ( not ( change ) ) then
   begin
     ShowForm(TFViewOrders);
@@ -143,7 +141,7 @@ begin
     setActive('Orders');
   end
   else
-    ShowErrorModal('Please Save or Cancel your changes');
+    ShowToast('Please Save or Cancel your changes', 'danger');
 end;
 
 procedure TFViewMain.lblQuickbooksClick(Sender: TObject);
@@ -155,7 +153,7 @@ begin
     setActive('QuickBooks');
   end
   else
-    ShowErrorModal('Please Save or Cancel your changes');
+    ShowToast('Please Save or Cancel your changes', 'danger');
 end;
 
 procedure TFViewMain.lblUsersClick(Sender: TObject);
@@ -166,7 +164,7 @@ begin
     lblAppTitle.Caption := 'Koehler-Gibson Users';
   end
   else
-    ShowErrorModal('Please Save or Cancel your changes');
+    ShowToast('Please Save or Cancel your changes', 'danger');
 end;
 
 procedure TFViewMain.lblItemsListClick(Sender: TObject);
@@ -178,7 +176,7 @@ begin
     setActive('Items');
   end
   else
-    ShowErrorModal('Please Save or Cancel your changes');
+    ShowToast('Please Save or Cancel your changes', 'danger');
 end;
 
 procedure TFViewMain.setActive(page: string);
@@ -210,47 +208,22 @@ begin
   ConfirmLogout;
 end;
 
+
 procedure TFViewMain.ConfirmLogout;
-var
-  yesBtn: TJSElement;
 begin
-  document.getElementById('modal_body').innerHTML := 'Are you sure you want to log out?';
-  document.getElementById('btn_confirm_cancel').innerText := 'No';
-  document.getElementById('btn_confirm_delete').innerText := 'Yes';
-
-  asm
-    var modal = document.getElementById('confirmation_modal');
-    if (modal && modal.parentNode !== document.body) {
-      document.body.appendChild(modal);
-    }
-  end;
-
-  // Detach any existing click handler (optional cleanup if reused often)
-  yesBtn := document.getElementById('btn_confirm_delete');
-  if Assigned(yesBtn) then
+  ShowConfirmationModal(
+    'Are you sure you want to log out?',
+    'Yes',
+    'No',
+    procedure(confirmed: Boolean)
     begin
-    TJSElement(yesBtn).removeEventListener('click', @OnConfirmLogout);
-    TJSElement(yesBtn).addEventListener('click', @OnConfirmLogout);
-  end;
-
-  asm
-    var confirmationModal = new bootstrap.Modal(document.getElementById('confirmation_modal'), {
-      keyboard: false
-    });
-    confirmationModal.show();
-  end;
-end;
-
-
-procedure TFViewMain.OnConfirmLogout(Event: TJSEvent);
-begin
-  if Assigned(FLogoutProc) then
+      if confirmed and Assigned(FLogoutProc) then
         FLogoutProc('');
+    end
+  );
 end;
 
 
-
-
 procedure TFViewMain.wllblUserProfileClick(Sender: TObject);
 begin
     ShowCrudForm(TFViewUserProfile);

kgOrdersClient/View.OrderEntryCorrugated.dfm

@@ -8,7 +8,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
   Font.Style = []
   ParentFont = False
   OnCreate = WebFormCreate
-  OnShow = WebFormShow
   object WebLabel1: TWebLabel
     Left = 34
     Top = 188
@@ -99,6 +98,15 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     Visible = False
     WidthPercent = 100.000000000000000000
   end
+  object lblFormState: TWebLabel
+    Left = 18
+    Top = 16
+    Width = 3
+    Height = 14
+    ElementID = 'lbl_form_state'
+    HeightPercent = 100.000000000000000000
+    WidthPercent = 100.000000000000000000
+  end
   object dtpOrderDate: TWebDateTimePicker
     Left = 22
     Top = 218
@@ -112,7 +120,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ElementPosition = epRelative
     Role = 'null'
     Text = ''
-    OnChange = dtpOrderDateChange
   end
   object dtpProofDate: TWebDateTimePicker
     Left = 22
@@ -127,7 +134,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ElementPosition = epRelative
     Role = 'null'
     Text = ''
-    OnChange = dtpProofDateChange
   end
   object dtpShipDate: TWebDateTimePicker
     Left = 22
@@ -142,7 +148,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ElementPosition = epRelative
     Role = 'null'
     Text = ''
-    OnChange = dtpShipDateChange
   end
   object dtpArtDue: TWebDateTimePicker
     Left = 24
@@ -157,7 +162,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ElementPosition = epRelative
     Role = 'null'
     Text = ''
-    OnChange = dtpMountDueChange
   end
   object dtpPlateDue: TWebDateTimePicker
     Left = 24
@@ -172,7 +176,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ElementPosition = epRelative
     Role = 'null'
     Text = ''
-    OnChange = dtpPlateDueChange
   end
   object dtpMountDue: TWebDateTimePicker
     Left = 24
@@ -187,7 +190,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ElementPosition = epRelative
     Role = 'null'
     Text = ''
-    OnChange = dtpMountDueChange
   end
   object btnAddColor: TWebButton
     Left = 658
@@ -200,6 +202,7 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ElementPosition = epRelative
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    TabStop = False
     WidthPercent = 100.000000000000000000
     OnClick = btnAddColorClick
   end
@@ -215,8 +218,9 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     Date = 45748.499176770830000000
     ElementPosition = epRelative
     Role = 'null'
+    ShowFocus = False
+    TabStop = False
     Text = ''
-    OnChange = dtpApprovedDateChange
   end
   object edtCompanyName: TWebDBEdit
     Left = 18
@@ -232,7 +236,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     MaxLength = 90
     WidthStyle = ssAuto
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'NAME'
     DataSource = WebDataSource1
   end
@@ -248,7 +251,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpApprovedDateChange
     DataField = 'SHORT_NAME'
     DataSource = WebDataSource1
   end
@@ -264,7 +266,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'inQuickBooks'
     DataSource = WebDataSource1
   end
@@ -280,12 +281,11 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'staff_fields_ship_via'
     DataSource = WebDataSource1
   end
   object edtQuantity: TWebDBEdit
-    Left = 24
+    Left = 26
     Top = 346
     Width = 121
     Height = 22
@@ -296,7 +296,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpApprovedDateChange
     DataField = 'staff_fields_quantity'
     DataSource = WebDataSource1
   end
@@ -311,7 +310,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpApprovedDateChange
     DataField = 'staff_fields_price'
     DataSource = WebDataSource1
   end
@@ -327,7 +325,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpApprovedDateChange
     DataField = 'staff_fields_invoice_to'
     DataSource = WebDataSource1
   end
@@ -343,7 +340,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpApprovedDateChange
     DataField = 'staff_fields_po_number'
     DataSource = WebDataSource1
   end
@@ -359,7 +355,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = edtJobNameChange
     DataField = 'staff_fields_job_name'
     DataSource = WebDataSource1
   end
@@ -375,7 +370,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpPlateDueChange
     DataField = 'supplied_by_customer_other'
     DataSource = WebDataSource1
   end
@@ -391,7 +385,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpPlateDueChange
     DataField = 'layout_cad_file'
     DataSource = WebDataSource1
   end
@@ -407,7 +400,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpPlateDueChange
     DataField = 'layout_around_no'
     DataSource = WebDataSource1
   end
@@ -423,7 +415,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpMountDueChange
     DataField = 'layout_accross_no'
     DataSource = WebDataSource1
   end
@@ -439,7 +430,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpMountDueChange
     DataField = 'layout_die_cut_no'
     DataSource = WebDataSource1
   end
@@ -455,7 +445,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpMountDueChange
     DataField = 'layout_rcs_d'
     DataSource = WebDataSource1
   end
@@ -471,7 +460,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'layout_rcs_w'
     DataSource = WebDataSource1
   end
@@ -487,7 +475,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'layout_rsc_l'
     DataSource = WebDataSource1
   end
@@ -502,8 +489,8 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ElementPosition = epRelative
     HeightPercent = 100.000000000000000000
     HideSelection = False
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpProofDateChange
     DataField = 'mounting_custom_adhesive'
     DataSource = WebDataSource1
   end
@@ -519,7 +506,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpProofDateChange
     DataField = 'mounting_custom_backing'
     DataSource = WebDataSource1
   end
@@ -535,7 +521,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpPlateDueChange
     DataField = 'mounting_standard_setup'
     DataSource = WebDataSource1
   end
@@ -551,7 +536,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpProofDateChange
     DataField = 'mounting_strip_mount'
     DataSource = WebDataSource1
   end
@@ -567,7 +551,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpProofDateChange
     DataField = 'mounting_loose'
     DataSource = WebDataSource1
   end
@@ -583,23 +566,23 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     HideSelection = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpShipDateChange
     DataField = 'layout_rsc_style'
     DataSource = WebDataSource1
   end
   object edtProofOther: TWebDBEdit
-    Left = 666
+    Left = 658
     Top = 458
     Width = 121
     Height = 22
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtproofother'
     ElementPosition = epRelative
     HeightPercent = 100.000000000000000000
     HideSelection = False
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpApprovedDateChange
     DataField = 'proofing_other'
     DataSource = WebDataSource1
   end
@@ -608,14 +591,15 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     Top = 328
     Width = 121
     Height = 22
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtproofshipto'
     ElementPosition = epRelative
     HeightPercent = 100.000000000000000000
     HideSelection = False
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpApprovedDateChange
     DataField = 'proofing_ship_to'
     DataSource = WebDataSource1
   end
@@ -624,14 +608,15 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     Top = 300
     Width = 121
     Height = 22
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtemailattn'
     ElementPosition = epRelative
     HeightPercent = 100.000000000000000000
     HideSelection = False
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpApprovedDateChange
     DataField = 'proofing_e_mail_attn'
     DataSource = WebDataSource1
   end
@@ -640,14 +625,15 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     Top = 272
     Width = 121
     Height = 22
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtproofemail'
     ElementPosition = epRelative
     HeightPercent = 100.000000000000000000
     HideSelection = False
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpApprovedDateChange
     DataField = 'proofing_e_mail'
     DataSource = WebDataSource1
   end
@@ -656,14 +642,15 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     Top = 244
     Width = 121
     Height = 22
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtfaxattn'
     ElementPosition = epRelative
     HeightPercent = 100.000000000000000000
     HideSelection = False
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpApprovedDateChange
     DataField = 'proofing_fax_attn'
     DataSource = WebDataSource1
   end
@@ -672,14 +659,15 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     Top = 219
     Width = 121
     Height = 22
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtfax'
     ElementPosition = epRelative
     HeightPercent = 100.000000000000000000
     HideSelection = False
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpApprovedDateChange
     DataField = 'proofing_fax'
     DataSource = WebDataSource1
   end
@@ -694,8 +682,8 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ElementPosition = epRelative
     HeightPercent = 100.000000000000000000
     HideSelection = False
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpApprovedDateChange
     DataField = 'colors_clemson'
     DataSource = WebDataSource1
   end
@@ -710,8 +698,8 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ElementPosition = epRelative
     HeightPercent = 100.000000000000000000
     HideSelection = False
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpApprovedDateChange
     DataField = 'colors_cross_hairs'
     DataSource = WebDataSource1
   end
@@ -726,8 +714,8 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ElementPosition = epRelative
     HeightPercent = 100.000000000000000000
     HideSelection = False
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpApprovedDateChange
     DataField = 'colors_machine_ident'
     DataSource = WebDataSource1
   end
@@ -742,8 +730,8 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ElementPosition = epRelative
     HeightPercent = 100.000000000000000000
     HideSelection = False
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpProofDateChange
     DataField = 'colors_cylinder_size'
     DataSource = WebDataSource1
   end
@@ -752,14 +740,15 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     Top = 105
     Width = 121
     Height = 22
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtjobnumber'
     ElementPosition = epRelative
     HeightPercent = 100.000000000000000000
     HideSelection = False
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpApprovedDateChange
     DataField = 'plates_job_number'
     DataSource = WebDataSource1
   end
@@ -768,14 +757,16 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     Top = 480
     Width = 113
     Height = 22
+    TabStop = False
     Caption = 'Art Approved As Is'
     ChildOrder = 79
     ElementID = 'cbartapprovedasis'
     ElementPosition = epRelative
+    Enabled = False
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnClick = dtpProofDateChange
     DataField = 'proofing_art_approved_as_is'
     DataSource = WebDataSource1
     ValueChecked = 'True'
@@ -786,14 +777,16 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     Top = 430
     Width = 113
     Height = 22
+    TabStop = False
     Caption = 'PDF File'
     ChildOrder = 79
     ElementID = 'cbpdffile'
     ElementPosition = epRelative
+    Enabled = False
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnClick = dtpProofDateChange
     DataField = 'proofing_pdf_file'
     DataSource = WebDataSource1
     ValueChecked = 'True'
@@ -804,14 +797,16 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     Top = 406
     Width = 113
     Height = 22
+    TabStop = False
     Caption = 'Wide Format'
     ChildOrder = 79
     ElementID = 'cbwideformat'
     ElementPosition = epRelative
+    Enabled = False
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnClick = dtpOrderDateChange
     DataField = 'proofing_wide_format'
     DataSource = WebDataSource1
     ValueChecked = 'True'
@@ -822,14 +817,16 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     Top = 382
     Width = 113
     Height = 22
+    TabStop = False
     Caption = 'Print Card'
     ChildOrder = 79
     ElementID = 'cbprintcard'
     ElementPosition = epRelative
+    Enabled = False
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnClick = dtpPlateDueChange
     DataField = 'proofing_print_card'
     DataSource = WebDataSource1
     ValueChecked = 'True'
@@ -840,14 +837,16 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     Top = 356
     Width = 113
     Height = 22
+    TabStop = False
     Caption = 'Full Size Panel'
     ChildOrder = 79
     ElementID = 'cbfullsizepanel'
     ElementPosition = epRelative
+    Enabled = False
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnClick = dtpPlateDueChange
     DataField = 'proofing_full_size_panel'
     DataSource = WebDataSource1
     ValueChecked = 'True'
@@ -858,14 +857,15 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     Top = 185
     Width = 121
     Height = 22
+    TabStop = False
     AutoSize = True
     ChildOrder = 78
     ElementID = 'edtspecialinstructions'
     ElementPosition = epRelative
     HeightPercent = 100.000000000000000000
     HideSelection = False
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpApprovedDateChange
     DataField = 'general_special_instructions'
     DataSource = WebDataSource1
   end
@@ -892,10 +892,11 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ChildOrder = 76
     ElementID = 'edtrefartapdf'
     ElementPosition = epRelative
+    Enabled = False
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnClick = dtpShipDateChange
   end
   object cbRefArtPrintCard: TWebCheckBox
     Left = 316
@@ -906,10 +907,11 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ChildOrder = 76
     ElementID = 'edtrefartprintcard'
     ElementPosition = epRelative
+    Enabled = False
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnClick = dtpShipDateChange
   end
   object cbExistingCuttingDie: TWebCheckBox
     Left = 316
@@ -920,10 +922,11 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ChildOrder = 76
     ElementID = 'edtexistingcuttingdie'
     ElementPosition = epRelative
+    Enabled = False
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnClick = dtpApprovedDateChange
   end
   object cbFTP: TWebCheckBox
     Left = 320
@@ -934,10 +937,11 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ChildOrder = 76
     ElementID = 'cbftp'
     ElementPosition = epRelative
+    Enabled = False
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnClick = dtpApprovedDateChange
   end
   object cbSampleCarton: TWebCheckBox
     Left = 316
@@ -948,10 +952,11 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ChildOrder = 76
     ElementID = 'cbsampleCarton'
     ElementPosition = epRelative
+    Enabled = False
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnClick = dtpApprovedDateChange
   end
   object cbPlates: TWebCheckBox
     Left = 316
@@ -962,10 +967,11 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ChildOrder = 76
     ElementID = 'cbplates'
     ElementPosition = epRelative
+    Enabled = False
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnClick = dtpApprovedDateChange
   end
   object cbColorCopy: TWebCheckBox
     Left = 316
@@ -976,10 +982,11 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ChildOrder = 76
     ElementID = 'cbcolorcopy'
     ElementPosition = epRelative
+    Enabled = False
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnClick = dtpApprovedDateChange
   end
   object cbStripMount: TWebCheckBox
     Left = 496
@@ -990,10 +997,11 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ChildOrder = 76
     ElementID = 'cbstripmount'
     ElementPosition = epRelative
+    Enabled = False
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnClick = dtpProofDateChange
   end
   object cbFullMount: TWebCheckBox
     Left = 496
@@ -1004,10 +1012,11 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ChildOrder = 76
     ElementID = 'cbfullmount'
     ElementPosition = epRelative
+    Enabled = False
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnClick = dtpApprovedDateChange
   end
   object cbStickyBak: TWebCheckBox
     Left = 496
@@ -1018,10 +1027,11 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ChildOrder = 76
     ElementID = 'cbstickybak'
     ElementPosition = epRelative
+    Enabled = False
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnClick = dtpApprovedDateChange
   end
   object cbLoose: TWebCheckBox
     Left = 496
@@ -1032,10 +1042,11 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ChildOrder = 76
     ElementID = 'cbloose'
     ElementPosition = epRelative
+    Enabled = False
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnClick = dtpApprovedDateChange
   end
   object cbExcaliburDie: TWebCheckBox
     Left = 496
@@ -1046,10 +1057,11 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ChildOrder = 76
     ElementID = 'cbexcaliburdie'
     ElementPosition = epRelative
+    Enabled = False
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnClick = dtpShipDateChange
   end
   object WebDBComboBox1: TWebDBComboBox
     Left = 26
@@ -1076,10 +1088,11 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ChildOrder = 75
     ElementID = 'edtemail'
     ElementPosition = epRelative
+    Enabled = False
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnClick = dtpApprovedDateChange
   end
   object btnCancel: TWebButton
     Left = 764
@@ -1120,8 +1133,9 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ElementPosition = epRelative
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    ShowFocus = False
+    TabStop = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpApprovedDateChange
     ItemIndex = -1
     Items.Strings = (
       'PhotoPolymer'
@@ -1131,15 +1145,16 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
   end
   object WebDBComboBox4: TWebDBComboBox
     Left = 833
-    Top = 48
+    Top = 49
     Width = 145
     Height = 22
     ElementID = 'wcbthickness'
     ElementPosition = epRelative
     HeightPercent = 100.000000000000000000
     Role = 'null'
+    ShowFocus = False
+    TabStop = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpApprovedDateChange
     ItemIndex = -1
     Items.Strings = (
       '.250'
@@ -1211,18 +1226,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     HeightPercent = 100.000000000000000000
     WidthPercent = 100.000000000000000000
   end
-  object btn_modal_confirm: TWebButton
-    Left = 1094
-    Top = 414
-    Width = 96
-    Height = 25
-    Caption = 'Delete'
-    ChildOrder = 82
-    ElementID = 'btn_confirm_delete'
-    HeightPercent = 100.000000000000000000
-    WidthPercent = 100.000000000000000000
-    OnClick = btn_modal_confirmClick
-  end
   object btnEdit: TWebButton
     Left = 1202
     Top = 560
@@ -1256,6 +1259,7 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     ChildOrder = 85
     ElementID = 'btnaddaddress'
     HeightPercent = 100.000000000000000000
+    TabStop = False
     WidthPercent = 100.000000000000000000
     OnClick = WebButton2Click
   end
@@ -1264,12 +1268,6 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     Left = 1014
     Top = 44
   end
-  object tmrScrollTop: TWebTimer
-    Interval = 100
-    OnTimer = tmrScrollTopTimer
-    Left = 1176
-    Top = 256
-  end
   object XDataWebDataSet1: TXDataWebDataSet
     BeforePost = XDataWebDataSet1BeforePost
     Connection = DMConnection.ApiConnection
@@ -1563,17 +1561,18 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     end
   end
   object WebDataSource1: TWebDataSource
+    AutoEdit = False
     DataSet = XDataWebDataSet1
     Left = 1176
     Top = 182
   end
   object wdsShipTo: TWebDataSource
+    AutoEdit = False
     DataSet = xdwdsShipTo
     Left = 1090
     Top = 124
   end
   object xdwdsShipTo: TXDataWebDataSet
-    AfterEdit = xdwdsShipToAfterEdit
     Left = 1096
     Top = 40
     object xdwdsShipToADDRESS: TStringField
@@ -1581,12 +1580,12 @@ object FOrderEntryCorrugated: TFOrderEntryCorrugated
     end
   end
   object wdsQBItem: TWebDataSource
+    AutoEdit = False
     DataSet = xdwdsQBItem
     Left = 1172
     Top = 128
   end
   object xdwdsQBItem: TXDataWebDataSet
-    AfterEdit = xdwdsQBItemAfterEdit
     Left = 1174
     Top = 38
     object xdwdsQBItemname: TStringField

kgOrdersClient/View.OrderEntryCorrugated.html

-
 <nav class="navbar navbar-expand navbar-light bg-light border-light sticky-top" style="z-index: 100;">
-    <div class="container-fluid ps-0">
-        <ul class="navbar-nav me-auto ps-2">
+  <div class="container-fluid d-flex align-items-center ps-0 pe-0">
+
+    <!-- Left-aligned label -->
+    <div class="me-auto ps-3">
+      <label id="lbl_form_state" class="form-label mb-0 fw-bold text-uppercase text-nowrap text-danger" style="font-size: 16px;">Test</label>
+    </div>
+
+    <!-- Right-aligned buttons -->
+    <ul class="navbar-nav ms-auto pe-2 mb-0">
       <li class="nav-item pe-2">
         <button id="btnadd" class="btn btn-primary btn-sm">Add</button>
       </li>
@@ -27,6 +33,7 @@
         <button id="btnclose" class="btn btn-primary btn-sm">Close</button>
       </li>
     </ul>
+
   </div>
 </nav>
     <div class="row mx-5">
@@ -357,23 +364,4 @@
                 <textarea id="edtspecialinstructions" class="form-control" style=" width: 500px; height: 150px;"></textarea>
             </div>
         </div>
-
-    </div>
-
-<div class="modal fade" id="confirmation_modal" tabindex="-1" aria-labelledby="confirmation_modal_label" aria-hidden="true">
-  <div class="modal-dialog">
-    <div class="modal-content shadow-lg">
-      <div class="modal-header">
-        <h5 class="modal-title" id="confirmation_modal_label">Confirm</h5>
-        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-      </div>
-      <div class="modal-body fs-6 fw-bold" id="modal_body">
-        Are you sure you want to delete this order?
-      </div>
-      <div class="modal-footer justify-content-center">
-        <button type="button" class="btn btn-secondary me-3" data-bs-dismiss="modal" id="btn_confirm_cancel">Cancel</button>
-        <button type="button" class="btn btn-primary" data-bs-dismiss="modal" id="btn_confirm_delete">Delete</button>
-      </div>
-    </div>
     </div>
-</div>

kgOrdersClient/View.OrderEntryCorrugated.pas

@@ -71,7 +71,6 @@ type
     cbFullSizePanel: TWebDBCheckBox;
     XDataWebClient1: TXDataWebClient;
     edtSpecialInstructions: TWebDBEdit;
-    tmrScrollTop: TWebTimer;
     XDataWebDataSet1: TXDataWebDataSet;
     WebDataSource1: TWebDataSource;
     btnSave: TWebButton;
@@ -195,16 +194,14 @@ type
     btnDelete: TWebButton;
     btnClose: TWebButton;
     edtOrderNum: TWebEdit;
-    btn_modal_confirm: TWebButton;
     tmrReturn: TWebTimer;
     btnEdit: TWebButton;
     btnAdd: TWebButton;
     WebButton2: TWebButton;
+    lblFormState: TWebLabel;
     procedure WebFormCreate(Sender: TObject);
-    procedure WebFormShow(Sender: TObject);
     [async] procedure getOrder(Order_ID: string);
     [async] procedure getCustomer(customerID: string);
-    procedure tmrScrollTopTimer(Sender: TObject);
     procedure btnAddColorClick(Sender: TObject);
     procedure addColorRow(num, Color, LPI, Size: string);
     procedure btnSaveClick(Sender: TObject);
@@ -217,41 +214,29 @@ type
     procedure sendOrderToServer();
     procedure btnCloseClick(Sender: TObject);
     procedure btnDeleteClick(Sender: TObject);
-    procedure btn_modal_confirmClick(Sender: TObject);
     procedure tmrReturnTimer(Sender: TObject);
     function VerifyOrder(): boolean;
-    procedure XDataWebDataSet1AfterEdit(DataSet: TDataSet);
-    procedure xdwdsShipToAfterEdit(DataSet: TDataSet);
-    procedure dtpApprovedDateChange(Sender: TObject);
-    procedure dtpMountDueChange(Sender: TObject);
-    procedure dtpPlateDueChange(Sender: TObject);
-    procedure dtpShipDateChange(Sender: TObject);
-    procedure dtpProofDateChange(Sender: TObject);
-    procedure dtpOrderDateChange(Sender: TObject);
     procedure EditMode();
     procedure btnEditClick(Sender: TObject);
     procedure btnAddClick(Sender: TObject);
-    procedure xdwdsQBItemAfterEdit(DataSet: TDataSet);
     procedure ViewMode();
     procedure WebButton2Click(Sender: TObject);
     procedure ShowAddAddressForm();
     [async] procedure SendAddressToServer(AddressJSON: TJSONObject);
-    procedure edtJobNameChange(Sender: TObject);
-    procedure XDataWebDataSet1BeforePost(DataSet: TDataSet);
   private
-    FModalAction: string;
     FAgencyCode: string;
     FCurrentReportType: string;
     FSelectProc: TSelectProc;
+    mode: string;
     orderID: string;
     customerID: string;
-    mode: string;
     changed: boolean;
     notification: string;
     procedure RemoveColorRow(Sender: TObject);
+    [async] procedure InitializeForm;
     //FJSONProc1: TJSONProc1;
   public
-    class function CreateForm(AElementID, orderInfo, customerInfo, mode, info: string): TWebForm;
+    class function CreateForm(AElementID, orderInfo, customerInfo, modeparam, info: string): TWebForm;
   end;
 
 var
@@ -264,6 +249,44 @@ implementation
 uses
   View.Home, View.Main, View.AddOrder, View.AddAddress, Utils;
 
+class function TFOrderEntryCorrugated.CreateForm(AElementID, orderInfo, customerInfo, modeParam, info: string): TWebForm;
+begin
+  Application.CreateForm(TFOrderEntryCorrugated, AElementID, Result,
+    procedure(AForm: TObject)
+    begin
+      with TFOrderEntryCorrugated(AForm) do
+      begin
+        customerID := customerInfo;
+        orderID := orderInfo;
+        mode := modeParam;
+        notification := info;
+        console.log('Mode in createform: ' + modeParam);
+
+        InitializeForm;
+      end;
+    end
+  );
+end;
+
+
+[async] procedure TFOrderEntryCorrugated.InitializeForm;
+begin
+  if mode = 'ADD' then
+  begin
+    await(getCustomer(customerID));
+    EditMode;
+  end
+  else
+  begin
+    await(getOrder(orderID));
+    ViewMode;
+  end;
+
+  edtOrderNum.Text := orderID;
+  if notification <> '' then
+    ShowToast(notification);
+end;
+
 
 procedure TFOrderEntryCorrugated.sendOrderToServer();
 // This can be improved. I was struggling to get the checkboxes to work with
@@ -494,19 +517,20 @@ end;
 
 procedure TFOrderEntryCorrugated.btnDeleteClick(Sender: TObject);
 begin
-  FModalAction := 'delete';
-  document.getElementById('modal_body').innerHTML := 'Are you sure you want to delete this order?';
-  document.getElementById('btn_confirm_cancel').innerText := 'Cancel';
-  document.getElementById('btn_confirm_delete').innerText := 'Delete';
-
-  asm
-    var modal = document.getElementById('confirmation_modal');
-    if (modal && modal.parentNode !== document.body) {
-      document.body.appendChild(modal);
-    }
-    var confirmationModal = new bootstrap.Modal(modal, { keyboard: false });
-    confirmationModal.show();
+  ShowConfirmationModal(
+    'Are you sure you want to delete this order?',
+    'Delete',
+    'Cancel',
+    procedure(confirmed: Boolean)
+    begin
+      if confirmed then
+      begin
+        Utils.ShowSpinner('spinner');
+        DelOrder();
+        tmrReturn.Enabled := true;
       end;
+    end
+  );
 end;
 
 
@@ -526,34 +550,6 @@ begin
 end;
 
 
-procedure TFOrderEntryCorrugated.btn_modal_confirmClick(Sender: TObject);
-begin
-  if FModalAction = 'cancel' then
-  begin
-    FViewMain.change := false;
-    if OrderID <> '' then
-      FViewMain.ViewOrderEntryCorrugated(OrderID, '', 'EDIT', 'Failure:  Changes Discarded')
-    else
-      FViewMain.ViewOrders('');
-  end
-  else if FModalAction = 'delete' then
-  begin
-    Utils.ShowSpinner('spinner');
-    asm
-      var modal = document.getElementById('confirmation_modal');
-      if (modal && modal.parentNode !== document.body) {
-        document.body.appendChild(modal);
-      }
-      var bsModal = new bootstrap.Modal(modal, { keyboard: false });
-      bsModal.hide();
-    end;
-    DelOrder();
-    tmrReturn.Enabled := true;
-  end;
-end;
-
-
-
 [async] procedure TFOrderEntryCorrugated.GenerateReportPDF;
 // sends the search to the server which then sends back a pdf of the results
 var
@@ -609,26 +605,6 @@ begin
 end;
 
 
-class function TFOrderEntryCorrugated.CreateForm(AElementID, orderInfo, customerInfo, mode, info: string): TWebForm;
-var
-  localMode: string;
-begin
-  localMode := mode;
-  Application.CreateForm(TFOrderEntryCorrugated, AElementID, Result,
-    procedure(AForm: TObject)
-    begin
-      with TFOrderEntryCorrugated(AForm) do
-      begin
-        TFOrderEntryCorrugated(AForm).customerID := customerInfo;
-        TFOrderEntryCorrugated(AForm).orderID := orderInfo;
-        TFOrderEntryCorrugated(AForm).mode := localMode;
-        TFOrderEntryCorrugated(AForm).notification := info;
-      end;
-    end
-  );
-end;
-
-
 procedure TFOrderEntryCorrugated.addColorRow(num, color, LPI, size: string);
 var
   container, newRow, col, labelEl, inputEl, removeCol: TJSHTMLElement;
@@ -821,23 +797,25 @@ end;
 
 procedure TFOrderEntryCorrugated.btnCancelClick(Sender: TObject);
 begin
-  FModalAction := 'cancel';
-  document.getElementById('modal_body').innerHTML := 'Are you sure you want to cancel all changes?';
-  document.getElementById('btn_confirm_cancel').innerText := 'No';
-  document.getElementById('btn_confirm_delete').innerText := 'Yes';
-
-  asm
-    var modal = document.getElementById('confirmation_modal');
-    if (modal && modal.parentNode !== document.body) {
-      document.body.appendChild(modal);
-    }
-    var confirmationModal = new bootstrap.Modal(modal, { keyboard: false });
-    confirmationModal.show();
+  ShowConfirmationModal(
+    'Are you sure you want to cancel all changes?',
+    'Yes',
+    'No',
+    procedure(confirmed: Boolean)
+    begin
+      if confirmed then
+      begin
+        FViewMain.change := false;
+        if OrderID <> '' then
+          FViewMain.ViewOrderEntryCorrugated(OrderID, '', 'EDIT', 'Failure:  Changes Discarded')
+        else
+          FViewMain.ViewOrders('');
       end;
+    end
+  );
 end;
 
 
-
 procedure TFOrderEntryCorrugated.btnCloseClick(Sender: TObject);
 begin
   FViewMain.ViewOrders('');
@@ -1052,48 +1030,6 @@ begin
 end;
 
 
-procedure TFOrderEntryCorrugated.WebFormShow(Sender: TObject);
-begin
-  if mode <> 'ADD' then
-  begin
-    getOrder(orderID);
-    ViewMode();
-  end
-  else
-  begin
-    getCustomer(customerID);
-    EditMode();
-  end;
-  edtOrderNum.Text := OrderID;
-  if notification <> '' then
-  begin
-    ShowToast(notification);
-  end;
-end;
-
-
-procedure TFOrderEntryCorrugated.XDataWebDataSet1AfterEdit(DataSet: TDataSet);
-begin
-  EditMode();
-end;
-
-
-procedure TFOrderEntryCorrugated.XDataWebDataSet1BeforePost(DataSet: TDataSet);
-begin
-  if not (DataSet.State in [dsEdit, dsInsert]) then
-    DataSet.Edit; // Force edit mode if autofill tries to post
-end;
-
-procedure TFOrderEntryCorrugated.xdwdsQBItemAfterEdit(DataSet: TDataSet);
-begin
-  EditMode();
-end;
-
-
-procedure TFOrderEntryCorrugated.xdwdsShipToAfterEdit(DataSet: TDataSet);
-begin
-  EditMode();
-end;
 
 
 procedure TFOrderEntryCorrugated.tmrReturnTimer(Sender: TObject);
@@ -1104,15 +1040,9 @@ begin
 end;
 
 
-procedure TFOrderEntryCorrugated.tmrScrollTopTimer(Sender: TObject);
-begin
-  tmrScrollTop.Enabled := False;
-  window.scrollTo(0, 0);
-end;
-
-
 procedure TFOrderEntryCorrugated.EditMode();
 begin
+  XDataWebDataSet1.Edit;
   FViewMain.change := true;
   btnCopy.Enabled := false;
   btnPDF.Enabled := false;
@@ -1122,43 +1052,32 @@ begin
   btnCancel.Enabled := True;
   btnEdit.Enabled := false;
   btnAdd.Enabled := false;
-end;
-
-procedure TFOrderEntryCorrugated.edtJobNameChange(Sender: TObject);
-begin
-  EditMode();
-  console.log('onChange');
-end;
 
-procedure TFOrderEntryCorrugated.dtpApprovedDateChange(Sender: TObject);
-begin
-  EditMode();
+  // Enable all non-DB checkboxes manually
+  cbRefArtAPDF.Enabled := True;
+  cbRefArtPrintCard.Enabled := True;
+  cbExistingCuttingDie.Enabled := True;
+  cbFTP.Enabled := True;
+  cbSampleCarton.Enabled := True;
+  cbPlates.Enabled := True;
+  cbColorCopy.Enabled := True;
+  cbStripMount.Enabled := True;
+  cbFullMount.Enabled := True;
+  cbStickyBak.Enabled := True;
+  cbLoose.Enabled := True;
+  cbExcaliburDie.Enabled := True;
+  cbEmail.Enabled := True;
+  cbArtApprovedAsIs.Enabled := True;
+  cbPDFFile.Enabled := True;
+  cbWideFormat.Enabled := True;
+  cbPrintCard.Enabled := True;
+  cbFullSizePanel.Enabled := True;
+
+  lblFormState.Caption := 'Edit Mode';
+  lblFormState.ElementHandle.classList.remove('text-danger');
+  lblFormState.ElementHandle.classList.add('text-success');
 end;
 
-procedure TFOrderEntryCorrugated.dtpMountDueChange(Sender: TObject);
-begin
-  EditMode();
-end;
-
-procedure TFOrderEntryCorrugated.dtpOrderDateChange(Sender: TObject);
-begin
-  EditMode();
-end;
-
-procedure TFOrderEntryCorrugated.dtpPlateDueChange(Sender: TObject);
-begin
-  EditMode();
-end;
-
-procedure TFOrderEntryCorrugated.dtpProofDateChange(Sender: TObject);
-begin
-  EditMode();
-end;
-
-procedure TFOrderEntryCorrugated.dtpShipDateChange(Sender: TObject);
-begin
-  EditMode();
-end;
 
 procedure TFOrderEntryCorrugated.ViewMode;
 begin
@@ -1171,8 +1090,33 @@ begin
   btnEdit.Enabled := true;
   btnAdd.Enabled := true;
   FViewMain.change := false;
+
+  // Explicitly disable all non-DB checkboxes
+  cbRefArtAPDF.Enabled := False;
+  cbRefArtPrintCard.Enabled := False;
+  cbExistingCuttingDie.Enabled := False;
+  cbFTP.Enabled := False;
+  cbSampleCarton.Enabled := False;
+  cbPlates.Enabled := False;
+  cbColorCopy.Enabled := False;
+  cbStripMount.Enabled := False;
+  cbFullMount.Enabled := False;
+  cbStickyBak.Enabled := False;
+  cbLoose.Enabled := False;
+  cbExcaliburDie.Enabled := False;
+  cbEmail.Enabled := False;
+  cbArtApprovedAsIs.Enabled := False;
+  cbPDFFile.Enabled := False;
+  cbWideFormat.Enabled := False;
+  cbPrintCard.Enabled := False;
+  cbFullSizePanel.Enabled := False;
+
+  lblFormState.Caption := 'View Mode';
+  lblFormState.ElementHandle.classList.remove('text-success');
+  lblFormState.ElementHandle.classList.add('text-danger');
 end;
 
+
 initialization
   RegisterClass(TFOrderEntryCorrugated);
 

kgOrdersClient/View.OrderEntryCuttingDie.dfm

 object FOrderEntryCuttingDie: TFOrderEntryCuttingDie
   Width = 956
   Height = 728
-  OnShow = WebFormShow
   object WebLabel2: TWebLabel
     Left = 26
     Top = 72
@@ -32,6 +31,15 @@ object FOrderEntryCuttingDie: TFOrderEntryCuttingDie
     Visible = False
     WidthPercent = 100.000000000000000000
   end
+  object lblFormState: TWebLabel
+    Left = 34
+    Top = 8
+    Width = 3
+    Height = 15
+    ElementID = 'lbl_form_state'
+    HeightPercent = 100.000000000000000000
+    WidthPercent = 100.000000000000000000
+  end
   object edtCompanyAccountName: TWebDBEdit
     Left = 24
     Top = 120
@@ -42,21 +50,20 @@ object FOrderEntryCuttingDie: TFOrderEntryCuttingDie
     ElementID = 'edtaccountcompanyname'
     HeightPercent = 100.000000000000000000
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'SHORT_NAME'
     DataSource = WebDataSource1
   end
   object edtInQuickBooks: TWebDBEdit
-    Left = 26
-    Top = 148
+    Left = 24
+    Top = 152
     Width = 121
     Height = 23
+    AutoCompletion = acNope
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtinquickbooks'
     HeightPercent = 100.000000000000000000
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'inQuickBooks'
     DataSource = WebDataSource1
   end
@@ -72,7 +79,6 @@ object FOrderEntryCuttingDie: TFOrderEntryCuttingDie
     Date = 45638.529943136570000000
     Role = ''
     Text = ''
-    OnChange = dtpOrderDateChange
   end
   object dtpProofDate: TWebDateTimePicker
     Left = 22
@@ -86,7 +92,6 @@ object FOrderEntryCuttingDie: TFOrderEntryCuttingDie
     Date = 45638.529943136570000000
     Role = ''
     Text = ''
-    OnChange = dtpOrderDateChange
   end
   object dtpShipDate: TWebDateTimePicker
     Left = 22
@@ -100,7 +105,6 @@ object FOrderEntryCuttingDie: TFOrderEntryCuttingDie
     Date = 45638.529943136570000000
     Role = ''
     Text = ''
-    OnChange = dtpOrderDateChange
   end
   object edtShipVia: TWebDBEdit
     Left = 24
@@ -112,7 +116,6 @@ object FOrderEntryCuttingDie: TFOrderEntryCuttingDie
     ElementID = 'edtshipvia'
     HeightPercent = 100.000000000000000000
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'staff_fields_ship_via'
     DataSource = WebDataSource1
   end
@@ -123,10 +126,10 @@ object FOrderEntryCuttingDie: TFOrderEntryCuttingDie
     Height = 23
     AutoSize = True
     ChildOrder = 79
+    EditType = weNumeric
     ElementID = 'edtquantity'
     HeightPercent = 100.000000000000000000
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'staff_fields_quantity'
     DataSource = WebDataSource1
   end
@@ -139,7 +142,6 @@ object FOrderEntryCuttingDie: TFOrderEntryCuttingDie
     ElementID = 'edtprice'
     HeightPercent = 100.000000000000000000
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'staff_fields_price'
     DataSource = WebDataSource1
   end
@@ -153,7 +155,6 @@ object FOrderEntryCuttingDie: TFOrderEntryCuttingDie
     ElementID = 'edtinvoiceto'
     HeightPercent = 100.000000000000000000
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'staff_fields_invoice_to'
     DataSource = WebDataSource1
   end
@@ -181,7 +182,6 @@ object FOrderEntryCuttingDie: TFOrderEntryCuttingDie
     ElementID = 'edtponumber'
     HeightPercent = 100.000000000000000000
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'staff_fields_po_number'
     DataSource = WebDataSource1
   end
@@ -195,7 +195,6 @@ object FOrderEntryCuttingDie: TFOrderEntryCuttingDie
     ElementID = 'edtjobname'
     HeightPercent = 100.000000000000000000
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'staff_fields_job_name'
     DataSource = WebDataSource1
   end
@@ -209,7 +208,6 @@ object FOrderEntryCuttingDie: TFOrderEntryCuttingDie
     ElementID = 'edtspecialinstructions'
     HeightPercent = 100.000000000000000000
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'general_special_instructions'
     DataSource = WebDataSource1
   end
@@ -246,7 +244,6 @@ object FOrderEntryCuttingDie: TFOrderEntryCuttingDie
     ElementID = 'edtcompanyname'
     HeightPercent = 100.000000000000000000
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'NAME'
     DataSource = WebDataSource1
   end
@@ -258,7 +255,6 @@ object FOrderEntryCuttingDie: TFOrderEntryCuttingDie
     ElementID = 'wcbqbitem'
     HeightPercent = 100.000000000000000000
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     ItemIndex = -1
     DataField = 'staff_fields_quickbooks_item'
     DataSource = WebDataSource1
@@ -312,18 +308,6 @@ object FOrderEntryCuttingDie: TFOrderEntryCuttingDie
     WidthPercent = 100.000000000000000000
     OnClick = btnCloseClick
   end
-  object btn_confirm_delete: TWebButton
-    Left = 776
-    Top = 279
-    Width = 96
-    Height = 25
-    Caption = 'Delete'
-    ChildOrder = 82
-    ElementID = 'btn_confirm_delete'
-    HeightPercent = 100.000000000000000000
-    WidthPercent = 100.000000000000000000
-    OnClick = btn_confirm_deleteClick
-  end
   object btnCopy: TWebButton
     Left = 746
     Top = 453
@@ -373,15 +357,15 @@ object FOrderEntryCuttingDie: TFOrderEntryCuttingDie
     OnClick = WebButton2Click
   end
   object WebDataSource1: TWebDataSource
+    AutoEdit = False
     DataSet = XDataWebDataSet1
-    OnDataChange = WebDataSource1DataChange
-    Left = 318
-    Top = 262
+    Left = 418
+    Top = 86
   end
   object XDataWebDataSet1: TXDataWebDataSet
     Connection = DMConnection.ApiConnection
-    Left = 318
-    Top = 208
+    Left = 422
+    Top = 28
     object XDataWebDataSet1COMPANY_ID: TIntegerField
       FieldName = 'COMPANY_ID'
     end
@@ -442,40 +426,35 @@ object FOrderEntryCuttingDie: TFOrderEntryCuttingDie
     object XDataWebDataSet1staff_fields_quantity: TStringField
       FieldName = 'staff_fields_quantity'
     end
+    object XDataWebDataSet1inQuickBooks: TStringField
+      FieldName = 'inQuickBooks'
+    end
   end
   object XDataWebClient1: TXDataWebClient
     Connection = DMConnection.ApiConnection
-    Left = 218
-    Top = 76
-  end
-  object tmrScrollTop: TWebTimer
-    Interval = 100
-    OnTimer = tmrScrollTopTimer
-    Left = 240
-    Top = 8
+    Left = 200
+    Top = 50
   end
   object wdsShipTo: TWebDataSource
     DataSet = xdwdsShipTo
-    Left = 302
-    Top = 418
+    Left = 526
+    Top = 86
   end
   object xdwdsShipTo: TXDataWebDataSet
-    AfterEdit = xdwdsShipToAfterEdit
-    Left = 438
-    Top = 208
+    Left = 528
+    Top = 26
     object xdwdsShipToADDRESS: TStringField
       FieldName = 'ADDRESS'
     end
   end
   object wdsQBItem: TWebDataSource
     DataSet = xdwdsQBItem
-    Left = 272
-    Top = 548
+    Left = 606
+    Top = 86
   end
   object xdwdsQBItem: TXDataWebDataSet
-    AfterEdit = xdwdsQBItemAfterEdit
-    Left = 568
-    Top = 216
+    Left = 608
+    Top = 30
     object xdwdsQBItemname: TStringField
       FieldName = 'name'
     end

kgOrdersClient/View.OrderEntryCuttingDie.html

-<nav class="navbar navbar-expand navbar-light bg-light sticky-top"  style="z-index: 100;">
-    <div class="container-fluid ps-0">
-        <ul class="navbar-nav me-auto ps-2">
+<nav class="navbar navbar-expand navbar-light bg-light border-light sticky-top" style="z-index: 100;">
+  <div class="container-fluid d-flex align-items-center ps-0 pe-0">
+
+    <!-- Left-aligned label -->
+    <div class="me-auto ps-3">
+      <label id="lbl_form_state" class="form-label mb-0 fw-bold text-uppercase text-nowrap text-danger" style="font-size: 16px;">View Mode</label>
+    </div>
+
+    <!-- Right-aligned buttons -->
+    <ul class="navbar-nav ms-auto pe-2 mb-0">
       <li class="nav-item pe-2">
         <button id="btnadd" class="btn btn-primary btn-sm">Add</button>
       </li>
@@ -23,9 +30,10 @@
         <button id="btncancel" class="btn btn-danger btn-sm">Cancel</button>
       </li>
       <li class="nav-item">
-                <button id="btnclose" class="btn btn-secondary btn-sm">Close</button>
+        <button id="btnclose" class="btn btn-primary btn-sm">Close</button>
       </li>
     </ul>
+
   </div>
 </nav>
 <div class="row mx-5">
@@ -124,20 +132,4 @@
         </div>
     </div>
 </div>
-<div class="modal fade" id="confirmation_modal" tabindex="-1" aria-labelledby="confirmation_modal_label" aria-hidden="true">
-  <div class="modal-dialog">
-    <div class="modal-content shadow-lg">
-      <div class="modal-header">
-        <h5 class="modal-title" id="confirmation_modal_label">Confirm</h5>
-        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-      </div>
-      <div class="modal-body fs-6 fw-bold" id="modal_body">
-        Are you sure you want to delete this order?
-      </div>
-      <div class="modal-footer justify-content-center">
-        <button type="button" class="btn btn-secondary me-3" data-bs-dismiss="modal" id="btn_confirm_cancel">Cancel</button>
-        <button type="button" class="btn btn-primary" data-bs-dismiss="modal" id="btn_confirm_delete">Delete</button>
-      </div>
-    </div>
-  </div>
-</div>
+

kgOrdersClient/View.OrderEntryCuttingDie.pas

@@ -30,7 +30,6 @@ type
     XDataWebDataSet1staff_fields_proof_date: TStringField;
     XDataWebDataSet1staff_fields_ship_date: TStringField;
     XDataWebClient1: TXDataWebClient;
-    tmrScrollTop: TWebTimer;
     WebLabel2: TWebLabel;
     edtCompanyAccountName: TWebDBEdit;
     edtInQuickBooks: TWebDBEdit;
@@ -65,19 +64,18 @@ type
     edtOrderNum: TWebEdit;
     btnDelete: TWebButton;
     btnClose: TWebButton;
-    btn_confirm_delete: TWebButton;
     btnCopy: TWebButton;
     tmrReturn: TWebTimer;
     btnEdit: TWebButton;
     btnAdd: TWebButton;
     WebButton2: TWebButton;
+    XDataWebDataSet1inQuickBooks: TStringField;
+    lblFormState: TWebLabel;
     procedure btnSaveClick(Sender: TObject);
     procedure btnCancelClick(Sender: TObject);
     procedure WebFormCreate(Sender: TObject);
-    procedure WebFormShow(Sender: TObject);
     [async] procedure GetCuttingDieOrder(Order_ID: string);
     [async] procedure GetCustomer(customerID: string);
-    procedure tmrScrollTopTimer(Sender: TObject);
     [async] procedure AddCuttingDieOrder(orderJSON: TJSONObject);
     procedure btnPDFClick(Sender: TObject);
     [async] procedure GenerateReportPDF;
@@ -87,22 +85,14 @@ type
     [async] procedure delOrder();
     procedure btnCloseClick(Sender: TObject);
     procedure btnCopyClick(Sender: TObject);
-    procedure btn_confirm_deleteClick(Sender: TObject);
     procedure tmrReturnTimer(Sender: TObject);
     procedure btnAddClick(Sender: TObject);
-    procedure xdwdsShipToAfterEdit(DataSet: TDataSet);
-    procedure EditMode();
-    procedure xdwdsQBItemAfterEdit(DataSet: TDataSet);
-    procedure dtpOrderDateChange(Sender: TObject);
     procedure btnEditClick(Sender: TObject);
     procedure ViewMode();
     procedure WebButton2Click(Sender: TObject);
     procedure ShowAddAddressForm();
     [async] procedure SendAddressToServer(AddressJSON: TJSONObject);
-    procedure WebDataSource1DataChange(Sender: TObject; Field: TField);
-    procedure XDataWebDataSet1AfterEdit(DataSet: TDataSet);
   private
-    FModalAction: string;
     FAgencyCode: string;
     FCurrentReportType: string;
     FSelectProc: TSelectProc;
@@ -110,8 +100,10 @@ type
     customerID: string;
     mode: string;
     notification: string;
+    procedure EditMode;
+    [async] procedure InitializeForm;
   public
-    class function CreateForm(AElementID, orderInfo, customerInfo, mode, info: string): TWebForm;
+    class function CreateForm(AElementID, orderInfo, customerInfo, modeParam, info: string): TWebForm;
   end;
 
 var
@@ -124,22 +116,49 @@ implementation
 uses
   View.Home, View.Main, View.AddOrder, View.AddAddress, Utils;
 
-procedure TFOrderEntryCuttingDie.WebButton2Click(Sender: TObject);
+
+class function TFOrderEntryCuttingDie.CreateForm(AElementID, orderInfo, customerInfo, modeParam, info: string): TWebForm;
 begin
-  ShowAddAddressForm();
-end;
+  Application.CreateForm(TFOrderEntryCuttingDie, AElementID, Result,
+    procedure(AForm: TObject)
+    begin
+      with TFOrderEntryCuttingDie(AForm) do
+      begin
+        customerID := customerInfo;
+        orderID := orderInfo;
+        mode := modeParam;
+        notification := info;
+        console.log('Mode in createform: ' + modeParam);
 
+        InitializeForm;
+      end;
+    end
+  );
+end;
 
 
-procedure TFOrderEntryCuttingDie.WebDataSource1DataChange(Sender: TObject; Field: TField);
+[async] procedure TFOrderEntryCuttingDie.InitializeForm;
 begin
-  if Assigned(Field) then
-    console.log(
-      'Field.OnChange → ' + Field.FieldName +
-      ' is now: ' + Field.AsString
-    )
+  console.log('The mode in initialize form is: ' + mode);
+  if mode = 'ADD' then
+  begin
+    await(getCustomer(customerID));
+    EditMode;
+  end
   else
-    console.log('WebDataSource1.OnDataChange fired with no specific Field');
+  begin
+    await(getCuttingDieOrder(orderID));
+    ViewMode;
+  end;
+
+  edtOrderNum.Text := orderID;
+  if notification <> '' then
+    ShowToast(notification);
+end;
+
+procedure TFOrderEntryCuttingDie.WebButton2Click(Sender: TObject);
+begin
+  ShowAddAddressForm();
 end;
 
 
@@ -316,7 +335,6 @@ begin
     ShowToast('Success: Order Edited Successfully');
 
   AddCuttingDieOrder(orderJSON);
-
 end;
 
 
@@ -346,25 +364,26 @@ end;
 
 procedure TFOrderEntryCuttingDie.btnDeleteClick(Sender: TObject);
 begin
-  FModalAction := 'delete';
-  document.getElementById('modal_body').innerHTML := 'Are you sure you want to delete this order?';
-  document.getElementById('btn_confirm_cancel').innerText := 'Cancel';
-  document.getElementById('btn_confirm_delete').innerText := 'Delete';
-
-  asm
-    var modal = document.getElementById('confirmation_modal');
-    if (modal && modal.parentNode !== document.body) {
-      document.body.appendChild(modal);
-    }
-    var confirmationModal = new bootstrap.Modal(modal, { keyboard: false });
-    confirmationModal.show();
+  ShowConfirmationModal(
+    'Are you sure you want to delete this order?',
+    'Delete',
+    'Cancel',
+    procedure(confirmed: Boolean)
+    begin
+      if confirmed then
+      begin
+        Utils.ShowSpinner('spinner');
+        DelOrder();
+        tmrReturn.Enabled := true;
       end;
+    end
+  );
 end;
 
 
 procedure TFOrderEntryCuttingDie.btnEditClick(Sender: TObject);
 begin
-  EditMode();
+  EditMode;
 end;
 
 
@@ -372,8 +391,7 @@ procedure TFOrderEntryCuttingDie.DelOrder();
 var
   Response: TXDataClientResponse;
 begin
-  Response := await(XDataWebClient1.RawInvokeAsync('ILookupService.DelOrder',
-              [OrderID, 'corrugated', JS.toString(AuthService.TokenPayload.Properties['user_id'])]));
+  Response := await(XDataWebClient1.RawInvokeAsync('ILookupService.DelOrder', [OrderID, 'cutting', JS.toString(AuthService.TokenPayload.Properties['user_id'])]));
 end;
 
 
@@ -383,33 +401,6 @@ begin
 end;
 
 
-procedure TFOrderEntryCuttingDie.btn_confirm_deleteClick(Sender: TObject);
-begin
-  if FModalAction = 'cancel' then
-  begin
-    FViewMain.change := false;
-    if OrderID <> '' then
-      FViewMain.ViewOrderEntryCuttingDie(OrderID, '', 'EDIT', 'Failure:  Changes Discarded')
-    else
-      FViewMain.ViewOrders('');
-  end
-  else if FModalAction = 'delete' then
-  begin
-    Utils.ShowSpinner('spinner');
-    asm
-      var modal = document.getElementById('confirmation_modal');
-      if (modal && modal.parentNode !== document.body) {
-        document.body.appendChild(modal);
-      }
-      var bsModal = new bootstrap.Modal(modal, { keyboard: false });
-      bsModal.hide();
-    end;
-    DelOrder();
-    tmrReturn.Enabled := true;
-  end;
-end;
-
-
 [async] procedure TFOrderEntryCuttingDie.GenerateReportPDF;
 // sends the search to the server which then sends back a pdf of the results
 var
@@ -455,26 +446,6 @@ begin
 end;
 
 
-class function TFOrderEntryCuttingDie.CreateForm(AElementID, orderInfo, customerInfo, mode, info: string): TWebForm;
-var
-  localMode: string;
-begin
-  localMode := mode;
-  Application.CreateForm(TFOrderEntryCuttingDie, AElementID, Result,
-    procedure(AForm: TObject)
-    begin
-      with TFOrderEntryCuttingDie(AForm) do
-      begin
-        TFOrderEntryCuttingDie(AForm).customerID := customerInfo;
-        TFOrderEntryCuttingDie(AForm).orderID := orderInfo;
-        TFOrderEntryCuttingDie(AForm).mode := localMode;
-        TFOrderEntryCuttingDie(AForm).notification := info;
-      end;
-    end
-  );
-end;
-
-
 procedure TFOrderEntryCuttingDie.btnAddClick(Sender: TObject);
 var
   newform: TFAddOrder;
@@ -516,21 +487,25 @@ end;
 
 procedure TFOrderEntryCuttingDie.btnCancelClick(Sender: TObject);
 begin
-  FModalAction := 'cancel';
-  document.getElementById('modal_body').innerHTML := 'Are you sure you want to cancel all changes?';
-  document.getElementById('btn_confirm_cancel').innerText := 'No';
-  document.getElementById('btn_confirm_delete').innerText := 'Yes';
-
-  asm
-    var modal = document.getElementById('confirmation_modal');
-    if (modal && modal.parentNode !== document.body) {
-      document.body.appendChild(modal);
-    }
-    var confirmationModal = new bootstrap.Modal(modal, { keyboard: false });
-    confirmationModal.show();
+  ShowConfirmationModal(
+    'Are you sure you want to cancel all changes?',
+    'Yes',
+    'No',
+    procedure(confirmed: Boolean)
+    begin
+      if confirmed then
+      begin
+        FViewMain.change := false;
+        if OrderID <> '' then
+          FViewMain.ViewOrderEntryCuttingDie(OrderID, '', 'EDIT', 'Failure:  Changes Discarded')
+        else
+          FViewMain.ViewOrders('');
       end;
+    end
+  );
 end;
 
+
 procedure TFOrderEntryCuttingDie.btnCloseClick(Sender: TObject);
 begin
   FViewMain.ViewOrders('');
@@ -633,26 +608,6 @@ begin
   items := TJSObject(customer['ITEMS']);
   xdwdsQBItem.SetJsonData(items['data']);
   xdwdsQBITEM.Open;
-
-end;
-
-procedure TFOrderEntryCuttingDie.WebFormShow(Sender: TObject);
-begin
-  if mode <> 'ADD' then
-  begin
-    getCuttingDieOrder(orderID);
-    ViewMode();
-  end
-  else
-  begin
-    getCustomer(customerID);
-    EditMode();
-  end;
-  edtOrderNum.Text := OrderID;
-  if notification <> '' then
-  begin
-    ShowToast(notification);
-  end;
 end;
 
 
@@ -663,15 +618,10 @@ begin
   FViewMain.ViewOrders('Success: Order Successfully Deleted');
 end;
 
-procedure TFOrderEntryCuttingDie.tmrScrollTopTimer(Sender: TObject);
-begin
-  tmrScrollTop.Enabled := False;
-  window.scrollTo(0, 0);
-end;
-
 
 procedure TFOrderEntryCuttingDie.EditMode;
 begin
+  XDataWebDataSet1.Edit;
   FViewMain.change := true;
   btnCopy.Enabled := false;
   btnPDF.Enabled := false;
@@ -681,29 +631,10 @@ begin
   btnCancel.Enabled := True;
   btnEdit.Enabled := false;
   btnAdd.Enabled := false;
-end;
-
-procedure TFOrderEntryCuttingDie.XDataWebDataSet1AfterEdit(DataSet: TDataSet);
-begin
-  EditMode();
-end;
 
-
-procedure TFOrderEntryCuttingDie.xdwdsQBItemAfterEdit(DataSet: TDataSet);
-begin
-  EditMode();
-end;
-
-
-procedure TFOrderEntryCuttingDie.xdwdsShipToAfterEdit(DataSet: TDataSet);
-begin
-  EditMode();
-end;
-
-
-procedure TFOrderEntryCuttingDie.dtpOrderDateChange(Sender: TObject);
-begin
-  EditMode();
+  lblFormState.Caption := 'Edit Mode';
+  lblFormState.ElementHandle.classList.remove('text-danger');
+  lblFormState.ElementHandle.classList.add('text-success');
 end;
 
 
@@ -718,6 +649,10 @@ begin
   btnEdit.Enabled := true;
   btnAdd.Enabled := true;
   FViewMain.change := false;
+
+  lblFormState.Caption := 'View Mode';
+  lblFormState.ElementHandle.classList.remove('text-success');
+  lblFormState.ElementHandle.classList.add('text-danger');
 end;
 
 

kgOrdersClient/View.OrderEntryWeb.dfm

 object FOrderEntryWeb: TFOrderEntryWeb
   Width = 1261
   Height = 628
-  OnShow = WebFormShow
+  OnCreate = WebFormCreate
   object WebLabel2: TWebLabel
     Left = 26
     Top = 72
@@ -112,6 +112,15 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Visible = False
     WidthPercent = 100.000000000000000000
   end
+  object lblFormState: TWebLabel
+    Left = 18
+    Top = 16
+    Width = 3
+    Height = 15
+    ElementID = 'lbl_form_state'
+    HeightPercent = 100.000000000000000000
+    WidthPercent = 100.000000000000000000
+  end
   object edtCompanyName: TWebDBEdit
     Left = 24
     Top = 92
@@ -122,9 +131,9 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ElementID = 'edtcompanyname'
     HeightPercent = 100.000000000000000000
     MaxLength = 90
+    ShowFocus = False
     WidthStyle = ssAuto
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'NAME'
     DataSource = WebDataSource1
   end
@@ -137,8 +146,8 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ChildOrder = 79
     ElementID = 'edtaccountcompanyname'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'SHORT_NAME'
     DataSource = WebDataSource1
   end
@@ -151,8 +160,8 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ChildOrder = 79
     ElementID = 'edtinquickbooks'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'inQuickBooks'
     DataSource = WebDataSource1
   end
@@ -167,8 +176,8 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Color = clWhite
     Date = 45638.529943136570000000
     Role = ''
+    ShowFocus = False
     Text = ''
-    OnChange = dtpOrderDateChange
   end
   object dtpProofDate: TWebDateTimePicker
     Left = 22
@@ -181,8 +190,8 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Color = clWhite
     Date = 45638.529943136570000000
     Role = ''
+    ShowFocus = False
     Text = ''
-    OnChange = dtpOrderDateChange
   end
   object dtpShipDate: TWebDateTimePicker
     Left = 22
@@ -195,8 +204,8 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Color = clWhite
     Date = 45638.529943136570000000
     Role = ''
+    ShowFocus = False
     Text = ''
-    OnChange = dtpOrderDateChange
   end
   object dtpArtDue: TWebDateTimePicker
     Left = 24
@@ -209,8 +218,8 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Color = clWhite
     Date = 45638.529943136570000000
     Role = ''
+    ShowFocus = False
     Text = ''
-    OnChange = dtpOrderDateChange
   end
   object dtpPlateDue: TWebDateTimePicker
     Left = 24
@@ -223,8 +232,8 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Color = clWhite
     Date = 45638.529943136570000000
     Role = ''
+    ShowFocus = False
     Text = ''
-    OnChange = dtpOrderDateChange
   end
   object edtShipVia: TWebDBEdit
     Left = 24
@@ -235,8 +244,8 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ChildOrder = 79
     ElementID = 'edtshipvia'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'staff_fields_ship_via'
     DataSource = WebDataSource1
   end
@@ -249,21 +258,21 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ChildOrder = 79
     ElementID = 'edtquantity'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'staff_fields_quantity'
     DataSource = WebDataSource1
   end
   object edtPrice: TWebDBEdit
-    Left = 24
+    Left = 26
     Top = 374
     Width = 121
     Height = 22
     ChildOrder = 79
     ElementID = 'edtprice'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'staff_fields_price'
     DataSource = WebDataSource1
   end
@@ -276,8 +285,8 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ChildOrder = 79
     ElementID = 'edtinvoiceto'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'staff_fields_invoice_to'
     DataSource = WebDataSource1
   end
@@ -290,8 +299,8 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ChildOrder = 79
     ElementID = 'edtponumber'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'staff_fields_po_number'
     DataSource = WebDataSource1
   end
@@ -304,18 +313,19 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ChildOrder = 79
     ElementID = 'edtjobname'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'staff_fields_job_name'
     DataSource = WebDataSource1
   end
   object WebDBComboBox1: TWebDBComboBox
     Left = 26
-    Top = 430
+    Top = 429
     Width = 145
     Height = 23
     ElementID = 'wcbshipto'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
     ItemIndex = -1
     DataField = 'staff_fields_ship_to'
@@ -332,8 +342,8 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ChildOrder = 79
     ElementID = 'edtbworcolorcopy'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'supplied_by_customer_b_w_or_co'
     DataSource = WebDataSource1
   end
@@ -346,8 +356,8 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ChildOrder = 79
     ElementID = 'edtplates'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'supplied_by_customer_plates'
     DataSource = WebDataSource1
   end
@@ -360,8 +370,8 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ChildOrder = 79
     ElementID = 'edtdimensionallayout'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'supplied_by_customer_dimension'
     DataSource = WebDataSource1
   end
@@ -374,8 +384,8 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ChildOrder = 79
     ElementID = 'edtsample'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'supplied_by_customer_sample'
     DataSource = WebDataSource1
   end
@@ -388,8 +398,8 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ChildOrder = 79
     ElementID = 'edtother'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'supplied_by_customer_other'
     DataSource = WebDataSource1
   end
@@ -402,8 +412,8 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ChildOrder = 79
     ElementID = 'edtemail'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'supplied_by_customer_e_mail'
     DataSource = WebDataSource1
   end
@@ -416,8 +426,8 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ChildOrder = 79
     ElementID = 'edttotalinchesused'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'supplied_by_customer_total_inc'
     DataSource = WebDataSource1
   end
@@ -430,8 +440,8 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ChildOrder = 79
     ElementID = 'edtftp'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'supplied_by_customer_ftp'
     DataSource = WebDataSource1
   end
@@ -444,8 +454,8 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ChildOrder = 79
     ElementID = 'edtsheetsused'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'supplied_by_customer_sheets_us'
     DataSource = WebDataSource1
   end
@@ -458,8 +468,8 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ChildOrder = 79
     ElementID = 'edtinitials'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'supplied_by_customer_initials'
     DataSource = WebDataSource1
   end
@@ -468,12 +478,14 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 96
     Width = 113
     Height = 22
+    TabStop = False
     Caption = 'PDF'
     ChildOrder = 79
     ElementID = 'cbpdf'
+    Enabled = False
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnClick = dtpOrderDateChange
     DataField = 'proofing_pdf'
     DataSource = WebDataSource1
   end
@@ -482,12 +494,13 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 128
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtpdfto'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'proofing_pdf_to'
     DataSource = WebDataSource1
   end
@@ -502,8 +515,9 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Color = clWhite
     Date = 45638.529943136570000000
     Role = ''
+    ShowFocus = False
+    TabStop = False
     Text = ''
-    OnChange = dtpOrderDateChange
   end
   object dtpPDFDate3: TWebDateTimePicker
     Left = 444
@@ -516,8 +530,9 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Color = clWhite
     Date = 45638.529943136570000000
     Role = ''
+    ShowFocus = False
+    TabStop = False
     Text = ''
-    OnChange = dtpOrderDateChange
   end
   object dtpPDFDate2: TWebDateTimePicker
     Left = 444
@@ -530,20 +545,23 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Color = clWhite
     Date = 45638.529943136570000000
     Role = ''
+    ShowFocus = False
+    TabStop = False
     Text = ''
-    OnChange = dtpOrderDateChange
   end
   object cbInkJet: TWebDBCheckBox
     Left = 444
     Top = 238
     Width = 113
     Height = 22
+    TabStop = False
     Caption = 'Full Size Ink Jet For Layout Content Only'
     ChildOrder = 79
     ElementID = 'cbfullsizeinkjet'
+    Enabled = False
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnClick = dtpOrderDateChange
     DataField = 'proofing_full_size_ink_jet_for'
     DataSource = WebDataSource1
   end
@@ -552,12 +570,13 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 295
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtinkjetto2'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'proofing_ink_jet_to_2'
     DataSource = WebDataSource1
   end
@@ -566,12 +585,13 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 266
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtinkjetto'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'proofing_ink_jet_to'
     DataSource = WebDataSource1
   end
@@ -586,8 +606,9 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Color = clWhite
     Date = 45638.529943136570000000
     Role = ''
+    ShowFocus = False
+    TabStop = False
     Text = ''
-    OnChange = dtpOrderDateChange
   end
   object dtpInkJetDate3: TWebDateTimePicker
     Left = 444
@@ -600,8 +621,9 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Color = clWhite
     Date = 45638.529943136570000000
     Role = ''
+    ShowFocus = False
+    TabStop = False
     Text = ''
-    OnChange = dtpOrderDateChange
   end
   object dtpInkJetDate2: TWebDateTimePicker
     Left = 444
@@ -614,20 +636,22 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Color = clWhite
     Date = 45638.529943136570000000
     Role = ''
+    ShowFocus = False
+    TabStop = False
     Text = ''
-    OnChange = dtpOrderDateChange
   end
   object edtColorContrastTo: TWebDBEdit
     Left = 444
     Top = 435
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtcolorcontrastto'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'proofing_color_contrac_to'
     DataSource = WebDataSource1
   end
@@ -642,8 +666,9 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Color = clWhite
     Date = 45638.529943136570000000
     Role = ''
+    ShowFocus = False
+    TabStop = False
     Text = ''
-    OnChange = dtpOrderDateChange
   end
   object dtpColorContractDate2: TWebDateTimePicker
     Left = 444
@@ -656,20 +681,22 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Color = clWhite
     Date = 45638.529943136570000000
     Role = ''
+    ShowFocus = False
+    TabStop = False
     Text = ''
-    OnChange = dtpOrderDateChange
   end
   object edtDigitalColorTo: TWebDBEdit
     Left = 444
     Top = 545
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtdigitalcolorto'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'proofing_digital_color_to'
     DataSource = WebDataSource1
   end
@@ -678,12 +705,13 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 516
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtdigitalcolorkey'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'proofing_digital_color_key'
     DataSource = WebDataSource1
   end
@@ -698,20 +726,22 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Color = clWhite
     Date = 45638.529943136570000000
     Role = ''
+    ShowFocus = False
+    TabStop = False
     Text = ''
-    OnChange = dtpOrderDateChange
   end
   object edtAniloxInfo: TWebDBEdit
     Left = 634
     Top = 58
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtanilaxinfo'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'quantity_and_colors_anilox_info'
     DataSource = WebDataSource1
   end
@@ -720,12 +750,13 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 29
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtpressname'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'quantity_and_colors_press_name'
     DataSource = WebDataSource1
   end
@@ -738,6 +769,7 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ChildOrder = 59
     ElementID = 'btnaddcolor'
     HeightPercent = 100.000000000000000000
+    TabStop = False
     WidthPercent = 100.000000000000000000
     OnClick = WebButton1Click
   end
@@ -746,12 +778,13 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 139
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtmicrodots'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'plate_marks_microdots'
     DataSource = WebDataSource1
   end
@@ -760,12 +793,13 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 168
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtmicrodotscomments'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'plate_marks_microdots_comments'
     DataSource = WebDataSource1
   end
@@ -774,12 +808,13 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 239
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtcrosshairscomments'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'plate_marks_crosshairs_comments'
     DataSource = WebDataSource1
   end
@@ -788,12 +823,13 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 206
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtcrosshairs'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'plate_marks_crosshairs'
     DataSource = WebDataSource1
   end
@@ -802,12 +838,13 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 300
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtcolorbarscomments'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'plate_marks_color_bars_comments'
     DataSource = WebDataSource1
   end
@@ -816,12 +853,13 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 271
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtcolorbars'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'plate_marks_color_bars'
     DataSource = WebDataSource1
   end
@@ -830,12 +868,13 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 329
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtplateother'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'plate_marks_other'
     DataSource = WebDataSource1
   end
@@ -844,12 +883,13 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 358
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtplateothercomments'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'plate_marks_other_comments'
     DataSource = WebDataSource1
   end
@@ -858,6 +898,7 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 29
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtaround'
@@ -872,6 +913,7 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 58
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtaccross'
@@ -886,6 +928,7 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 129
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtreverseprint'
@@ -900,6 +943,7 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 96
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtsurfaceprint'
@@ -914,6 +958,7 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 190
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtcutoffdimension'
@@ -928,6 +973,7 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 161
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtcylinderrepeat'
@@ -942,6 +988,7 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 219
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtpitch'
@@ -956,6 +1003,7 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 282
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtbleed'
@@ -970,6 +1018,7 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 248
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtteeth'
@@ -984,6 +1033,7 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 311
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtcutback'
@@ -998,6 +1048,7 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 344
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtminimumtrapdimension'
@@ -1012,6 +1063,7 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 373
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtmaximumtrapdimension'
@@ -1026,6 +1078,7 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 423
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtsize'
@@ -1075,6 +1128,7 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ChildOrder = 79
     ElementID = 'edtdistortionpercent'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
     DataField = 'upc_distortion_percent'
     DataSource = WebDataSource1
@@ -1084,10 +1138,12 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 516
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtjobnumber'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
     DataField = 'plates_job_number'
     DataSource = WebDataSource1
@@ -1097,12 +1153,13 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Top = 160
     Width = 121
     Height = 23
+    TabStop = False
     AutoSize = True
     ChildOrder = 79
     ElementID = 'edtcomments'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     DataField = 'general_comments'
     DataSource = WebDataSource1
   end
@@ -1149,6 +1206,7 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Height = 23
     ElementID = 'wcbqbitem'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
     ItemIndex = -1
     DataField = 'staff_fields_quickbooks_item'
@@ -1163,8 +1221,9 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Height = 23
     ElementID = 'wcbmaterial'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
+    TabStop = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     ItemIndex = -1
     Items.Strings = (
       'PhotoPolymer'
@@ -1179,8 +1238,9 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Height = 23
     ElementID = 'wcbthickness'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
+    TabStop = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     ItemIndex = -1
     Items.Strings = (
       '.250'
@@ -1198,8 +1258,9 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Height = 23
     ElementID = 'wcbprint'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
+    TabStop = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     ItemIndex = -1
     Items.Strings = (
       'Portrait'
@@ -1214,8 +1275,9 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Height = 23
     ElementID = 'wcbcolorcontract'
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
+    TabStop = False
     WidthPercent = 100.000000000000000000
-    OnChange = dtpOrderDateChange
     ItemIndex = -1
     Items.Strings = (
       'Cromapro Ink Jet'
@@ -1268,20 +1330,9 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ElementID = 'edtordernum'
     Enabled = False
     HeightPercent = 100.000000000000000000
+    ShowFocus = False
     WidthPercent = 100.000000000000000000
   end
-  object btn_confirm_delete: TWebButton
-    Left = 1094
-    Top = 414
-    Width = 96
-    Height = 25
-    Caption = 'Delete'
-    ChildOrder = 82
-    ElementID = 'btn_confirm_delete'
-    HeightPercent = 100.000000000000000000
-    WidthPercent = 100.000000000000000000
-    OnClick = btn_confirm_deleteClick
-  end
   object btnEdit: TWebButton
     Left = 1165
     Top = 560
@@ -1315,6 +1366,7 @@ object FOrderEntryWeb: TFOrderEntryWeb
     ChildOrder = 85
     ElementID = 'btnaddaddress'
     HeightPercent = 100.000000000000000000
+    TabStop = False
     WidthPercent = 100.000000000000000000
     OnClick = WebButton2Click
   end
@@ -1323,17 +1375,10 @@ object FOrderEntryWeb: TFOrderEntryWeb
     Left = 160
     Top = 18
   end
-  object tmrScrollTop: TWebTimer
-    Interval = 100
-    OnTimer = tmrScrollTopTimer
-    Left = 240
-    Top = 8
-  end
   object XDataWebDataSet1: TXDataWebDataSet
-    AfterEdit = XDataWebDataSet1AfterEdit
     Connection = DMConnection.ApiConnection
-    Left = 90
-    Top = 20
+    Left = 408
+    Top = 4
     object XDataWebDataSet1ORDER_ID: TIntegerField
       FieldName = 'ORDER_ID'
     end
@@ -1590,32 +1635,33 @@ object FOrderEntryWeb: TFOrderEntryWeb
     end
   end
   object WebDataSource1: TWebDataSource
+    AutoEdit = False
     DataSet = XDataWebDataSet1
-    Left = 22
-    Top = 10
+    Left = 406
+    Top = 38
   end
   object wdsShipTo: TWebDataSource
+    AutoEdit = False
     DataSet = xdwdsShipTo
-    Left = 212
-    Top = 436
+    Left = 320
+    Top = 38
   end
   object xdwdsShipTo: TXDataWebDataSet
-    AfterEdit = XDataWebDataSet1AfterEdit
-    Left = 208
-    Top = 398
+    Left = 322
+    Top = 6
     object xdwdsShipToADDRESS: TStringField
       FieldName = 'ADDRESS'
     end
   end
   object wdsQBItem: TWebDataSource
+    AutoEdit = False
     DataSet = xdwdsQBItem
-    Left = 240
-    Top = 518
+    Left = 244
+    Top = 34
   end
   object xdwdsQBItem: TXDataWebDataSet
-    AfterEdit = XDataWebDataSet1AfterEdit
-    Left = 200
-    Top = 512
+    Left = 246
+    Top = 2
     object xdwdsQBItemname: TStringField
       FieldName = 'name'
     end
@@ -1623,7 +1669,7 @@ object FOrderEntryWeb: TFOrderEntryWeb
   object tmrReturn: TWebTimer
     Enabled = False
     OnTimer = tmrReturnTimer
-    Left = 306
-    Top = 62
+    Left = 216
+    Top = 258
   end
 end

kgOrdersClient/View.OrderEntryWeb.html

-<nav class="navbar navbar-expand navbar-light bg-light sticky-top"  style="z-index: 100;">
-    <div class="container-fluid ps-0">
-        <ul class="navbar-nav me-auto ps-2">
+<nav class="navbar navbar-expand navbar-light bg-light border-light sticky-top" style="z-index: 100;">
+  <div class="container-fluid d-flex align-items-center ps-0 pe-0">
+
+    <!-- Left-aligned label -->
+    <div class="me-auto ps-3">
+      <label id="lbl_form_state" class="form-label mb-0 fw-bold text-uppercase text-nowrap text-danger" style="font-size: 16px;">Test</label>
+    </div>
+
+    <!-- Right-aligned buttons -->
+    <ul class="navbar-nav ms-auto pe-2 mb-0">
       <li class="nav-item pe-2">
         <button id="btnadd" class="btn btn-primary btn-sm">Add</button>
       </li>
@@ -23,9 +30,10 @@
         <button id="btncancel" class="btn btn-danger btn-sm">Cancel</button>
       </li>
       <li class="nav-item">
-                <button id="btnclose" class="btn btn-secondary btn-sm">Close</button>
+        <button id="btnclose" class="btn btn-primary btn-sm">Close</button>
       </li>
     </ul>
+
   </div>
 </nav>
 <div class="row mx-5">
@@ -418,20 +426,4 @@
         </div>
     </div>
 </div>
-<div class="modal fade" id="confirmation_modal" tabindex="-1" aria-labelledby="confirmation_modal_label" aria-hidden="true">
-  <div class="modal-dialog">
-    <div class="modal-content shadow-lg">
-      <div class="modal-header">
-        <h5 class="modal-title" id="confirmation_modal_label">Confirm</h5>
-        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-      </div>
-      <div class="modal-body fs-6 fw-bold" id="modal_body">
-        Are you sure you want to delete this order?
-      </div>
-      <div class="modal-footer justify-content-center">
-        <button type="button" class="btn btn-secondary me-3" data-bs-dismiss="modal" id="btn_confirm_cancel">Cancel</button>
-        <button type="button" class="btn btn-primary" data-bs-dismiss="modal" id="btn_confirm_delete">Delete</button>
-      </div>
-    </div>
-  </div>
-</div>
+

kgOrdersClient/View.OrderEntryWeb.pas

@@ -16,7 +16,6 @@ type
     edtCompanyAccountName: TWebDBEdit;
     edtInQuickBooks: TWebDBEdit;
     XDataWebClient1: TXDataWebClient;
-    tmrScrollTop: TWebTimer;
     XDataWebDataSet1: TXDataWebDataSet;
     XDataWebDataSet1ORDER_ID: TIntegerField;
     XDataWebDataSet1COMPANY_ID: TIntegerField;
@@ -199,16 +198,14 @@ type
     btnDelete: TWebButton;
     btnClose: TWebButton;
     edtOrderNum: TWebEdit;
-    btn_confirm_delete: TWebButton;
     tmrReturn: TWebTimer;
     btnEdit: TWebButton;
     btnAdd: TWebButton;
     WebButton2: TWebButton;
+    lblFormState: TWebLabel;
     procedure WebFormCreate(Sender: TObject);
-    procedure WebFormShow(Sender: TObject);
     [async] procedure getOrder(Order_ID: string);
     [async] procedure getCustomer(customerID: string);
-    procedure tmrScrollTopTimer(Sender: TObject);
     procedure WebButton1Click(Sender: TObject);
     procedure addColorRow(num, Color, LPI, Size: string);
     procedure btnSaveClick(Sender: TObject);
@@ -222,13 +219,10 @@ type
     procedure btnDeleteClick(Sender: TObject);
     [async] procedure DelOrder;
     procedure tmrReturnTimer(Sender: TObject);
-    procedure btn_confirm_deleteClick(Sender: TObject);
     function VerifyOrder(): boolean;
     procedure btnAddClick(Sender: TObject);
     procedure btnEditClick(Sender: TObject);
     procedure EditMode();
-    procedure XDataWebDataSet1AfterEdit(DataSet: TDataSet);
-    procedure dtpOrderDateChange(Sender: TObject);
     procedure ViewMode();
     procedure WebButton2Click(Sender: TObject);
     procedure ShowAddAddressForm();
@@ -243,9 +237,10 @@ type
     mode: string;
     notification: string;
     procedure RemoveColorRow(Sender: TObject);
+    [async] procedure InitializeForm;
     //FJSONProc1: TJSONProc1;
   public
-    class function CreateForm(AElementID, orderInfo, customerInfo, mode, info: string): TWebForm;
+    class function CreateForm(AElementID, orderInfo, customerInfo, modeParam, info: string): TWebForm;
   end;
 
 var
@@ -258,6 +253,46 @@ implementation
 uses
   View.Home, View.Main, View.AddOrder, View.AddAddress, Utils;
 
+
+class function TFOrderEntryWeb.CreateForm(AElementID, orderInfo, customerInfo, modeParam, info: string): TWebForm;
+begin
+  Application.CreateForm(TFOrderEntryWeb, AElementID, Result,
+    procedure(AForm: TObject)
+    begin
+      with TFOrderEntryWeb(AForm) do
+      begin
+        customerID := customerInfo;
+        orderID := orderInfo;
+        mode := modeParam;
+        notification := info;
+        console.log('Mode in createform: ' + modeParam);
+
+        InitializeForm;
+      end;
+    end
+  );
+end;
+
+
+[async] procedure TFOrderEntryWeb.InitializeForm;
+begin
+  if mode = 'ADD' then
+  begin
+    await(getCustomer(customerID));
+    EditMode;
+  end
+  else
+  begin
+    await(getOrder(orderID));
+    ViewMode;
+  end;
+
+  edtOrderNum.Text := orderID;
+  if notification <> '' then
+    ShowToast(notification);
+end;
+
+
 procedure TFOrderEntryWeb.WebButton2Click(Sender: TObject);
 begin
   ShowAddAddressForm();
@@ -413,21 +448,23 @@ begin
   window.scrollTo(0, 0);
 end;
 
+
 procedure TFOrderEntryWeb.btnDeleteClick(Sender: TObject);
 begin
-  FModalAction := 'delete';
-  document.getElementById('modal_body').innerHTML := 'Are you sure you want to delete this order?';
-  document.getElementById('btn_confirm_cancel').innerText := 'Cancel';
-  document.getElementById('btn_confirm_delete').innerText := 'Delete';
-
-  asm
-    var modal = document.getElementById('confirmation_modal');
-    if (modal && modal.parentNode !== document.body) {
-      document.body.appendChild(modal);
-    }
-    var confirmationModal = new bootstrap.Modal(modal, { keyboard: false });
-    confirmationModal.show();
+  ShowConfirmationModal(
+    'Are you sure you want to delete this order?',
+    'Delete',
+    'Cancel',
+    procedure(confirmed: Boolean)
+    begin
+      if confirmed then
+      begin
+        Utils.ShowSpinner('spinner');
+        DelOrder();
+        tmrReturn.Enabled := true;
       end;
+    end
+  );
 end;
 
 procedure TFOrderEntryWeb.btnEditClick(Sender: TObject);
@@ -435,30 +472,12 @@ begin
   EditMode();
 end;
 
-procedure TFOrderEntryWeb.EditMode;
-begin
-  FViewMain.change := true;
-  btnCopy.Enabled := false;
-  btnPDF.Enabled := false;
-  btnDelete.Enabled := false;
-  btnClose.Enabled := false;
-  btnSave.Enabled := true;
-  btnCancel.Enabled := True;
-  btnEdit.Enabled := false;
-  btnAdd.Enabled := false;
-end;
 
 [async] procedure TFOrderEntryWeb.DelOrder();
 var
   Response: TXDataClientResponse;
 begin
-  Response := await(XDataWebClient1.RawInvokeAsync('ILookupService.DelOrder',
-              [OrderID, 'web', JS.toString(AuthService.TokenPayload.Properties['user_id'])]));
-end;
-
-procedure TFOrderEntryWeb.dtpOrderDateChange(Sender: TObject);
-begin
-  EditMode();
+  Response := await(XDataWebClient1.RawInvokeAsync('ILookupService.DelOrder', [OrderID, 'web', JS.toString(AuthService.TokenPayload.Properties['user_id'])]));
 end;
 
 procedure TFOrderEntryWeb.SendOrderToServer();
@@ -556,32 +575,6 @@ begin
   GenerateReportPDF;
 end;
 
-procedure TFOrderEntryWeb.btn_confirm_deleteClick(Sender: TObject);
-begin
-  if FModalAction = 'cancel' then
-  begin
-    FViewMain.change := false;
-    if OrderID <> '' then
-      FViewMain.ViewOrderEntryWeb(OrderID, '', 'EDIT', 'Failure:  Changes Discarded')
-    else
-      FViewMain.ViewOrders('');
-  end
-  else if FModalAction = 'delete' then
-  begin
-    Utils.ShowSpinner('spinner');
-    asm
-      var modal = document.getElementById('confirmation_modal');
-      if (modal && modal.parentNode !== document.body) {
-        document.body.appendChild(modal);
-      }
-      var bsModal = new bootstrap.Modal(modal, { keyboard: false });
-      bsModal.hide();
-    end;
-    DelOrder();
-    tmrReturn.Enabled := true;
-  end;
-end;
-
 procedure TFOrderEntryWeb.GenerateReportPDF;
 // sends the search to the server which then sends back a pdf of the results
 var
@@ -624,27 +617,6 @@ begin
   end;
 end;
 
-
-class function TFOrderEntryWeb.CreateForm(AElementID, orderInfo, customerInfo, mode, info: string): TWebForm;
-var
-  localMode: string;
-begin
-  localMode := mode;
-  Application.CreateForm(TFOrderEntryWeb, AElementID, Result,
-    procedure(AForm: TObject)
-    begin
-      with TFOrderEntryWeb(AForm) do
-      begin
-        TFOrderEntryWeb(AForm).customerID := customerInfo;
-        TFOrderEntryWeb(AForm).orderID := orderInfo;
-        TFOrderEntryWeb(AForm).mode := localMode;
-        TFOrderEntryWeb(AForm).notification := info;
-      end;
-    end
-  );
-
-end;
-
 procedure TFOrderEntryWeb.addColorRow(num: string; Color: string; LPI: string; Size: string);
 var
   container, newRow, col, labelEl, inputEl, removeCol: TJSHTMLElement;
@@ -763,19 +735,22 @@ end;
 
 procedure TFOrderEntryWeb.btnCancelClick(Sender: TObject);
 begin
-  FModalAction := 'cancel';
-  document.getElementById('modal_body').innerHTML := 'Are you sure you want to cancel all changes?';
-  document.getElementById('btn_confirm_cancel').innerText := 'No';
-  document.getElementById('btn_confirm_delete').innerText := 'Yes';
-
-  asm
-    var modal = document.getElementById('confirmation_modal');
-    if (modal && modal.parentNode !== document.body) {
-      document.body.appendChild(modal);
-    }
-    var confirmationModal = new bootstrap.Modal(modal, { keyboard: false });
-    confirmationModal.show();
+  ShowConfirmationModal(
+    'Are you sure you want to cancel all changes?',
+    'Yes',
+    'No',
+    procedure(confirmed: Boolean)
+    begin
+      if confirmed then
+      begin
+        FViewMain.change := false;
+        if OrderID <> '' then
+          FViewMain.ViewOrderEntryWeb(OrderID, '', 'EDIT', 'Failure:  Changes Discarded')
+        else
+          FViewMain.ViewOrders('');
       end;
+    end
+  );
 end;
 
 procedure TFOrderEntryWeb.btnCloseClick(Sender: TObject);
@@ -957,31 +932,6 @@ begin
 
 end;
 
-procedure TFOrderEntryWeb.WebFormShow(Sender: TObject);
-begin
-  if mode <> 'ADD' then
-  begin
-    getOrder(orderID);
-    ViewMode();
-  end
-  else
-  begin
-    getCustomer(customerID);
-    EditMode();
-  end;
-  edtOrderNum.Text := OrderID;
-  if notification <> '' then
-  begin
-    ShowToast(notification);
-  end;
-end;
-
-procedure TFOrderEntryWeb.XDataWebDataSet1AfterEdit(DataSet: TDataSet);
-begin
-  EditMode();
-end;
-
-
 procedure TFOrderEntryWeb.tmrReturnTimer(Sender: TObject);
 begin
   Utils.HideSpinner('spinner');
@@ -989,10 +939,25 @@ begin
   FViewMain.ViewOrders('Success: Order Successfully Deleted');
 end;
 
-procedure TFOrderEntryWeb.tmrScrollTopTimer(Sender: TObject);
+procedure TFOrderEntryWeb.EditMode;
 begin
-  tmrScrollTop.Enabled := False;
-  window.scrollTo(0, 0);
+  XDataWebDataSet1.Edit;
+  FViewMain.change := true;
+  btnCopy.Enabled := false;
+  btnPDF.Enabled := false;
+  btnDelete.Enabled := false;
+  btnClose.Enabled := false;
+  btnSave.Enabled := true;
+  btnCancel.Enabled := True;
+  btnEdit.Enabled := false;
+  btnAdd.Enabled := false;
+
+  cbPdf.Enabled := True;
+  cbInkJet.Enabled := True;
+
+  lblFormState.Caption := 'Edit Mode';
+  lblFormState.ElementHandle.classList.remove('text-danger');
+  lblFormState.ElementHandle.classList.add('text-success');
 end;
 
 procedure TFOrderEntryWeb.ViewMode;
@@ -1006,6 +971,13 @@ begin
   btnEdit.Enabled := true;
   btnAdd.Enabled := true;
   FViewMain.change := false;
+
+  cbPdf.Enabled := False;
+  cbInkJet.Enabled := False;
+
+  lblFormState.Caption := 'View Mode';
+  lblFormState.ElementHandle.classList.remove('text-success');
+  lblFormState.ElementHandle.classList.add('text-danger');
 end;
 
 

kgOrdersClient/View.Orders.pas

@@ -76,7 +76,7 @@ type
     procedure ClearTable();
     procedure GeneratePagination(TotalPages: Integer);
     function GenerateSearchOptions(): string;
-    procedure orderEntry(orderInfo, customerInfo, mode, orderType: string);
+    procedure OrderEntry(orderInfo, customerInfo, mode, orderType: string);
     procedure ShowAddOrderForm();
     procedure ShowSearchForm();
     procedure ShowSetStatusForm();
@@ -139,38 +139,25 @@ begin
   );
 end;
 
+
 procedure TFViewOrders.btnPDFClick(Sender: TObject);
-var
-  confirmBtn: TJSHTMLElement;
 begin
   if xdwdsOrders.RecordCount >= 100 then
   begin
     FPendingPdfTab := nil;
 
-    document.getElementById('modal_body').innerHTML :=
-      'You are about to generate a PDF for over 100 orders. This may take some time. Continue?';
-    document.getElementById('btn_confirm_cancel').innerText := 'Cancel';
-    document.getElementById('btn_confirm_delete').innerText := 'Yes';
-
-    confirmBtn := TJSHTMLElement(document.getElementById('btn_confirm_delete'));
-    confirmBtn.addEventListener('click',
-      TJSEventHandler(
-        procedure(Event: TJSEvent)
+    ShowConfirmationModal(
+      'You are about to generate a PDF for over 100 orders. This may take some time. Continue?',
+      'Yes',
+      'Cancel',
+      procedure(confirmed: Boolean)
+      begin
+        if confirmed then
         begin
-          asm bootstrap.Modal.getInstance(document.getElementById('confirmation_modal')).hide(); end;
           HandlePDFConfirmation;
+        end;
       end
-      )
     );
-
-    asm
-      var modal = document.getElementById('confirmation_modal');
-      if (modal && modal.parentNode !== document.body) {
-        document.body.appendChild(modal);
-      }
-      var confirmationModal = new bootstrap.Modal(modal, { keyboard: false });
-      confirmationModal.show();
-    end;
   end
   else
   begin
@@ -198,6 +185,7 @@ begin
 end;
 
 
+
 procedure TFViewOrders.HandlePDFConfirmation;
 begin
   // Open tab only now
@@ -765,7 +753,10 @@ begin
 
         // Update label
         if orderListLength = 0 then
-          lblEntries.Caption := 'No entries found'
+        begin
+          lblEntries.Caption := 'No entries found';
+          ShowToast('No entries found', 'danger');
+        end
         else if (PageNumber * PageSize) < orderListLength then
           lblEntries.Caption := Format('Showing entries %d - %d of %d',
             [(PageNumber - 1) * PageSize + 1, PageNumber * PageSize, orderListLength])
@@ -784,18 +775,18 @@ begin
 end;
 
 
-
-
 procedure TFViewOrders.btnAddOrderClick(Sender: TObject);
 begin
   ShowAddOrderForm();
 end;
 
 
-procedure TFViewOrders.orderEntry(orderInfo, customerInfo, mode, orderType: string);
+procedure TFViewOrders.OrderEntry(orderInfo, customerInfo, mode, orderType: string);
 begin
   if orderType = 'corrugated' then
-    FViewMain.ViewOrderEntryCorrugated(orderInfo, customerInfo, mode, '')
+    begin
+      FViewMain.ViewOrderEntryCorrugated(orderInfo, customerInfo, mode, '');
+    end
   else if orderType = 'web' then
     FViewMain.ViewOrderEntryWeb(orderInfo, customerInfo, mode, '')
   else

kgOrdersClient/View.SelectCustomer.dfm

 object FSelectCustomer: TFSelectCustomer
   Width = 765
-  Height = 480
+  Height = 416
   OnCreate = WebFormCreate
   OnShow = WebFormShow
   object WebLabel1: TWebLabel
     Left = 8
-    Top = 81
+    Top = 27
     Width = 95
     Height = 15
     Caption = 'Search Customers'
@@ -14,7 +14,7 @@ object FSelectCustomer: TFSelectCustomer
   end
   object WebLabel2: TWebLabel
     Left = 279
-    Top = 81
+    Top = 27
     Width = 134
     Height = 15
     Caption = 'Selected Customer Name'
@@ -23,7 +23,7 @@ object FSelectCustomer: TFSelectCustomer
   end
   object WebLabel3: TWebLabel
     Left = 131
-    Top = 81
+    Top = 27
     Width = 113
     Height = 15
     Caption = 'Selected Customer ID'
@@ -32,7 +32,7 @@ object FSelectCustomer: TFSelectCustomer
   end
   object edtSearch: TWebEdit
     Left = 4
-    Top = 102
+    Top = 48
     Width = 121
     Height = 22
     ChildOrder = 2
@@ -42,7 +42,7 @@ object FSelectCustomer: TFSelectCustomer
   end
   object edtName: TWebEdit
     Left = 279
-    Top = 102
+    Top = 48
     Width = 142
     Height = 22
     ChildOrder = 1
@@ -52,7 +52,7 @@ object FSelectCustomer: TFSelectCustomer
   end
   object TMSFNCGrid1: TTMSFNCGrid
     Left = 0
-    Top = 163
+    Top = 99
     Width = 765
     Height = 317
     Align = alBottom
@@ -206,10 +206,11 @@ object FSelectCustomer: TFSelectCustomer
     ScrollMode = scmItemScrolling
     DesignTimeSampleData = True
     OnCellClick = TMSFNCGrid1CellClick
+    ExplicitTop = 163
   end
   object btnCancel: TWebButton
     Left = 556
-    Top = 101
+    Top = 47
     Width = 96
     Height = 25
     Caption = 'Cancel'
@@ -220,7 +221,7 @@ object FSelectCustomer: TFSelectCustomer
   end
   object btnConfirm: TWebButton
     Left = 440
-    Top = 101
+    Top = 47
     Width = 96
     Height = 25
     Caption = 'Select'
@@ -229,30 +230,9 @@ object FSelectCustomer: TFSelectCustomer
     WidthPercent = 100.000000000000000000
     OnClick = btnConfirmClick
   end
-  object edtNotification: TWebEdit
-    Left = 4
-    Top = 16
-    Width = 510
-    Height = 22
-    HelpType = htKeyword
-    TabStop = False
-    ChildOrder = 8
-    ElementFont = efCSS
-    Enabled = False
-    Font.Charset = ANSI_CHARSET
-    Font.Color = clRed
-    Font.Height = -13
-    Font.Name = 'Arial'
-    Font.Style = []
-    HeightPercent = 100.000000000000000000
-    HideSelection = False
-    ParentFont = False
-    TabOrder = 1
-    WidthPercent = 100.000000000000000000
-  end
   object edtID: TWebEdit
     Left = 131
-    Top = 102
+    Top = 48
     Width = 142
     Height = 22
     ChildOrder = 1

kgOrdersClient/View.SelectCustomer.html

-<html>
-  <head>
-    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
-    <title>TMS Web Project</title>
-    <style>
-    </style>
-  </head>
-  <body>
-  </body>
-</html>
+<div id="spinner" class="position-absolute top-50 start-50 translate-middle d-none">
+    <div class="lds-roller">
+        <div></div><div></div><div></div><div></div>
+        <div></div><div></div><div></div><div></div>
+    </div>
+</div>
\ No newline at end of file

kgOrdersClient/View.SelectCustomer.pas

@@ -21,7 +21,6 @@ type
     TMSFNCGrid1: TTMSFNCGrid;
     btnCancel: TWebButton;
     btnConfirm: TWebButton;
-    edtNotification: TWebEdit;
     XDataWebClient1: TXDataWebClient;
     xdwdsCustomers: TXDataWebDataSet;
     wdsCustomers: TWebDataSource;
@@ -78,7 +77,6 @@ end;
 
 procedure TFSelectCustomer.WebFormShow(Sender: TObject);
 begin
-  Utils.ShowSpinner('spinner');
   getCustomers();
 end;
 
@@ -90,7 +88,7 @@ end;
 procedure TFSelectCustomer.btnConfirmClick(Sender: TObject);
 begin
   if edtID.Text = '' then
-    edtNotification.Text := 'Please Select a Customer'
+    ShowToast('Please Select a Customer', 'danger')
   else
   begin
     xdwdsCustomers.Locate('Id', edtID.Text, []);
@@ -111,6 +109,7 @@ var
   i: integer;
 begin
   try
+    Utils.ShowSpinner('spinner');
     // Fetch data from XData service
     xdcResponse := await(XDataWebClient1.RawInvokeAsync('ILookupService.getQBCustomers', []));
     customerList := TJSObject(xdcResponse.Result);
@@ -126,7 +125,6 @@ begin
     on E: EXDataClientRequestException do
       Utils.ShowErrorModal('Could not retrieve QuickBooks customers: ' + E.ErrorResult.ErrorMessage);
   end;
-  Utils.HideSpinner('spinner');
 end;
 
 
@@ -165,6 +163,7 @@ begin
   finally
     TMSFNCGrid1.EndUpdate;
   end;
+  Utils.HideSpinner('spinner');
 end;
 
 procedure TFSelectCustomer.TMSFNCGrid1CellClick(Sender: TObject; ACol,

kgOrdersClient/View.SetStatus.dfm

 object FSetStatus: TFSetStatus
   Width = 640
-  Height = 361
+  Height = 278
   OnShow = WebFormShow
   object lblStatus1: TWebLabel
-    Left = 326
-    Top = 80
+    Left = 328
+    Top = 32
     Width = 38
     Height = 14
     Caption = 'Status:'
@@ -18,8 +18,8 @@ object FSetStatus: TFSetStatus
     WidthPercent = 100.000000000000000000
   end
   object WebLabel1: TWebLabel
-    Left = 484
-    Top = 80
+    Left = 486
+    Top = 32
     Width = 91
     Height = 14
     Caption = 'Date Completed:'
@@ -33,8 +33,8 @@ object FSetStatus: TFSetStatus
     WidthPercent = 100.000000000000000000
   end
   object WebLabel2: TWebLabel
-    Left = 14
-    Top = 80
+    Left = 16
+    Top = 32
     Width = 48
     Height = 14
     Caption = 'Order ID:'
@@ -48,8 +48,8 @@ object FSetStatus: TFSetStatus
     WidthPercent = 100.000000000000000000
   end
   object WebLabel3: TWebLabel
-    Left = 172
-    Top = 78
+    Left = 174
+    Top = 30
     Width = 57
     Height = 14
     Caption = 'Job Name:'
@@ -63,8 +63,8 @@ object FSetStatus: TFSetStatus
     WidthPercent = 100.000000000000000000
   end
   object WebLabel4: TWebLabel
-    Left = 11
-    Top = 142
+    Left = 13
+    Top = 94
     Width = 51
     Height = 14
     Caption = 'Ship Due:'
@@ -78,8 +78,8 @@ object FSetStatus: TFSetStatus
     WidthPercent = 100.000000000000000000
   end
   object WebLabel5: TWebLabel
-    Left = 169
-    Top = 142
+    Left = 171
+    Top = 94
     Width = 78
     Height = 14
     Caption = 'New Due Date:'
@@ -93,8 +93,8 @@ object FSetStatus: TFSetStatus
     WidthPercent = 100.000000000000000000
   end
   object lblMount: TWebLabel
-    Left = 324
-    Top = 200
+    Left = 326
+    Top = 152
     Width = 62
     Height = 14
     Caption = 'Mount Due:'
@@ -108,8 +108,8 @@ object FSetStatus: TFSetStatus
     WidthPercent = 100.000000000000000000
   end
   object lblMountNew: TWebLabel
-    Left = 482
-    Top = 200
+    Left = 484
+    Top = 152
     Width = 78
     Height = 14
     Caption = 'New Due Date:'
@@ -123,8 +123,8 @@ object FSetStatus: TFSetStatus
     WidthPercent = 100.000000000000000000
   end
   object lblPlate: TWebLabel
-    Left = 11
-    Top = 200
+    Left = 13
+    Top = 152
     Width = 54
     Height = 14
     Caption = 'Plate Due:'
@@ -138,8 +138,8 @@ object FSetStatus: TFSetStatus
     WidthPercent = 100.000000000000000000
   end
   object lblPlateNew: TWebLabel
-    Left = 169
-    Top = 200
+    Left = 171
+    Top = 152
     Width = 78
     Height = 14
     Caption = 'New Due Date:'
@@ -153,8 +153,8 @@ object FSetStatus: TFSetStatus
     WidthPercent = 100.000000000000000000
   end
   object lblArt: TWebLabel
-    Left = 324
-    Top = 142
+    Left = 326
+    Top = 94
     Width = 44
     Height = 14
     Caption = 'Art Due:'
@@ -168,8 +168,8 @@ object FSetStatus: TFSetStatus
     WidthPercent = 100.000000000000000000
   end
   object lblArtNew: TWebLabel
-    Left = 482
-    Top = 142
+    Left = 484
+    Top = 94
     Width = 78
     Height = 14
     Caption = 'New Due Date:'
@@ -183,8 +183,8 @@ object FSetStatus: TFSetStatus
     WidthPercent = 100.000000000000000000
   end
   object wlcbStatus: TWebLookupComboBox
-    Left = 326
-    Top = 100
+    Left = 328
+    Top = 52
     Width = 145
     Height = 22
     ElementClassName = 'custom-select'
@@ -194,8 +194,8 @@ object FSetStatus: TFSetStatus
     LookupValues = <>
   end
   object dtpDate: TWebDateTimePicker
-    Left = 484
-    Top = 100
+    Left = 486
+    Top = 52
     Width = 145
     Height = 22
     BorderStyle = bsSingle
@@ -206,8 +206,8 @@ object FSetStatus: TFSetStatus
     Text = ''
   end
   object btnConfirm: TWebButton
-    Left = 14
-    Top = 273
+    Left = 16
+    Top = 225
     Width = 96
     Height = 25
     Caption = 'Confirm'
@@ -222,8 +222,8 @@ object FSetStatus: TFSetStatus
     OnClick = btnConfirmClick
   end
   object btnCancel: TWebButton
-    Left = 125
-    Top = 273
+    Left = 127
+    Top = 225
     Width = 96
     Height = 25
     Caption = 'Cancel'
@@ -238,8 +238,8 @@ object FSetStatus: TFSetStatus
     OnClick = btnCancelClick
   end
   object edtOrderID: TWebEdit
-    Left = 14
-    Top = 100
+    Left = 16
+    Top = 52
     Width = 145
     Height = 22
     HelpType = htKeyword
@@ -259,31 +259,9 @@ object FSetStatus: TFSetStatus
     TabOrder = 1
     WidthPercent = 100.000000000000000000
   end
-  object edtNotification: TWebEdit
-    Left = 14
-    Top = 24
-    Width = 303
-    Height = 22
-    HelpType = htKeyword
-    TabStop = False
-    ChildOrder = 8
-    ElementClassName = 'form-control'
-    ElementFont = efCSS
-    Enabled = False
-    Font.Charset = ANSI_CHARSET
-    Font.Color = clBlack
-    Font.Height = -8
-    Font.Name = 'Arial'
-    Font.Style = []
-    HeightPercent = 100.000000000000000000
-    HideSelection = False
-    ParentFont = False
-    TabOrder = 1
-    WidthPercent = 100.000000000000000000
-  end
   object edtJobName: TWebEdit
-    Left = 172
-    Top = 100
+    Left = 174
+    Top = 52
     Width = 145
     Height = 22
     HelpType = htKeyword
@@ -304,8 +282,8 @@ object FSetStatus: TFSetStatus
     WidthPercent = 100.000000000000000000
   end
   object dtpShipDue: TWebDateTimePicker
-    Left = 11
-    Top = 162
+    Left = 13
+    Top = 114
     Width = 145
     Height = 22
     BorderStyle = bsSingle
@@ -317,8 +295,8 @@ object FSetStatus: TFSetStatus
     Text = ''
   end
   object dtpNewShipDue: TWebDateTimePicker
-    Left = 169
-    Top = 162
+    Left = 171
+    Top = 114
     Width = 145
     Height = 22
     BorderStyle = bsSingle
@@ -329,8 +307,8 @@ object FSetStatus: TFSetStatus
     Text = ''
   end
   object dtpMountDue: TWebDateTimePicker
-    Left = 324
-    Top = 220
+    Left = 326
+    Top = 172
     Width = 145
     Height = 22
     BorderStyle = bsSingle
@@ -342,8 +320,8 @@ object FSetStatus: TFSetStatus
     Text = ''
   end
   object dtpNewMountDue: TWebDateTimePicker
-    Left = 482
-    Top = 220
+    Left = 484
+    Top = 172
     Width = 145
     Height = 22
     BorderStyle = bsSingle
@@ -354,8 +332,8 @@ object FSetStatus: TFSetStatus
     Text = ''
   end
   object dtpPlateDue: TWebDateTimePicker
-    Left = 11
-    Top = 220
+    Left = 13
+    Top = 172
     Width = 145
     Height = 22
     BorderStyle = bsSingle
@@ -367,8 +345,8 @@ object FSetStatus: TFSetStatus
     Text = ''
   end
   object dtpNewPlateDue: TWebDateTimePicker
-    Left = 169
-    Top = 220
+    Left = 171
+    Top = 172
     Width = 145
     Height = 22
     BorderStyle = bsSingle
@@ -379,8 +357,8 @@ object FSetStatus: TFSetStatus
     Text = ''
   end
   object dtpArtDue: TWebDateTimePicker
-    Left = 324
-    Top = 162
+    Left = 326
+    Top = 114
     Width = 145
     Height = 22
     BorderStyle = bsSingle
@@ -392,8 +370,8 @@ object FSetStatus: TFSetStatus
     Text = ''
   end
   object dtpNewArtDue: TWebDateTimePicker
-    Left = 482
-    Top = 162
+    Left = 484
+    Top = 114
     Width = 145
     Height = 22
     BorderStyle = bsSingle

kgOrdersClient/View.SetStatus.pas

@@ -17,7 +17,6 @@ type
     btnCancel: TWebButton;
     WebLabel2: TWebLabel;
     edtOrderID: TWebEdit;
-    edtNotification: TWebEdit;
     edtJobName: TWebEdit;
     WebLabel3: TWebLabel;
     WebLabel4: TWebLabel;

kgOrdersClient/View.UserProfile.pas

@@ -57,35 +57,19 @@ begin
     Exit;
   end;
 
-  asm
-    var modal = document.getElementById('confirmation_modal');
-    var btnCancel = document.getElementById('btn_confirm_cancel');
-    var btnConfirm = document.getElementById('btn_confirm_delete');
-    var modalBody = document.getElementById('modal_body');
-    var self = this;
-
-    if (modal && btnCancel && btnConfirm && modalBody) {
-      modalBody.innerText = 'Are you sure you want to save changes to your profile?';
-      btnCancel.innerText = 'Cancel';
-      btnConfirm.innerText = 'Save';
-
-      if (modal.parentNode !== document.body) {
-        document.body.appendChild(modal);
-      }
-
-      var bsModal = new bootstrap.Modal(modal, { keyboard: false });
-      bsModal.show();
-
-      btnConfirm.onclick = function () {
-        self.EditUser();
-        bsModal.hide();
-      };
-    }
-  end;
+  ShowConfirmationModal(
+    'Are you sure you want to save changes to your profile?',
+    'Save',
+    'Cancel',
+    procedure(confirmed: Boolean)
+    begin
+      if confirmed then
+        EditUser;
+    end
+  );
 end;
 
 
-
 [async] procedure TFViewUserProfile.EditUser;
 var
   xdcResponse: TXDataClientResponse;
@@ -114,28 +98,33 @@ begin
 end;
 
 
-
 procedure TFViewUserProfile.btnCancelClick(Sender: TObject);
-var
-  xdcResponse: TXDataClientResponse;
-  userList: TJSObject;
-  data: TJSArray;
-  user: TJSObject;
 begin
+  ShowConfirmationModal(
+    'Are you sure you want to cancel all your changes?',
+    'Yes',
+    'No',
+    procedure(confirmed: Boolean)
+    begin
+      if confirmed then
+      begin
         GetUser();
-  showToast('Failure: Changes discarded');
+        ShowToast('Changes discarded', 'danger');
+      end;
+    end
+  );
 end;
 
+
 procedure TFViewUserProfile.WebFormShow(Sender: TObject);
 begin
   GetUser();
-
   //edtJwt.Text := TJSJSON.stringify(AuthService.TokenPayload);
   // View.UserProfile.WebFormShow
   chkAdminUser.Checked := SameText(string(AuthService.TokenPayload.Properties['user_admin']), 'true');
-
 end;
 
+
 procedure TFViewUserProfile.GetUser;
 var
   xdcResponse: TXDataClientResponse;

kgOrdersClient/View.Users.html

@@ -43,22 +43,5 @@
             </div>
         </div>
     </div>
-<!--</div> -->
-<!--</div>   -->
-<div class="modal fade" id="confirmation_modal" tabindex="-1" aria-labelledby="confirmation_modal_label" aria-hidden="true">
-  <div class="modal-dialog">
-    <div class="modal-content">
-      <div class="modal-header">
-        <h5 class="modal-title" id="confirmation_modal_label">Confirm</h5>
-        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-      </div>
-      <div class="modal-body">
-        Are you sure you want to make these changes?
-      </div>
-      <div class="modal-footer">
-        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
-        <button type="button" class="btn btn-primary" data-bs-dismiss="modal" id="btn_confirm_delete" >Confirm</button>
-      </div>
-    </div>
-  </div>
-</div>
+
+

kgOrdersClient/css/app.css

@@ -382,6 +382,15 @@ is-invalid .form-check-input {
   animation: slideInLeft 0.4s ease-out forwards;
 }
 
+#spinner {
+  position: fixed !important;
+  z-index: 9999 !important;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+
+
 
 
 

kgOrdersServer/Source/Lookup.ServiceImpl.pas

@@ -87,6 +87,7 @@ uses
   System.Generics.Collections,
   XData.Sys.Exceptions, uLibrary, rOrderWeb, rOrderCutting;
 
+
 procedure TLookupService.AfterConstruction;
 begin
   inherited;
@@ -94,12 +95,14 @@ begin
 
 end;
 
+
 procedure TLookupService.BeforeDestruction;
 begin
   ordersDB.Free;
   inherited;
 end;
 
+
 function TLookupService.DelShippingAddress(AddressID, CustomerID: string): TJSONObject;
 var
   SQL: string;
@@ -300,7 +303,6 @@ begin
 end;
 
 
-
 function TLookupService.AddShippingAddress(AddressInfo: string): TJSONObject;
 var
   JSONData: TJSONObject;
@@ -1686,7 +1688,7 @@ begin
     if ( JSONData.GetValue<string>('staff_fields_mount_due') <> '' ) and ( JSONData.GetValue<string>('staff_fields_mount_due') <> '12/30/1899' ) then
       AddStatusSchedule('MOUNT', JSONData, ORDER_ID);
 
-    addToRevisionsTable(intToStr(ORDER_ID), 'corrugated_plate_orders_revisions', JSONData);
+    AddToRevisionsTable(intToStr(ORDER_ID), 'corrugated_plate_orders_revisions', JSONData);
 
    if mode = 'ADD' then
       msg := 'Success: Order Successfully Added'
@@ -2239,25 +2241,22 @@ end;
 
 function TLookupService.delOrder(OrderID, orderType, UserID: string): TJSONObject;
 var
-  table: string;
-  table2: string;
-  sql: string;
-  CorrugatedOrder: TFullOrder;
-  WebOrder: TWebOrder;
-  CuttingDieOrder: TCuttingDie;
+  table, table2, SQL: string;
+  stream: TStringStream;
   DateFormat: TFormatSettings;
-  JSONData: TJSONObject;
+  JSONValue: TJSONValue;
+  JSONObject, DataObject, JSONData: TJSONObject;
   JSONArray: TJSONArray;
   Pair: TJSONPair;
   Field: TField;
-  mode: string;
-  stream: TStringStream;
-  RevisionID, rev_num: integer;
-  JSONValue: TJSONValue;
-  JSONObject: TJSONObject;
-  DataObject: TJSONObject;
+  RevisionID, rev_num, OrderIDInt: Integer;
 begin
   try
+    // Convert ORDER_ID to integer safely
+    OrderIDInt := StrToIntDef(OrderID, -1);
+    if OrderIDInt = -1 then
+      raise Exception.Create('Invalid OrderID: not a valid integer');
+
     if orderType = 'corrugated' then
     begin
       table := 'corrugated_plate_orders';
@@ -2274,64 +2273,58 @@ begin
       table2 := 'cutting_die_orders_revisions';
     end;
 
-    stream := TStringStream.Create('', TEncoding.UTF8);
-    DateFormat := TFormatSettings.Create;
-    DateFormat.ShortDateFormat := 'yyyy-mm-dd';
-    DateFormat.DateSeparator := '-';
-
-    //Update RevisionID
-    SQL := 'UPDATE idfield set KEYVALUE = KEYVALUE + 1 WHERE KEYNAME = ' + quotedStr('GEN_ORDER_REVISION_ID');
+    // Get new revision ID
+    SQL := 'UPDATE idfield SET KEYVALUE = KEYVALUE + 1 WHERE KEYNAME = ' + QuotedStr('GEN_ORDER_REVISION_ID');
     OrdersDB.UniQuery1.SQL.Text := SQL;
     OrdersDB.UniQuery1.ExecSQL;
 
-    //Retrieve updated RevisionID
-    SQL := 'select KEYVALUE from idfield where KEYNAME = ' + quotedStr('GEN_ORDER_REVISION_ID');
+    SQL := 'SELECT KEYVALUE FROM idfield WHERE KEYNAME = ' + QuotedStr('GEN_ORDER_REVISION_ID');
     doQuery(OrdersDB.UniQuery1, SQL);
     RevisionID := OrdersDB.UniQuery1.FieldByName('KEYVALUE').AsInteger;
 
-    // Convert Order into JSON
-    SQL := 'select * from ' + table + ' where ORDER_ID = ' + OrderID;
-    doQuery(ordersDB.UniQuery1, SQL);
+    // Fetch the order to archive it
+    SQL := 'SELECT * FROM ' + table + ' WHERE ORDER_ID = ' + IntToStr(OrderIDInt);
+    doQuery(OrdersDB.UniQuery1, SQL);
 
-    ordersDB.UniQuery1.SaveToJSON(stream);
+    stream := TStringStream.Create('', TEncoding.UTF8);
+    try
+      OrdersDB.UniQuery1.SaveToJSON(stream);
       stream.Position := 0;
-    JSONValue := TJSONObject.ParseJSONValue(Stream.DataString);
+      JSONValue := TJSONObject.ParseJSONValue(stream.DataString);
 
       if not Assigned(JSONValue) then
         raise Exception.Create('Invalid JSON content');
 
-    try
       if not (JSONValue is TJSONObject) then
         raise Exception.Create('Expected JSON object');
 
       JSONObject := TJSONObject(JSONValue);
 
-      // Get the "data" object
       if not JSONObject.TryGetValue('data', DataObject) then
         raise Exception.Create('Missing "data" object in JSON');
 
-      // Get the "rows" array
       if not DataObject.TryGetValue('rows', JSONArray) then
         raise Exception.Create('Missing "rows" array in JSON data');
 
-      JSONData := JSONArray.Items[0] as TJSONObject;
+      if JSONArray.Count = 0 then
+        raise Exception.Create('No order found with ORDER_ID = ' + IntToStr(OrderIDInt));
 
-      SQL := 'select max(REVISION_NUMBER) as rev_num from ' + table2 + ' where ORDER_ID = ' + orderID;
-      doQuery(ordersDB.UniQuery1, SQL);
-      rev_num := ordersDB.UniQuery1.FieldByName('rev_num').AsInteger + 1;
+      JSONData := JSONArray.Items[0] as TJSONObject;
 
-      SQL := 'select * from ' + table2 + ' where ORDER_ID = ' + orderID;
-      doQuery(ordersDB.UniQuery1, SQL);
+      // Get current max revision number
+      SQL := 'SELECT MAX(REVISION_NUMBER) AS rev_num FROM ' + table2 + ' WHERE ORDER_ID = ' + IntToStr(OrderIDInt);
+      doQuery(OrdersDB.UniQuery1, SQL);
+      rev_num := OrdersDB.UniQuery1.FieldByName('rev_num').AsInteger + 1;
 
-      doQuery(ordersDB.UniQuery1, SQL);
-      try
-        ordersDB.UniQuery1.Insert;
+      // Insert into revisions
+      SQL := 'SELECT * FROM ' + table2 + ' WHERE ORDER_ID = ' + IntToStr(OrderIDInt);
+      doQuery(OrdersDB.UniQuery1, SQL);
+      OrdersDB.UniQuery1.Insert;
       for Pair in JSONData do
       begin
-          Field := ordersDB.UniQuery1.FindField(Pair.JsonString.Value); // Checks if the field exists in the dataset
+        Field := OrdersDB.UniQuery1.FindField(Pair.JsonString.Value);
         if Assigned(Field) then
         begin
-          // handles any dates or datetimes
           if (Field is TDateTimeField) and (Pair.JsonValue.Value <> '') then
             TDateTimeField(Field).AsDateTime := ISO8601ToDate(Pair.JsonValue.Value, False)
           else if Pair.JsonValue.Value <> '' then
@@ -2339,32 +2332,33 @@ begin
         end;
       end;
 
-        ordersDB.UniQuery1.FieldByName('ORDER_ID').AsString := OrderID;
-        ordersDB.UniQuery1.FieldByName('ORDER_STATUS').AsString := 'DELETED';
-        ordersDB.UniQuery1.FieldByName('REVISION_NUMBER').AsInteger := 1;
-        ordersDB.UniQuery1.FieldByName('ORDER_REVISION_ID').AsInteger := RevisionID;
-        ordersDB.UniQuery1.FieldByName('REVISION_USER_ID').AsString := UserID;
-        // Post the record to the database
-        ordersDB.UniQuery1.Post;
+      OrdersDB.UniQuery1.FieldByName('ORDER_ID').AsInteger := OrderIDInt;
+      OrdersDB.UniQuery1.FieldByName('ORDER_STATUS').AsString := 'DELETED';
+      OrdersDB.UniQuery1.FieldByName('REVISION_NUMBER').AsInteger := rev_num;
+      OrdersDB.UniQuery1.FieldByName('ORDER_REVISION_ID').AsInteger := RevisionID;
+      OrdersDB.UniQuery1.FieldByName('REVISION_USER_ID').AsString := UserID;
+      OrdersDB.UniQuery1.Post;
 
-        Result := TJSONObject.Create.AddPair('status', 'success');
-        Result.AddPair('OrderID', OrderID);
-        TXDataOperationContext.Current.Handler.ManagedObjects.Add(Result);
-      except
-        on E: Exception do
-        begin
-          Result := TJSONObject.Create.AddPair('error', E.Message);
-        end
-      end;
     finally
-      JSONData.Free;
+      stream.Free;
+      JSONValue.Free;
     end;
-    sql := 'delete from ' + table + ' where ORDER_ID = ' + OrderID;
+
+    // Delete from order tables
+    SQL := 'DELETE FROM ' + table + ' WHERE ORDER_ID = ' + IntToStr(OrderIDInt);
     OrdersDB.UniQuery1.SQL.Text := SQL;
     OrdersDB.UniQuery1.ExecSQL;
-    sql := 'delete from orders where ORDER_ID = ' + OrderID;
+
+    SQL := 'DELETE FROM orders WHERE ORDER_ID = ' + IntToStr(OrderIDInt);
     OrdersDB.UniQuery1.SQL.Text := SQL;
     OrdersDB.UniQuery1.ExecSQL;
+
+    // Return result
+    Result := TJSONObject.Create;
+    Result.AddPair('status', 'success');
+    Result.AddPair('OrderID', IntToStr(OrderIDInt));
+    TXDataOperationContext.Current.Handler.ManagedObjects.Add(Result);
+
   except
     on E: Exception do
     begin

kgOrdersServer/kgOrdersServer.ini

@@ -5,8 +5,8 @@ webClientVersion=0.9.6
 LogFileNum=819
 
 [Database]
-Server=192.168.159.144
---Server=192.168.102.130
+--Server=192.168.159.153
+Server=192.168.102.130
 --Server=192.168.75.133
 Database=kg_order_entry
 Username=root