diff --git a/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx b/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx
index 4200fd3a..eb5c1ddb 100644
--- a/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx
+++ b/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx
@@ -2,8 +2,10 @@ import { monthsToTitleCase } from "../../../Util";
 
 const EditPayModifier = ({ data, onInputChange }) => {
   return (
-    data.length > 0 && (
-      <div className="govuk-form-group">
+    data.length > 0 &&
+    data.map((row, index) => (
+      <div className="govuk-form-group" key={index}>
+        {console.log(row)}
         <table className="govuk-table">
           <thead className="govuk-table__head">
             <tr className="govuk-table__row">
@@ -18,7 +20,7 @@ const EditPayModifier = ({ data, onInputChange }) => {
           </thead>
           <tbody className="govuk-table__body">
             <tr className="govuk-table__row">
-              {data[0].pay_modifiers.map((value, index) => {
+              {row.pay_modifiers.map((value, index) => {
                 return (
                   <td className="govuk-table__cell" key={index}>
                     <input
@@ -28,7 +30,7 @@ const EditPayModifier = ({ data, onInputChange }) => {
                       type="number"
                       defaultValue={value}
                       onChange={(e) =>
-                        onInputChange(data[0].id, index, e.target.value)
+                        onInputChange(row.id, index, e.target.value)
                       }
                     ></input>
                   </td>
@@ -38,7 +40,7 @@ const EditPayModifier = ({ data, onInputChange }) => {
           </tbody>
         </table>
       </div>
-    )
+    ))
   );
 };
 
diff --git a/front_end/src/Components/EditPayroll/api.js b/front_end/src/Components/EditPayroll/api.js
index 751d265a..7fed9dc6 100644
--- a/front_end/src/Components/EditPayroll/api.js
+++ b/front_end/src/Components/EditPayroll/api.js
@@ -57,8 +57,8 @@ export function getPayModifierData() {
 /**
  * Post modified pay modifiers data.
  *
- * @param {types.PayModifierData[]} payModifierData - Vacancy data to be sent.
- * @returns {import("../../Util").PostDataResponse} Updated vacancy data received.
+ * @param {types.PayModifierData[]} payModifierData - Pay modifier data to be sent.
+ * @returns {import("../../Util").PostDataResponse} Updated pay modifier data received.
  */
 export function postPayModifierData(payModifierData) {
   return postData(
diff --git a/front_end/src/Components/EditPayroll/types.js b/front_end/src/Components/EditPayroll/types.js
index 39216fb5..6f789cc4 100644
--- a/front_end/src/Components/EditPayroll/types.js
+++ b/front_end/src/Components/EditPayroll/types.js
@@ -27,7 +27,7 @@
 
 /**
  * @typedef {Object} PayModifierData
- * @property {string} id - The pay modifier's pk.
+ * @property {number} id - The pay modifier's pk.
  * @property {float[]} pay_modifiers - The pay modifier's monthly percentages
  */