HTMX edge cases: hx-get khi không có hx-target và Golang

Thường hx-get =”” được dùng thay thế cho action và method trong form. Điểm đáng lưu ý là nếu không gán hx-target thì nó sẽ không hoạt động giống như action và method=”get” trong form. Cụ thể: nó sẽ không điều hướng sang route đã thiết lập trong hx-get=”/newroute”.

Nguyên nhân: Nếu bạn đặt hx-get mà không có hx-target, HTMX sẽ mặc định thay thế toàn bộ phần tử đã kích hoạt yêu cầu, thay vì toàn bộ trang.

Đây là một ví dụ rất cool về việc load html dùng với GET :-)), thay vì điều hướng tới route theo action và method của form theo cách “native”, htmx (ở đây dùng ht-get” có thể “điều hướng” linh hoạt hơn với h-target khi đặt trong form.

func (app *Controller) AssessPhoneticsExam(w http.ResponseWriter, r *http.Request) {
	tmpl := template.Must(template.New("exam").Parse(`		
			<h1>{{.Title}}</h1>
			<p>Exam results will be displayed here.</p>		
			{{.Done}}
	`))
	data := struct {
		Title string
		Done  string
	}{
		Title: "Phonetics Exam Results",
		Done:  "hello done Exam results will be displayed here.",
	}

	w.Header().Set("Content-Type", "text/html")
	tmpl.Execute(w, data)
}

Với controller bên trên, content xuất ra là html sẽ chèn vào target, kể cả đang dùng ht-get. Vi diệu.

Leave a Comment