2015-02-22 6 views
1

Я искал способ сэкономить на стороне клиента отредактированные данные сетки автоматически, когда пользователь переключится на другую строку (точно так же, как в доступе, студия управления sql и т. Д.). Кажется, это немного сложнее.Kendo Grid: Удаление индикаторов грязных ячеек

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

Мне показали некоторые умные работы вокруг (вернитесь к ячейке после случая, который, кстати, очень ценится), , но после некоторого длительного тестирования (я и другие), казалось, было немного «glitchy» (возможно, мне просто нужно больше работать над этим)

Во всяком случае, мне захотелось исследовать, возможно, не используя эту синхронизацию источника данных, и, возможно, просто вызовы на стороне сервера «вручную» (что немного жаль, но если это то, что нам нужно делать, пусть будет так). Если я это сделаю, я бы хотел сбросить ячейки «грязные» индикаторы с красной ячейкой.

Я думал, что могу использовать что-то похожее на this scheme (за исключением сброса флага, я хочу отключиться).

Таким образом, как и в приведенной выше ссылке, я следующий ..

var pendingChanges = []; 

function gridEdit(e) { 
    var cellHeader = $("#gridID").find("th[data-field='" + e.field + "']"); 
    if (cellHeader[0] != undefined) { 
     var pendingChange = new Object();   
    pendingChange.PropertyName = e.field;   
    pendingChange.ColumnIndex = cellHeader[0].cellIndex;   
    pendingChange.uid = e.items[0].uid; 
    pendingChanges.push(pendingChange); 
    } 
    } 

где мы называем gridEdit с изменением источника данных ..

var dataSrc = new kendo.data.DataSource({ 
change: function (e) { 
    gridEdit(e); 
}, 

Теперь предполагая, что мы имеем обратный вызов, который детектирует изменение строки, я думал, что смогу сделать следующее ...

// clear cell property (red indicator) 
for (var i = 0; i < pendingChanges.length; i++) { 
    var row = grid.tbody.find("tr[data-uid='" + pendingChanges[i].uid + "']"); 
    var cell = row.find("td:eq(" + pendingChanges[i].ColumnIndex + ")"); 

    if (cell.hasClass("k-dirty-cell")) { 
    cell.removeClass("k-dirty-cell"); 

    console.log("removed dirty class"); 
    } 
} 

pendingChanges.length = 0; 

// No good, we loose current cell again! (sigh..) 
//grid.refresh(); 

Когда это не сработало, я также судимое источник данных грязный флаг ..

// clear dirty flag from the database 
var dirtyRows = $.grep(vm.gridData.view(), 
    function (item) { 
    return item.dirty == true; 
    }) 

if (dirtyRows && dirtyRows.length > 0) { 
    dirtyRows[0].dirty = false; 
} 

demo here

После ни один из вышеперечисленных не работал, я попробовал grid.refresh(), но это та же проблема, что и источника данных синхронизации (мы теряем наша текущая ячейка)

Может кто-нибудь понять, как я могу очистить индикатор этой ячейки, не обновляя всю сетку, которая, кажется, полностью освобождает наш контекст редактирования?

Заранее благодарим за любую помощь!

ответ

3

Css:

.k-dirty-clear { 
    border-width:0; 
} 

Сетка редактирования события:

edit: function(e) { 
    $("#grid .k-dirty").addClass("k-dirty-clear"); //Clear indicators 
    $("#grid .k-dirty").removeClass("k-dirty-clear"); //Show indicators 
    } 

http://jsbin.com/celajewuwe/2/edit

+0

Привет Тарек, спасибо за ответ устанавливаемых сотовое фактически останавливает когда мы редактируем ячейку, но затем можем удалить ее на более позднем этапе (программно - в моем случае, когда вызывается vm.rowChangedCallback, который является когда вы используете вкладку, чтобы перейти к новой строке). – peterc

+0

@peterc проверить мое редактирование –

+0

@ Терек, большое спасибо! Применяя $ ("# grid .k-dirty"). AddClass ("k-dirty-clear"); он очищает индикаторы, а затем они снова устанавливаются, если я повторно редактирую ячейку. Это именно то, что я хочу! Приветствия. – peterc

0

Простое решение для решения этой проблемы заключается в переопределении цвет "флаг" к прозрачному. просто переопределить «.к-загрязнен "класс (границы цвет) просто добавив вышеуказанные строки в CSS

CSS:.

//k-dirty is the class that kendo grid use for mark edited cells that not saved yet. 
 
//we override that class cause we do not want the red flag 
 
.k-dirty { 
 
    border-color:transparent transparent transparent transparent; 
 
}

Смежные вопросы