Within my AngularJS application, I have implemented a master detail form for handling transactions. The form consists of standard master data fields such as Name and Type, along with a detailed section that allows users to add and delete multiple lines. Each line in the detail section includes input fields for Credit, Debit, and Account Number. Utilizing the ng-form directive, I have successfully added validations to both the master and detail portions of the form.
In my current form setup, there is an existing Add Row button that enables users to add rows to the detail section manually. However, I now face a unique requirement where a new row should be automatically added when a user begins entering data in the last row. While I have achieved this functionality using the ng-focus directive, the next part of the requirement involves removing the last row from the validation context if it remains unused (not dirty) during form submission.
I am seeking guidance on how to accomplish this task within AngularJS. Please refer to the code snippet available on Plunkr at this link, and provide assistance on how I can exclude the last row of the detail section from the validation process if it is not modified.