Image Field Clearing when deleting Repeatable Area

I have a template which contains the following:

<div class="class_staff_area <perch:content id="classnamestyle" type="select" label="Class Name"
options="eyfs, yearone, yeartwo" allowempty="true" required="false" suppress="false"/>">


<h2><perch:content id="teachertype" type="text" label="Staff Type Heading" required="true" title="true" /></h2>

<perch:repeater id="class_staff" label="Staff Photos"> 

<div class="staffmemberbox">
 <perch:if exists="staffmember">
    <a href="<perch:content id="page" type="pagelist" label="Page" />">
    <span>
    <img src="<perch:content type="image" id="staffmember" label="staffimage" width="200" height="300" crop="true" bucket="staffphotos"/>" alt="teacher" /> </span></a>
    </perch:if>
<perch:if exists="teachernamephoto">
    <span class="staffmembertext">
    <h3><perch:content id="teachernamephoto" type="text" label="Teacher Name" required="false" title="false" /></h3>
<p><perch:content id="classdesc" type="text" label="Class Desc" required="false" /></p></span>
</perch:if>

</div>
</perch:repeater>



<table class="table table-hover">
                <tbody><tr>
                  <td><perch:content id="columnoneheading" type="text" label="Column One Heading" required="false" /></td>
                  <td><perch:content id="columntwoheading" type="text" label="Column Two Heading" required="false" /></td>
                  <td><perch:content id="columnthreeheading" type="text" label="Column Three Heading" required="false" /></td>
                  <td><perch:content id="columnfourheading" type="text" label="Column Four Heading" required="false" /></td>
                </tr>


<perch:repeater id="class_details" label="Staff Details"> 
                <tr>
                  <td><perch:content id="classname" type="text" label="Class Name" required="false" /></td>
                  <td><perch:content id="teachername" type="text" label="Teacher Name" required="false"/></td>
                  <td><perch:content id="teacherassistant" type="text" label="Assistant Name" required="false"/></td>
                  <td><perch:content id="extrastaffname" type="text" label="Extra Staff Name" required="false"/></td>
                </tr>
  </perch:repeater>

  </tbody></table>

</div>     

This is used to add staff members to a class page of a school website. Everything worked fine and I have added 10 staff members. When my client removed one of the existing teachers in the repeater id ="class_staff" then clicked save, the remaining 9 staff members all had the image field cleared, leaving them with no profile picture. I have tested this and this keeps happening and so I have to add all the profile photos again. Am I doing something wrong in the template above or could this be an error with perch.

regards

Richard