diff --git a/client/src/containers/Customers/CustomerFinancialPanel.js b/client/src/containers/Customers/CustomerFinancialPanel.js
index 295479938..7c8da19d3 100644
--- a/client/src/containers/Customers/CustomerFinancialPanel.js
+++ b/client/src/containers/Customers/CustomerFinancialPanel.js
@@ -3,6 +3,7 @@ import classNames from 'classnames';
 import { FormGroup, Position, Classes, ControlGroup } from '@blueprintjs/core';
 import { DateInput } from '@blueprintjs/datetime';
 import { FastField, ErrorMessage } from 'formik';
+import moment from 'moment';
 import {
   MoneyInputGroup,
   InputPrependText,
@@ -27,7 +28,6 @@ function CustomerFinancialPanel({
 
   customerId,
 }) {
-
   return (
     <div className={'tab-panel--financial'}>
       <Row>
@@ -44,6 +44,12 @@ function CustomerFinancialPanel({
               >
                 <DateInput
                   {...momentFormatter('YYYY/MM/DD')}
+                  onChange={(date) => {
+                    form.setFieldValue(
+                      'opening_balance_at',
+                      moment(date).format('YYYY-MM-DD'),
+                    );
+                  }}
                   value={tansformDateValue(value)}
                   popoverProps={{ position: Position.BOTTOM, minimal: true }}
                   disabled={customerId}
diff --git a/client/src/containers/Vendors/VendorFinanicalPanelTab.js b/client/src/containers/Vendors/VendorFinanicalPanelTab.js
index 86929939e..095ac72b6 100644
--- a/client/src/containers/Vendors/VendorFinanicalPanelTab.js
+++ b/client/src/containers/Vendors/VendorFinanicalPanelTab.js
@@ -3,6 +3,7 @@ import classNames from 'classnames';
 import { FormGroup, ControlGroup, Position, Classes } from '@blueprintjs/core';
 import { DateInput } from '@blueprintjs/datetime';
 import { FastField, ErrorMessage } from 'formik';
+import moment from 'moment';
 import {
   MoneyInputGroup,
   InputPrependText,
@@ -47,6 +48,12 @@ function VendorFinanicalPanelTab({
               >
                 <DateInput
                   {...momentFormatter('YYYY/MM/DD')}
+                  onChange={(date) => {
+                    form.setFieldValue(
+                      'opening_balance_at',
+                      moment(date).format('YYYY-MM-DD'),
+                    );
+                  }}
                   value={tansformDateValue(value)}
                   popoverProps={{ position: Position.BOTTOM, minimal: true }}
                   disabled={vendorId}
@@ -72,7 +79,7 @@ function VendorFinanicalPanelTab({
                 inline={true}
               >
                 <ControlGroup>
-                  <InputPrependText text={values.currency_code } />
+                  <InputPrependText text={values.currency_code} />
                   <MoneyInputGroup
                     value={value}
                     onChange={field.onChange}