diff --git a/apps/client/src/widgets/view_widgets/table_view/relation_editor.ts b/apps/client/src/widgets/view_widgets/table_view/relation_editor.ts
new file mode 100644
index 000000000..4f4f17f52
--- /dev/null
+++ b/apps/client/src/widgets/view_widgets/table_view/relation_editor.ts
@@ -0,0 +1,39 @@
+import { CellComponent } from "tabulator-tables";
+
+export default function RelationEditor(cell: CellComponent, onRendered, success, cancel, editorParams){
+    //cell - the cell component for the editable cell
+    //onRendered - function to call when the editor has been rendered
+    //success - function to call to pass thesuccessfully updated value to Tabulator
+    //cancel - function to call to abort the edit and return to a normal cell
+    //editorParams - params object passed into the editorParams column definition property
+
+    //create and style editor
+    var editor = document.createElement("input");
+
+    editor.setAttribute("type", "date");
+
+    //create and style input
+    editor.style.padding = "3px";
+    editor.style.width = "100%";
+    editor.style.boxSizing = "border-box";
+
+    //Set value of editor to the current value of the cell
+    editor.value = cell.getValue();
+
+    //set focus on the select box when the editor is selected
+    onRendered(function(){
+        editor.focus();
+        editor.style.css = "100%";
+    });
+
+    //when the value has been set, trigger the cell to update
+    function successFunc(){
+        success("Hi");
+    }
+
+    editor.addEventListener("change", successFunc);
+    editor.addEventListener("blur", successFunc);
+
+    //return the editor element
+    return editor;
+};