Почему не меняются шаблоны Go + js?

Question

[Nube]

Я хочу изменить шаблон "main" на "page2" .

{{define "index"}}
{{template "head"}}

    <div class = "scene">
         {{template "main"}}
    </div>

{{template "foot"}}
{{end}}

Для этого я читаю json от клиента

func WebSocketConnect(w http.ResponseWriter,r *http.Request)  {
	conn,err := upGrader.Upgrade(w, r, nil)
	defer conn.Close()
	if err != nil {
		log.Println(err)
		return
	}


	webSocketHandler(conn)

}
func webSocketHandler(conn *websocket.Conn) {

	data := conn.ReadJSON(&msg)

	if data != nil {
		log.Fatal(data)
		return
	}

	LoadVista(msg.Temp,conn)

}

Затем подготавливаю шаблон и отправляю его в сокет

var (
	indexTemplate = template.Must(template.ParseFiles(indexVista,mainVista,headVista,footVista))
	page2Template = template.Must(template.ParseFiles(loginVista))
)
/****************************************************************************/


func LoadVista(nameTemplate string, conn *websocket.Conn) {
	switch nameTemplate {
	case "page2":
		templateWsRender(nameTemplate,conn)
	}

}
func templateWsRender(name string,conn *websocket.Conn){
	//defer conn.Close()
	var buf  bytes.Buffer
	data := page2Template.ExecuteTemplate(&buf,name,nil)
	if data!=nil{
		log.Fatal(data)
	}
	err := conn.WriteMessage(1,buf.Bytes())
	if err!=nil{
		log.Fatal(err)
	}

}

это код клиента

var socket = new WebSocket('ws://localhost:7030/ws' )

socket.onmessage = function (event) {
    var message = event.data
    loadVista(message)
}

elem.addEventListener( "click" , sendQuery);
function sendQuery() {
    var page = {
        query_type :"openLink",
        temp: "page"
    }
    var event = JSON.stringify(page);

    socket.send(event);
}

function loadVista(message) {
    //alert(message)
    document.getElementById("scene").innerHTML = message.data;
}

если использовать alert то видно что код из другого шаблона приходит, но почему то не меняется.

Answer 1

[Decadal]

если вам по //alert(message) видно что код из другого шаблона приходит, значит message.data; - некорректное выражение.

var a = {'data':1}; 
alert(a); //[object] 
// если бы там был валидный объект, вы бы не увидели содержимого через alert

Убедитесь что вам надо вставлять message.data в innerHtml, а не message.
Возможно, нужно так -

document.getElementById("scene").innerHTML = message;

или

message = JSON.parse(message);
document.getElementById("scene").innerHTML = message.data;

Comments

[Nube]

если сделать alert(message.date) то он выводит undefined, я новичок в js . Возможно нельзя просто отправлять куски html кода.Я хотел просто рендерить на сервере и выдавать готовый результат, но кажется придется рендерить на стороне клиента ((

[Decadal]

Nube, вы бы лучше привели содержимое console.log(message);
тогда я смогу вам сказать что это и чего вам не хватает, либо куда его записывать.

[Decadal]

Nube,

если сделать alert(message.data) то он выводит undefined

а об этом я вам и говорил. Будь в message объект, вы бы не смогли увидеть его содержимое через alert. Следовательно, там строка, а "строка".data естественно === "undefined".

[Nube]

Decadal, консоль выдает "Uncaught TypeError: Cannot set property 'innerHTML' of null". Получается у меня там null, использую message без data , все ровно ничего не выходит. Спасибо, что помогаете )

[Decadal]

Nube, напишите

function loadVista(message) {
console.log(message);
return;
document.getElementById("scene").innerHTML = message.data;
}
Прямо так и напишите, а потом отпишитесь какой результат в консоли.

[Nube]

Ничего, походу программа выходит на return;

[Decadal]

Nube, если вы поставили return; в правильном месте, сразу после console.log(message), то в консоль должна была вывестись переменная message. Вы смотрели консоль? Всплывающего окошка быть не должно, сообщение должно быть в консоли.

Если и там ничего нет, то цитирую вас:

если использовать alert то видно что код из другого шаблона приходит, но почему то не меняется.

как вы смогли проверить что код из другого шаблона, если message пуст? Убедитесь что вы воспроизвели весь цикл работы программы.

[Nube]

Мне уже стыдно как то). если сделать просто alert(message) то он выводит html код. Я попробую отправить json, который содержит html код и распарсить , посмотрим что выйдет.

[Decadal]

Nube, вы можете инсертить сразу html, если там действительно разметка.
document.getElementById("scene").innerHTML = message; - этого должно хватить. Скажите, каков результат такой операции и не забудьте убрать return;

[Nube]

Я сделал, консоль выводит ошибку. Более того, если поставить в место message html разметку

function loadVista(message) {
    console.log(message);
    document.getElementById('scene').innerHTML = "<div > Page3</div>";
}

он все ровно выводит , что там null . Скорее всего проблема, где то в моем Go сервере.

[Nube]

Нашел проблему. Спасибо Вам Огромное за помощь, честно, не ожидал что так помогать будите. А проблема была банальна, я использовал div class="scene" а ищу то я по ID ).Изменил на div id="scene" и заработало .

[Decadal]

Nube, : ) ну, что ж, зато новый опыт для вас в js. Да не за что