diff --git a/src/main/resources/static/html/mock.html b/src/main/resources/static/html/mock.html
index 3ca70c1..1bdf5b1 100644
--- a/src/main/resources/static/html/mock.html
+++ b/src/main/resources/static/html/mock.html
@@ -99,7 +99,7 @@
                                     <tr>
                                         <td><input id="headerKeyInput" placeholder="name"></td>
                                         <td><input id="headerValueInput" placeholder="value"></td>
-                                        <td><button class="modification-button btn-add"><i class="icon-plus"></i></button></td>
+                                        <td><button id="btn-newRow" class="modification-button btn-add"><i class="icon-plus"></i></button></td>
                                     </tr>
                                 </table>
                             </div>
diff --git a/src/main/resources/static/js/datatransfer.js b/src/main/resources/static/js/datatransfer.js
index 9641794..115f619 100644
--- a/src/main/resources/static/js/datatransfer.js
+++ b/src/main/resources/static/js/datatransfer.js
@@ -251,6 +251,20 @@ function addRow(key, value){
     headerMap.html(headersMapHtml);
 }
 
+const newRowInput = function(){
+    const hName = $('#headerKeyInput').val();
+    const hValue = $('#headerValueInput').val();
+    if(checkIfInputValid(hName) && checkIfInputValid(hValue)){
+        addRow(hName, hValue);
+    }
+}
+
+$('#btn-newRow').click(newRowInput);
+
+function checkIfInputValid(input){
+    return !(input == '' || input == null || input == undefined);
+}
+
 function buildRowHtml(key, value){
     return '' + 
     '<tr>' +
diff --git a/target/classes/static/html/mock.html b/target/classes/static/html/mock.html
index 3ca70c1..1bdf5b1 100644
--- a/target/classes/static/html/mock.html
+++ b/target/classes/static/html/mock.html
@@ -99,7 +99,7 @@
                                     <tr>
                                         <td><input id="headerKeyInput" placeholder="name"></td>
                                         <td><input id="headerValueInput" placeholder="value"></td>
-                                        <td><button class="modification-button btn-add"><i class="icon-plus"></i></button></td>
+                                        <td><button id="btn-newRow" class="modification-button btn-add"><i class="icon-plus"></i></button></td>
                                     </tr>
                                 </table>
                             </div>
diff --git a/target/classes/static/js/datatransfer.js b/target/classes/static/js/datatransfer.js
index 9641794..115f619 100644
--- a/target/classes/static/js/datatransfer.js
+++ b/target/classes/static/js/datatransfer.js
@@ -251,6 +251,20 @@ function addRow(key, value){
     headerMap.html(headersMapHtml);
 }
 
+const newRowInput = function(){
+    const hName = $('#headerKeyInput').val();
+    const hValue = $('#headerValueInput').val();
+    if(checkIfInputValid(hName) && checkIfInputValid(hValue)){
+        addRow(hName, hValue);
+    }
+}
+
+$('#btn-newRow').click(newRowInput);
+
+function checkIfInputValid(input){
+    return !(input == '' || input == null || input == undefined);
+}
+
 function buildRowHtml(key, value){
     return '' + 
     '<tr>' +