diff --git a/package-lock.json b/package-lock.json index f601cf4..76c8ed8 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12486,6 +12486,11 @@ "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.9.tgz", "integrity": "sha512-nQTTcUu+ATDbrSD1BZHr5kgSD4oF8OFjxun8uAaL8RwPBacGBNPf/yAuVVdx17N8XNzRDMrZ9XcKZHCjPW+9ew==" }, + "react-global-key-down-hook": { + "version": "0.2.1", + "resolved": "https://registry.npmjs.org/react-global-key-down-hook/-/react-global-key-down-hook-0.2.1.tgz", + "integrity": "sha512-7bi/jJlD6VlRird5VJTKow3q28pWn6H36zhOzBmKGgklAdEjqqwyjX0vxBcHlohd08VcUUBiLxRJ/7oz3IZOiQ==" + }, "react-is": { "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", diff --git a/package.json b/package.json index 35f3dec..195dd99 100644 --- a/package.json +++ b/package.json @@ -14,6 +14,7 @@ "react": "^17.0.2", "react-bootstrap-icons": "^1.5.0", "react-dom": "^16.14.0", + "react-global-key-down-hook": "^0.2.1", "react-modal": "^3.14.3", "react-router": "^5.2.0", "react-router-dom": "^5.2.0", diff --git a/src/App.js b/src/App.js index 455cb71..3ba46f6 100644 --- a/src/App.js +++ b/src/App.js @@ -2,9 +2,10 @@ import './reset.css'; // Generic reset import './style.css'; // The new new import React, {useState,useEffect,useRef,useReducer} from 'react'; +import useGlobalKeyDown from 'react-global-key-down-hook' import Modal from 'react-modal' -import {XSquare, XSquareFill} from 'react-bootstrap-icons' +import {XSquare, XSquareFill, PlusCircle} from 'react-bootstrap-icons' import { HashRouter, @@ -375,18 +376,32 @@ function InputBox(p) { const [failed,setFailed] = useState(false) const [sending,setSending] = useState(false) - function changeFunc(f){setValue(f.currentTarget.value)} + function changeFunc(f){setValue(f.currentTarget.value) + if (p.callback4) { + p.callback4(f.currentTarget.value) + }} function blurFunc(f){ - setSending(true) - setFailed(false) - p.callback(f.currentTarget.value) - .then(()=>{setFailed(false)}) - .catch(()=>{setFailed(true)}) - .then(()=>{setSending(false)})} - - return p.data?:{keydownFunc(f)}} onChange={(f)=>{changeFunc(f)}} onBlur={(f)=>{blurFunc(f)}}/> } function TableEditor(p) { @@ -411,12 +426,17 @@ function TableEditor(p) { function SubmitBoxes() { axios.post(BACKEND_URL+p.path,submitVals) .then(()=>{ + setSubmitVal("Clear") setUpdate(true) }) .catch((err)=>{ alert(JSON.stringify(err.response.data)) }) } + + useGlobalKeyDown(()=>{ + SubmitBoxes() + },['Enter']) useEffect(()=>{ setUpdate(true) @@ -456,7 +476,6 @@ function TableEditor(p) { {!loading?
@@ -464,6 +483,8 @@ function TableEditor(p) { | |
---|---|
{fields.map((col,i)=> | { | )}
| )}|
{fields.map((col,i)=> | {{setSubmitVal({field:col.name,value:f.currentTarget.value});SubmitBoxes();document.getElementById("submitField0").focus()}:(f)=>{setSubmitVal({field:col.name,value:f.currentTarget.value})}}/>} | )}