Help needed: Restrict a usergroup from editing information of only another specific usergroup

Help needed: Restrict a usergroup from editing information of only another specific usergroup
We want to allow Principals to change various fields on the staff information page of employees under them, but not of their fellow principals at that school.

ie) A principal should be able to change the staff type, active status, etc of a guidance counsellor at their school, but not of the other principal.

We considered hiding the field based on the employee's usergroup using JS, but of course that would allow savvy individuals to unhide it.

Can anyone provide or point to an example of a better method?

(perhaps using an IF to examine a posted frn before the page loads?)