First question on UX, so let me know if need to add more details.
I have a budget module where user can add budget detail and later they can edit those detail.
Budget Add Page
So this form is simple, user has to fill basic details, upload files then they can select the fiscal year and related pricing year. After that they can add products and fill-up the details like Quantity/Rates for all months (i.e. Jan to Dec).
As per user experience this form is not causing any issue.
Budget Edit Page
Now the issue is in above form. There is three aspects.
1) User can add new fiscal year and related pricing year then associated budget detail.
- For this user has to click on save button
- Newly added products or newly added fiscal year and related data will be stored.
2) User can edit the already added product details.
- To edit the product, user can click on "Update" button. Which will open the form and then user can edit that product detail in that popup. Popup has its own "Save" button on click of that it will directly store the daa in DB (Using ajax). (No need to click on "Save" button which is in Form level)
3) User can directly delete the whole fiscal year box.
- Same as edit, on click of delete icon, data will be directly deleted from DB using ajax request. (i.e. on click of delete, it asks for confirmation that this action is irreversible.)
Now some user has difficulty to use this form. i.e.They are adding the Product and thought that it got saved in DB. But it will store into DB only if they will click on "Save" button.
So question is how i can visibly show that For edit/delete it's not required to click on "Save" button. But if they are adding new product or new fiscal year then they have to click the "Save" button?