Archived
54 lines
1.9 KiB
JavaScript
54 lines
1.9 KiB
JavaScript
import react, { useState, useEffect, } from "react";
|
|
import { useParams, useHistory } from "react-router-dom/cjs/react-router-dom.min";
|
|
import { getGames } from "./GameManager";
|
|
import { putEvents } from "./EventManager";
|
|
|
|
export const UpdateEvent = (props) => {
|
|
const [gameList, setGameList] = useState([])
|
|
let { id } = useParams()
|
|
const history = useHistory()
|
|
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
getGames().then(data => setGameList(data))
|
|
},
|
|
[]
|
|
)
|
|
|
|
// Still need to write out this form and figure out controlled/uncontrolled input for it. Event pk value needs to be passed to the form as props if I'm understanding this correctly
|
|
const eventupdateform = () => {
|
|
return(
|
|
<>
|
|
<h2>Update Event</h2>
|
|
<form id="editeventform">
|
|
<input type="text" id="event_id" disabled hidden value={id} ></input>
|
|
<label for="description">Event Description</label>
|
|
<input type="text" id="description"></input>
|
|
<label for="games">Select Game</label>
|
|
<select name="games" form_id="editeventform">
|
|
<option selected disabled hidden >Select a Game</option>
|
|
{gameList.map(
|
|
(gameList) => <option>{gameList.title}</option>
|
|
)
|
|
}
|
|
</select>
|
|
<label for="eventdate">Updated Event Date</label>
|
|
<input type="date" id="eventdate"></input>
|
|
<label for="eventtime">Updated Event Time</label>
|
|
<input type="time" id="eventtime"></input>
|
|
<input type="submit" onClick={(evt)=> putEvents(evt)} onSubmit={()=> history.push("/")}></input>
|
|
</form>
|
|
|
|
</>
|
|
// How to associate the event id with the form?
|
|
// Rough form completed, need to change input type to be controlled by React. Import putEvents and then worry about getting state to be controlled by React.
|
|
)
|
|
}
|
|
return(
|
|
eventupdateform()
|
|
)
|
|
}
|
|
|