Исправлена ​​функция on_click для изменения текста - PullRequest
Новая
       23

Исправлена ​​функция on_click для изменения текста

0 голосов
/ 20 мая 2019

Когда я нажимаю на кнопку, запускается функция. Эта функция генерирует строку, и я пытаюсь отобразить эту строку пользователю в теге div.

Я попытался отладить это несколькими способами. Например, я проверяю, работает ли онклик. Поэтому, когда я нажимаю на кнопку, я вижу «Нажал!» а затем "В функции". Это ожидается. Однако после этого предполагается отображать строку, сгенерированную функцией listAllEvents. Тем не менее, он не работает должным образом. (Он записывает результат как ожидалось; он просто не отображается на экране.) 

<!DOCTYPE html>
<html>

<head>
    <base target="_top">
</head>

<body>
    <script>
        function myFunction() {
            document.getElementById("data").innerHTML = "Clicked!";
            listAllEvents()
        }


    function listAllEvents() {
        document.getElementById("data").innerHTML = "In Function!";
        var calendarId = 'primary';
        var now = new Date();
        var display = ""
        var events = Calendar.Events.list(calendarId, {
            timeMin: now.toISOString(),
            maxResults: 2500,
        });
        if (events.items && events.items.length > 0) {
            for (var i = 0; i < events.items.length; i++) {
                var event = events.items[i];

                if (event.start.date) {
                    // All-day event.
                    var start = new Date(event.start.date);
                    var end = new Date(event.end.date);
                    display = display + 'Start: ' + start.toLocaleDateString() + '; End: ' + end.toLocaleDateString() + ". ";
                } else {
                    var start = new Date(event.start.dateTime);
                    var end = new Date(event.end.dateTime);
                    display = display + 'Start: ' + start.toLocaleString() + '; End: ' + end.toLocaleString() + ". ";
                }
            }
        } else {
            display = 'No events found.';
        }

        Logger.log('%s ', display);
        document.getElementById("data").innerHTML = "Almost There";
        document.getElementById("data").innerHTML = display;
    }
</script>

<div id="data"> Hello! </div>
<button onclick="myFunction()">Run Function</button>

Ожидается, при нажатии: Пуск .... Конец.

Факт: «В работе!»

Ответы [ 2 ]

0 голосов
/ 20 мая 2019

Невозможно использовать код на стороне сервера на клиенте

Проблема в том, что вы пытаетесь запустить серверный код на клиенте. 

   function listAllEvents() {
        document.getElementById("data").innerHTML = "In Function!";
        var calendarId = 'primary';
        var now = new Date();
        var display = ""
        var events = Calendar.Events.list(calendarId, {//This is server side Google Script
            timeMin: now.toISOString(),
            maxResults: 2500,
        });
        if (events.items && events.items.length > 0) {
            for (var i = 0; i < events.items.length; i++) {
                var event = events.items[i];

                if (event.start.date) {
                    // All-day event.
                    var start = new Date(event.start.date);
                    var end = new Date(event.end.date);
                    display = display + 'Start: ' + start.toLocaleDateString() + '; End: ' + end.toLocaleDateString() + ". ";
                } else {
                    var start = new Date(event.start.dateTime);
                    var end = new Date(event.end.dateTime);
                    display = display + 'Start: ' + start.toLocaleString() + '; End: ' + end.toLocaleString() + ". ";
                }
            }
        } else {
            display = 'No events found.';
        }

        Logger.log('%s ', display);
        document.getElementById("data").innerHTML = "Almost There";
        document.getElementById("data").innerHTML = display;
    }

Если вы хотите запустить серверный скрипт Google, вы можете вызвать его с помощью google.script.run

Вот простой пример использования google.script.run

Это основная рама:

Ваш HTML-файл:

Нажатие кнопки вызывает Javascript-функцию getCalendarEvents, которая подготавливает соответствующие (вероятно, не требующиеся в этом случае) данные для передачи на сервер, а затем вызывает listCalendarEvents, который находится на сервере. Функция сервера получает события и возвращает их в withSuccessHandler, а затем этот обработчик помещает информацию в html-страницу. 

<!DOCTYPE html>
<html>
<head>
    <base target="_top">
</head>

<body>
    <script>
        function getCalendarEvents() {
           google.script.run
           .withSuccessHandler(function(eObj){
             //load html with data from eObj
           })
           .listCalendarEvents();
        }


    function listAllEvents() {

    }
</script>

<div id="data"> Hello! </div>
<button onclick="getCalendarEvents();">Run Function</button>

code.js: 

function listCalendarEvents() {
 //get all of the events
 return eObj;
}
0 голосов
/ 20 мая 2019

Сбой, потому что Calendar равен undefined. консоль вашего браузера сообщит вам.

...