The controls at the top of the form set the common items for this transaction: the bank account to which the deposit is going, the date of the deposit, and the accounting period (we never mix deposits to different accounts or dates, so we can leave all this outside of the grid to be set once for the entire batch).
The Master grid is at the top; the Details the wider one below.
Both grids are, of course, still empty at this point. When you click on the Add button on the Master grid, the edit form pops up and you get to add the details of the Bank side of this transaction.

In this example, we are leaving the By: field empty because we know, by looking at the cheque stub, that the payment is for two invoices - and if we know the invoice we can fill in the client name automatically.
When we click on submit, the form disappears and the contents are shown in the Master grid, like this:

The background on this example is greyed out because as soon as the Bank side form disappears, the Distribution side form appears automatically, looking like this (which was moved in the shot above so we could see the contents of the grid):

So now we fill in the distribution side, and as soon as we leave the Invoice field, an ajax call retrieves what we know about this invoice and fills in the fields that are required, disables the ones we don't want changed, and hides the one that is no longer required. Had we left the invoice field empty, some of the fields that were completed automatically here would have disappeared and others would have become required (if we don't have an invoice the operator has to specify both the account and the amount, and may want to enter a comment).

When we submit this record, the contents of the form are shown in the Details grid and, because this transaction is not yet in balance, continues to show the Distribution side form (moved in the next shot so we can see the grid contents.

When we have completed this form as well, if the transaction is in balance the entry form disappears and the buttons below the Details grid change to allow saving. Notice the By column in the Master grid has also been populated.

When we click save (and if the save is successful), the fields at the top of the form are disabled (so that we cannot mess with the common data), the Batch number is populated, new options appear to produce the Deposit slip to take to the bank and to print an Audit trail, the Details disappear (but will come back if we click on the transaction in the Master grid) and the Save and Cancel buttons disappear as they are no longer required.

We are now ready to click on the Add button on the Master grid to add another transaction to this batch. When we are done, the deposit items will be listed in the Master grid; if we select any item there, the associated distribution entries are shown in the Details grid.
Next, look at the HTML that defines this page and all that is on it.