如何使用golang的模板实现级联下拉列表

场景：

我有一个级联场景，其中第二个下拉列表中的值取决于第一个。 我有三个模板“布局”，“输入”和“内部”。

尝试：

我在更改“输入”模板中的第一个下拉列表时调用了ajax，并坚持处理返回的响应。 目前我找到了一种通过替换第二个下拉列表的html来修复它的方法。 但是，我认为这不是更好的处理方式。 我想要一些渲染模板，我不需要修改html。

请帮助以更好的方式完成任务或指向一些维基。 只有标准图书馆

谢谢，

Layout.html ： http ： //play.golang.org/p/LikKy6rf3-

Input.html ： http ： //play.golang.org/p/wM7EpPdXuM

Inner.html ： http ： //play.golang.org/p/xFpInKZfFT

Main.go : http : //play.golang.org/p/cxtJU-Lhi1

Answer 1

在更高级别，您有2个选项：

• 发送下拉列表的所有值（例如，作为树），并在更高级别的下拉列表更改时更改第2级和第3级的值（适用于小型列表，不适合大型数据集）
• 或者您选择的那个：当选择更改时，您进行AJAX调用（从onchange触发）并从结果中填充列表。

阐述＃2：从AJAX调用结果中填充列表

您还有2个选项可以执行此操作：

• AJAX调用返回HTML调用，您可以简单地使用它来替换HTML 标记的内部HTML。

• 或者AJAX调用可能仅返回数据（例如，使用JSON编码），并且Javascript代码可以构建列表的内容。

AJAX返回HTML

AJAX调用可能会返回需要替换为的内部HTML的完整HTML代码。 要在服务器端实现此目的，您可以创建/分离仅负责生成HTML代码的HTML模板，例如：

 {{define "innerList"}} {{range .}} {{.Text}} {{end}} {{end}} 

您只能执行以下模板：

 // tmpl is the collection of your templates values := ... // Load/construct the values tmpl.ExecuteTemplate(w, "innerList", values) 

这里的values是以下结构的一部分：

 type Pair struct { Key string Text string } 

使用Javascript构建内容

AJAX调用可以返回JSON数据结构，数组/ value;text列表value;text对，您可以自己添加子标记。

要将添加到标记：

 var x = document.getElementById("mySelect"); var option = document.createElement("option"); option.value = "1234"; option.text = "Kiwi"; x.add(option); 

所以基本上你需要做的就是删除当前子节点，迭代作为响应接收的列表，并添加一个新的标签。