Как создать строку поверх сетки, используя Kendo UI? - PullRequest
Новая
       4

Как создать строку поверх сетки, используя Kendo UI?

0 голосов
/ 22 мая 2018

Я хочу создать строку поверх сетки с помощью Kendo UI?

Когда я нажимаю кнопку Добавить новую запись, я хочу, чтобы всегда новая строка заполнялась сверху (первая строка сетки), если я добавляю одну запись, у меня нет никаких проблем, но если я добавляю непрерывно несколько записей, то строки будут уменьшаться (одна за другой).

Пример сетки на моей странице .html: 

    <div id="commentsDiv" style="width: 100%; margin-bottom:15px; border: 0px;">

                    <div data-role="grid"
                         data-scrollable="true"
                         data-resizable="true"
                         data-editable="inline"
                         data-toolbar="['create', 'cancel']"
                         data-columns="[
                                         { field: 'cmntTxt',                title: 'Comment',       width: 400},
                                         { field: 'createdDate' ,           title: 'Created On',    width: 125, type : 'date', 'format' : '{0: MM/dd/yyyy HH:mm:ss}'},
                                        { command: ['edit', 'destroy',],    title: 'Actions',       width: 150 }
                                     ]"
                         data-bind="source: commentsDS"
                         data-scrollable='true'
                         data-sortable='true'
                         data-filterable='true'

                         data-pageable="{ 
                                 pageSize: 15,
                                 pageSizes: [15, 50, 100, 200, 500],
                                 refresh : true,                                                         
                                 buttonCount : 5
                                 }"                
                        style="width: 100%; height: 500px">
                    </div>

    </div>

data-toolbar="['create', 'cancel']" создать это ДОБАВИТЬ НОВУЮ ЗАПИСЬ, отменить -is Отменить изменения, эта информация исходит от kendo.all.mini.js.

Когда я нажимаю кнопку Добавить новую запись, я хочу всегдановая строка для заполнения сверху (первая строка таблицы), если я добавляю одну запись, у меня нет проблем, но если я добавляю непрерывно несколько записей, то строки будут уменьшаться (одна за другой).

Когда я нажимаю добавить новую запись, вызывается следующий код из kendo.all.mini.js 

    addRow: function () {
    var e,
    t,
    n,
    i,
    r,
    o,
    a = this,
    s = a.dataSource,
    l = a._editMode(),
    c = a.options.editable.createAt || '',
    d = s.pageSize(),
    u = s.view() || [];
    (a.editable && a.editable.end() || !a.editable) && ('incell' != l && a.cancelRow(), e = s.indexOf(u[0]), 'bottom' == c.toLowerCase() && (e += u.length, d && !s.options.serverPaging && u.length >= d && (e -= 1)), 0 > e && (e = s.page() > s.totalPages() ? (s.page() - 1) * d : 0), t = s.insert(e, {
    }), n = t.uid, i = a.lockedContent ? a.lockedTable : a.table, r = i.find('tr[' + dt.attr('uid') + '=' + n + ']'), o = r.children('td:not(.k-group-cell,.k-hierarchy-cell)').eq(a._firstEditableColumnIndex(r)), 'inline' === l && r.length ? a.editRow(r)  : 'popup' === l ? a.editRow(t)  : o.length && a.editCell(o), 'bottom' == c.toLowerCase() && a.lockedContent && (a.lockedContent[0].scrollTop = a.content[0].scrollTop = a.content[0].offsetHeight))
    }

1 Ответ

0 голосов
/ 22 мая 2018

Установите свой индекс, а затем добавьте нужные значения (я просто устанавливаю их на ноль, как вы можете их заполнить): 

$('#yourButton').on('click', function(){
    var grid = $("#grid").data("kendoGrid");
    grid.dataSource.insert(0, { cmntTxt: "", createdDate: "", action: "" });
});
...