Метод copyToClipboard от Tabulator не работает должным образом - PullRequest
0 голосов
/ 01 мая 2020

Я новичок в плагине Tabulator и пытаюсь скопировать данные из одной таблицы в другую, используя метод Tabulator copyToClipboard, но безуспешно.

В моем приложении я создал одиннадцать <div> элемента (один для [Лидера экипажа] и один для максимум десяти [членов экипажа]), служащих контейнерами для создаваемых таблиц Табулятора. Я надеюсь скопировать данные из таблицы [Crew Leader] и вставить их в каждую из затронутых таблиц [Crew Member], тем самым уменьшая повторный ввод данных. Эта последовательность событий копирования / вставки запускается событием щелчка, связанным с <button> в заголовке таблицы [Crew Leader]. Следующая событие вызывается событием <button>:

        function CloneTable() {

            // Verify the [Crew Leader] Tabulator table is present....
            var tableLeader = Tabulator.prototype.findTable("#CrewLeaderTable");
            if (tableLeader.length > 0) {
                alert("The Tabulator table #CrewLeaderTable was found.\ntable.length = " + tableLeader.length);
                tableLeader.copyToClipboard("all");
                alert("The table contents were copied to the clipboard.");
            }
            else {
                alert("The Tabulator table #CrewLeaderTable was not found.");
            }
        }

Первое сообщение alert подтверждает, что объект #CrewLeaderTable был найден ожидаемым. Тем не менее, вторая alert проверка никогда не будет получена, что указывает на сбой метода Tabulator copyToClipboard.

Я прочитал столько соответствующей документации Tabulator, сколько смог найти, и надеюсь, что у меня просто что-то упустил из моей установки.

Ниже приведена копия моего конструктора Tabulator:

            var table = new Tabulator(divid, {
                height: "100%",
                layout: "fitDataFill",
                movableRows: true, //enable user movable rows
                tabEndNewRow: true, //create empty new row on tab
                rowContextMenu: myActionContextMenu,
                keybindings: {
                    "navUp": true, //enable navUp keybinding using the "up arrow" key
                    "navDown": true, //enable navDown keybinding using the "down arrow" key
                },
                columns: [
                    { title: "Phase Code", field: "phaseCode", width: 144, editor: "select", editorParams: { values: function (cell) { return window.laborPhaseCodes; } } },
                    { title: "Date Worked", field: "dateComp", hozAlign: "center", sorter: "date", editor: dateEditor },
                    { title: "Start Time", field: "timeStart", hozAlign: "center", sorter: "time", editor: timeEditor },
                    { title: "Finish Time", field: "timeFinish", hozAlign: "center", sorter: "time", editor: timeEditor },
                    { title: "Memo", field: "memo", width: 144, hozAlign: "left", editor: "input" },
                    { title: "<button type='button' id='btnClone' class='btn btn-success btn-sm py-0' style='font-size:10px;'>Clone</button>", headerSort: false, headerClick: tabCloneTable }
                ],
                cellEdited: function (cell) {
                }
            });

Я потратил пару дней, пытаясь найти лучший способ «клонировать» данные из одной таблицы в другую. Документация Табулятора довольно полна, но я боюсь, что что-то упустил. Любая помощь с благодарностью.

1 Ответ

1 голос
/ 01 мая 2020

Похоже, что copyToClipboard не возвращает данные, он поддерживается внутри и недоступен. Но с тем, что вы делаете, set / getData работает нормально. Вот пример, https://jsfiddle.net/nrayburn/19sjg74k/7/.

По сути, вы хотите вызвать getData для родительской таблицы и setData для дочерней таблицы.

  const crewLeaderTable = Tabulator.prototype.findTable('#CrewLeaderTable')[0];
  const crewMemberTable = Tabulator.prototype.findTable('#CrewMember1Table')[0];
  const crewLeaderData = crewLeaderTable.getData();
  // You could also use replaceData or addData, depending on the requirements
  crewMemberTable.setData(crewLeaderData);

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...