单击单元格时如何重新整理HTML表格的特定行

时间:2018-11-03 13:43:48

标签: javascript html go

对不起,我的英语不好,我会尽力而为。

我正在尝试创建一个显示服务器名称,其IP,ping,端口等的Web应用程序。

这是我的代码的一部分:

MAIN.GO:

type Widget struct {
Ipport  string
Number  string
State   string
Colport string
Blink   string
}

type resulthtml struct {
Name       string
Affordi    string
Afflieu    string
Affip      string
Affresping string
Affresport string
Affport    string
Affactif   string
Colping    string
Lisports   []Widget
Blink      string
}

var prout []resulthtml

// 80% of the missing code is here like ping function, etc, etc

func main() {

//.........some code here.............

    http.Handle("/favicon.ico", http.NotFoundHandler())
    http.HandleFunc("/", affichagePing)
    http.ListenAndServe(":2692", nil)
}


func affichagePing(w http.ResponseWriter, r *http.Request) {

    tmpl := template.Must(template.ParseFiles("test.html"))
    tmpl.Execute(w, prout)
}

TEST.HTML:

        <div id="cadre_affich1">
        <table id="Affichageglobal">
        <thead>
                <tr>    
                    <th class="AffichageLigneT" style="width: 3%;"></th>
                    <th class="AffichageLigneT" style="width: 15%;">Name</th>
                    <th class="AffichageLigneT" style="width: 8%;">Type</th>
                    <th class="AffichageLigneT" style="width: 6%;">Place</th>
                    <th class="AffichageLigneT" style="width: 14%;">IP</th>
                    <th class="AffichageLigneT" style="width: 10%;">Ping</th>
                    <th class="AffichageLigneT" style="width: 41%;">Ports</th>
                    <th class="AffichageLigneT" style="width: 3%;"></th>
                </tr>
            </thead>
            <tbody>
                {{range .}}
                <tr>
                    <td class="AffichageLigneRefr"></td>
                    <td class="AffichageLigneNom"><span class="AffichageStatut" style="background-color:{{.Colping}}"></span><span>{{.Name}}</span></td>
                    <td class="AffichageLigneType">{{.Affordi}}</td>
                    <td class="AffichageLigneLieu">{{.Afflieu}}</td>
                    <td class="AffichageLigneIP">{{.Affip}}</td>                        
                    <td class="AffichageLigneResPing"><span class={{.Blink}} style="color:{{.Colping}}">{{.Affresping}}</span></td>                     
                    <td class="AffichageLignePorts">{{range $v := .Lisports}}<span class={{$v.Blink}}>{{$v.Number}}</span>{{end}}</td>
                    <td class="AffichageLigneEdit"></td>
                </tr>
                {{end}}
            </tbody>
        </table>
    </div>

我没问题显示我想要的东西。现在,我想刷新一个特定行,而无需重新加载整个页面(其ping,名称等),当我单击它的第一个单元格时。我知道我必须通过Javascript来完成,该Javascript会将信息发送到Go Handler,但是好吧,我花了几个小时并尝试了很多事情...

我无法正常工作。

非常感谢您。

0 个答案:

没有答案