How to fill a select html with map interface


(laurent ) #1

hi guys,
I am looking to be able to integrate a select in a form but I have already a map interface of my which can be browsed to fill it I saw this tutorial on the web ici
but what does not appropriate to me is the var constant that stock all the html as I try to separate header footer content…
Is there any other way to proceed to achieve the same result?
thank you all for your technical support for newbies like me


(Yamil Bracho) #2

You can have your html code in a separate file (recommended) and fill it with values from your golang code using html/template


(laurent ) #3

even to populate my select?


(Yamil Bracho) #4

Yes. In fact, the web page you refrence use html/template.

<select> // for loop in html template example

{{range $key, $value := .}}
{{ $key }}
{{end}}


(laurent ) #5

OK I see it’s the syntax that is problematic tell me if I’m in the right

package main
 import (
"net/http"
"html/template"
)
 var fruits = map[string]interface{}{
     "Apple":  "apple",
     "Orange": "orange",
     "Pear":   "pear",
     "Grape":  "grape",
 }

 func handler(w http.ResponseWriter, r *http.Request) {
t, _ := template.ParseFiles("view.html") //setp 1
t.Execute(w, fruits) //step 2
}

func main() {
server := http.Server{
    Addr: "127.0.0.1:8080",
}
http.HandleFunc("/view", handler)
server.ListenAndServe()
}
 /htmlcode for view.html
<html>
<head>
  <title>First Program</title>
  </head>
  <body>
  <select>{{range $ key, $ value: =. Fruits}} <option>{{$ key}} </option></select>
  {{end}}
  </body>

does it seem to you that I do not take it well?


(Yamil Bracho) #6

Something like this ::

				package main

			import (
				"net/http"
				"html/template"
			)

			var fruits = map[string]interface{}{
				 "Apple":  "apple",
				 "Orange": "orange",
				 "Pear":   "pear",
				 "Grape":  "grape",
			}

			func Handler(w http.ResponseWriter, r *http.Request) {
			   t, err := template.ParseFiles("view.html") 
			   if err != nil {
				 panic(err)
			   }
			   
			   t.Execute(w, fruits)
			}

			func main() {

			  http.HandleFunc("/view", Handler)
			  http.ListenAndServe(":8080", nil)
			}
			 
			 
			<html>
			<head>
			  <title>First Program</title>
			</head>
			<body>
			  <select>
				 {{range $key, $value : =.Fruits }} 
				 <option>{{ $key}}</option>
				 {{end}}
			   </select>
			</body>
			</html>

(laurent ) #7

in the case where we have more selects how we indetify them in the ranges.
because if I put fruit after the point as in the example the selection is empty


(Yamil Bracho) #8

You need to have two values in your select. One for the key and the value to be show for the option.
In this case you have got a map so tke key of the map could be used as key of the option.
The value could be a string expression from the data in the map.
To get an option selected by defualt add the selected=“selected” clause to the option you want to appears selected.


(laurent ) #9

ok this is my html

<select>
{{range $key, $value := . fruits}}
 <option value="{{ $value }}">{{ $key }}</option>

makes the selection empty unless I remove fruit I do not understand how to call fruti because if you have more select it is not functional

package main
import (
"html/template"
"net/http"
 )
var fruits = map[string]interface{}{
"Apple":  "apple",
"Orange": "orange",
"Pear":   "pear",
"Grape":  "grape",
}

func handler(w http.ResponseWriter, r *http.Request) {
t, err := template.ParseFiles("templates/view.html")
if err != nil {
	panic(err)
}

t.Execute(w, fruits)
}

func main() {

http.HandleFunc("/", handler)
http.ListenAndServe(":8080", nil)
}

thank you for your patience and your explanation


(Yamil Bracho) #10

Maybe the parses is not understading your template. Change to

<select>

{{- range $key, $value := .}}

<option value="{{ $key }}">{{ $value }}</option>

{{- end}}

</select>

Also generate the output to StdOut to check if everything is right

t.Execute(os.Stdout, fruits)
t.Execute(w, fruits)

(laurent ) #11

Hi Yamil_Bracho,
i tested but it does not work
if I do not fruit this function but if I have more model like his how to know what he will take?
this work

<select>
{{- range $key, $value := .}}
<option value="{{ $key }}">{{ $value }}</option>
{{- end}}
</select>

doesnt work why?

 <select>
{{- range $key, $value := .fruits}}
<option value="{{ $key }}">{{ $value }}</option>
{{- end}}
</select>

(laurent ) #12

OK it works but like her. I do not know if it’s the right method

 <select>
	{{range .Fruits}}
	<option value="{{ .Name }}">{{ .Values }}</option>
	{{end}}
 </select>

so I do not use the interface map

package main
import (
"html/template"
"net/http"
)
type Fruit struct {
Name   string
Values string
}
type Data struct {
Name   string
Fruits []Fruit
}
func main() {

http.HandleFunc("/", handler)
http.ListenAndServe(":8080", nil)
}
func handler(w http.ResponseWriter, r *http.Request) {
t, err := template.ParseFiles("templates/view.html")
if err != nil {
	panic(err)
}
//t.Execute(os.Stdout, Data)

t.Execute(w, Data{
	Fruits: []Fruit{
		Fruit{"Apple", "apple"},
		Fruit{"Orange", "orange"},
	},
})
}

how to get the same result with an interface map anwer not easy


(Yamil Bracho) #13

You can use a map of interface without problems. What made easier things for you is group all the vars you would need in a structure. For example:

iewData := struct {
	Fruits map[string]interface{}
}{
	fruits,
}

t.Execute(os.Stdout, viewData)
t.Execute(w, viewData)

And in your template

<select>
  {{- range $key, $value := .Fruits}}
  <option value="{{ $key }}">{{ $value }}</option>
  {{- end}}
</select>

(laurent ) #14

salut,
peux tu me montrer un exemple plus complet sur golang play par exemple car le je vois pas trop l’implentation


(Yamil Bracho) #15

Certainly.

HTML

<!DOCTYPE html>

<html lang=“en”>

<head>

<meta charset=“UTF-8”>

<meta name=“viewport” content=“width=device-width, initial-scale=1.0”>

<meta http-equiv=“X-UA-Compatible” content=“ie=edge”>

<title>Document</title>

</head>

<body>

Fruits:

<select>

{{- range $key, $value := .Fruits}}

<option value="{{ $key }}">{{ $value }}</option>

{{- end}}

</select>

</body>

</html>

Go

`package main

import (
“html/template”
“net/http”
“os”
)

var fruits = map[string]interface{}{
“Apple”: “apple”,
“Orange”: “orange”,
“Pear”: “pear”,
“Grape”: “grape”,
}

func handler(w http.ResponseWriter, r *http.Request) {
t, err := template.ParseFiles(“templates/view.html”)
if err != nil {
panic(err)
}

viewData := struct {
	Fruits map[string]interface{}
}{
	fruits,
}

//t.Execute(os.Stdout, viewData)
t.Execute(w, viewData)

}

func main() {
http.HandleFunc("/", handler)
http.ListenAndServe(":8080", nil)
}
`


(laurent ) #16

super merci beaucoup pour l exemple je comprend mieux


(Yamil Bracho) #17

Good thing it was helpful … :slight_smile:


(system) closed #18

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.