Ошибка: невозможно вызвать методы в табуляторе до инициализации;попытался вызвать метод addRow - PullRequest
Новая
       8

Ошибка: невозможно вызвать методы в табуляторе до инициализации;попытался вызвать метод addRow

0 голосов
/ 06 февраля 2019

У меня есть страница с таблицей: 

<table id="myTable">
        <thead>
            <tr>
                <th>Description</th>
                <th>Qty</th>
                <th>Cost</th>
            </tr>
        </thead>
        <tbody>
            @foreach (var item in Model)
            {
                @Html.EditorFor(model => item);
            }
        </tbody>
    </table>

И затем я инициализирую Tabular следующим образом: 

$("#myTable").tabulator({
    layout: "fitColumns",
    addRowPos: "bottom",
    columns: [
        { title: "Description", field: "Description", editor: "input" },
        { title: "Qty", field: "Quantity", sorter: "number", editor: "number", editorParams: { min: 0, step: 1, } },
        { title: "Cost", field: "Cost", sorter: "number", editor: "number", editorParams: { min: 0, step: 0.1, }, align: "right", formatterParams: { decimal: '.', thousand: '.', symbol: "R" }, bottomCalc: "sum", bottomCalcFormatter: "money", bottomCalcFormatterParams: { decimal: '.', thousand: '.', symbol: "R" } },
        { formatter: "buttonCross", width: 30, align: "center", cellClick: function (e, cell) { cell.getRow().delete(); } },
    ],
});

Все это работает довольно хорошо, но я попытался добавить: 

$("#add-row").click(function () {
    $("#myTable").tabulator("addRow", {}, true);
});

нажатие на мою кнопку для добавления новой строки приводит к: Ошибка: невозможно вызвать методы в табуляторе до инициализации;попытался вызвать метод 'addRow'

Я пытался сделать: var table = $("#myTable").tabulator... с table.addRow({}), но затем я получаю сообщение об ошибке, говоря, что addRow не является функцией.

Должен ли он работать какэто?

Ответы [ 2 ]

0 голосов
/ 11 февраля 2019

Я инициализировал Табулятор на существующую таблицу, нацеленную на элемент <table id="myTable">.Хотя изначально это прекрасно работает, другие вещи (как в моем вопросе) продолжают приводить к «Ошибка: невозможно вызвать методы в табуляторе до инициализации».

В итоге я удалил предопределенный <table> и пошелинициализация на <div id="myTable"> и получение данных через ajax.

Теперь все работает как ожидалось / задокументировано.Не знаю, если это ошибка / должна работать так / моя собственная некомпетентность, но, по крайней мере, я могу двигаться дальше.

0 голосов
/ 11 февраля 2019

Это сообщение говорит о том, что вы создали свой объект Tabulator до того, как вызвали функцию addRow .

Если вы новичок в Tabulator, я бы предложилВы не используете оболочку JQuery.это было больше по прежним причинам из старой версии 3.5.

В этом случае вы должны использовать конструктор: 

var table = new Tabulator("#myTable", {
    layout: "fitColumns",
    addRowPos: "bottom",
    columns: [
        { title: "Description", field: "Description", editor: "input" },
        { title: "Qty", field: "Quantity", sorter: "number", editor: "number", editorParams: { min: 0, step: 1, } },
        { title: "Cost", field: "Cost", sorter: "number", editor: "number", editorParams: { min: 0, step: 0.1, }, align: "right", formatterParams: { decimal: '.', thousand: '.', symbol: "R" }, bottomCalc: "sum", bottomCalcFormatter: "money", bottomCalcFormatterParams: { decimal: '.', thousand: '.', symbol: "R" } },
        { formatter: "buttonCross", width: 30, align: "center", cellClick: function (e, cell) { cell.getRow().delete(); } },
    ],
});

И затем вы можете добавить такие строки: 

table.addRow({}, true);

Вам просто нужно убедиться, что когда вы присваиваете ее переменной table , она находится в области видимости, где к ней могут обращаться все функции, которые в ней нуждаются

...