vinchent/udemy-go-web-1
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Sending AJAX post and generalizing the custom function

Browse Source
This commit is contained in:
Muyao CHEN 2024-06-30 16:37:57 +02:00
parent e18849331c
commit eca62e2e7b
3 changed files with 29 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
cmd/web/routes.go
View File

@ -24,7 +24,7 @@ func routes(app *config.AppConfig) http.Handler {
mux.Get("/majors-suite", handlers.Repo.Majors) mux.Get("/majors-suite", handlers.Repo.Majors)
mux.Get("/availability", handlers.Repo.Availability) mux.Get("/availability", handlers.Repo.Availability)
mux.Post("/availability", handlers.Repo.PostAvailability) mux.Post("/availability", handlers.Repo.PostAvailability)
mux.Get("/availability-json", handlers.Repo.AvailabilityJSON) mux.Post("/availability-json", handlers.Repo.AvailabilityJSON)
mux.Get("/make-reservation", handlers.Repo.MakeReservation) mux.Get("/make-reservation", handlers.Repo.MakeReservation)
fileServer := http.FileServer(http.Dir("./static/")) fileServer := http.FileServer(http.Dir("./static/"))

15
templates/base.layout.tmpl
View File

@ -184,17 +184,14 @@
focusConfirm: false, focusConfirm: false,
showCancelButton: true, showCancelButton: true,
willOpen: () => { willOpen: () => {
const elem = document.getElementById('reservation-dates-modal') if (c.willOpen !== undefined) {
const rp = new DateRangePicker(elem, { c.willOpen();
"format": "yyyy-mm-dd", }
showOnFocus: true,
});
}, },
didOpen: () => { didOpen: () => {
return [ if (c.didOpen !== undefined) {
document.getElementById('start').removeAttribute("disabled"), c.didOpen();
document.getElementById('end').removeAttribute("disabled"), }
]
}, },
preConfirm: () => { preConfirm: () => {
return [ return [

24
templates/generals.page.tmpl
View File

@ -32,7 +32,7 @@
<script> <script>
document.getElementById("check-availability").addEventListener('click', () => { document.getElementById("check-availability").addEventListener('click', () => {
let html = ` let html = `
<form action="reservation.html" method="get" novalidate class="needs-validation"> <form id="check-availability-form" action="/availability-json" method="post" novalidate class="needs-validation">
<div id="reservation-dates-modal" class="row"> <div id="reservation-dates-modal" class="row">
<div class="col mb-3"> <div class="col mb-3">
<input disabled required type="text" class="form-control" name="start" id="start" placeholder="Arrival"> <input disabled required type="text" class="form-control" name="start" id="start" placeholder="Arrival">
@ -46,10 +46,30 @@
Prompt().custom({ Prompt().custom({
title: "Choose your dates", title: "Choose your dates",
msg: html, msg: html,
willOpen: () => {
const elem = document.getElementById('reservation-dates-modal')
const rp = new DateRangePicker(elem, {
"format": "yyyy-mm-dd",
showOnFocus: true,
});
},
didOpen: () => {
return [
document.getElementById('start').removeAttribute("disabled"),
document.getElementById('end').removeAttribute("disabled"),
]
},
callback: (result) => { callback: (result) => {
console.log(result); console.log(result);
fetch('/availability-json') const formElem = document.getElementById("check-availability-form");
let formData = new FormData(formElem);
formData.append("csrf_token", "{{.CSRFToken}}");
fetch('/availability-json', {
method: "post",
body: formData,
})
.then(response => response.json()) .then(response => response.json())
.then(data => { .then(data => {
console.log(data); console.log(data);