Saving modified list of items in web application

I am working on a web application. In one page user modifies course list of a selected class. User can assign courses and remove already assigned courses by clicking plus/minus icons. These modifications are saved after user presses save button.

My question is how should i post this data as json to server? And how should i handle if there is an error on removing item? (because of database constraints). What i have in my mind: (let's say math is added and music is removed)

Posting data:

1. Post final state of list as is. Then on the server find deleted ones by comparing with old data (which can be pulled from db) then delete them. Insert new ones which don't have ids. [{"id":null,"name":"Math","courseId":3}]
2. Mark deleted ones in the list. [{"id":1,"name":"Music","courseId":2,"deleted":true},{"id":null,"name":"Math","courseId":3}]
3. Add deleted ones to seperate array.{courses:[{"id":null,"name":"Math","courseId":3}], "deletedCoursesIds":[1]}

Handling Error

1. Start transaction. If constraints error occurs, send error to user and don't save anything, rollback.
2. Start transaction. First insert newly added courses safely. Commit transaction. Then try to delete courses and if error occurs send error and latest state of modified list to user.

There should be real world cases, examples like my problem but i couldn't found any. Is there any opensource projects i can explore, you can guide me to them.