How should i design two level insert for mobile application with better UX?
I want to add the contact in contact management. Adding Contact is having two levels insert. Adding contact is level 1 and adding products for that contact is level 2.
Flow for level 1 To contact admin has to give the user name and Phone number or product mapping if want to give. (Refer Image)
Flow for level 2 We have to map or add product for that contact. For adding or mapping product you have to select the product name and its prize.
- Default there will be no insert template only heading and the button will be present.
- As you click on the button one insert template will appear and the button will become disabled. Now you have to fill the value for insert template. As you fill the values then the button will become enabled. Now you can add more product by following the same procedure. As you click on button "Map product" then the previous filled value will become a label value.(Refer Image)
How can I make better UX?
Problem - We have used "Map Product" button to add more insert template which does not feel good for UX.