Hello,
I could not open the code sample, and I believe that a similar approach as we discussed here http://www.infragistics.com/community/forums/p/83675/419670.aspx#419670, could be in order.

I would recommend to actually delete the rows from the Database with the delete function, since if the rows are only CSS Class modified, it could lead to performance issues, depending on your application. Here are several useful threads as well as our official documentation and online samples that would be very useful, if you decide to follow the suggested approach.

http://www.infragistics.com/products/aspnet/sample/data-grid/delete-rows-server-events
http://help.infragistics.com/NetAdvantage/ASPNET/2013.1/CLR4.0/?page=WebDataGrid_Enabling_Row_Deleting.html

http://www.infragistics.com/community/forums/t/67318.aspx
http://www.infragistics.com/community/forums/t/73137.aspx

Thank you for posting in our forum.

Thanks for your suggest, according your answer of my previous post
http://www.infragistics.com/community/forums/p/83675/418058.aspx#418058 

Now the grid line alignment is correctly, but new problem is when remove first row, will cause reduce 1px each column,

below is my code:

function deleteRow() {
var grid = $find('<%= WebDataGrid1.ClientID %>');
var selectedRows = grid.get_behaviors().get_selection().get_selectedRows();
var row = selectedRows.getItem(0);
if (row == null) {
    alert('Please select a row!');
    return;
}

// first row remove cause align problem
var rowIndex = row.get_index();
if (rowIndex == 0) {
var columnFixing = grid.get_behaviors().get_columnFixing();
if (columnFixing != null) {
    var fixedColumnCount = columnFixing._fixedColumns.length;
    var firstNoneFixedColumnFieldName = grid.get_columns().get_column(fixedColumnCount).get_key();
    for (var i = 1; i < grid.get_rows().get_length() ; i++) {
        nextRow = grid.get_rows().get_row(i);
        var cellElement = row.get_cellByColumnKey(firstNoneFixedColumnFieldName).get_element();
        var cellElement2 = nextRow.get_cellByColumnKey(firstNoneFixedColumnFieldName).get_element();
        for (var j = 1; j < grid.get_columns().get_length() ; j++) {
            if (cellElement.style.width != '' && parseInt(cellElement.style.width) > 0)
            cellElement2.style.width = (parseInt(cellElement.style.width) - 1) + 'px'; // reduce 1px
            cellElement = jQuery(cellElement).next()[0];
            cellElement2 = jQuery(cellElement2).next()[0];
            if (typeof cellElement == 'undefined')
                break;
            }
        }
        grid.isFixedColumnFirstRowDeleted = true;
    }
}

grid.get_rows().remove(row);
}

function addRow() {
var grid = $find('<%= WebDataGrid1.ClientID %>');
var values = new Array(grid.get_columns().get_length());
var rows = grid.get_rows();
rows.add(values);
var row = grid.get_rows().get_row(grid.get_rows().get_length() - 1);

// first row remove cause align problem
if (grid.isFixedColumnFirstRowDeleted == true) {
    var columnFixing = grid.get_behaviors().get_columnFixing();
    if (columnFixing != null) {
    var fixedColumnCount = columnFixing._fixedColumns.length;
    var firstNoneFixedColumnFieldName = grid.get_columns().get_column(fixedColumnCount).get_key();
    var firstRow = grid.get_rows().get_row(0)
    nextRow = row;
    var cellElement = firstRow.get_cellByColumnKey(firstNoneFixedColumnFieldName).get_element();
    var cellElement2 = nextRow.get_cellByColumnKey(firstNoneFixedColumnFieldName).get_element();
    for (var j = 1; j < grid.get_columns().get_length() ; j++) {
        cellElement2.style.width = (parseInt(cellElement.style.width) - 1) + 'px'; // reduce 1px
        cellElement = jQuery(cellElement).next()[0];
        cellElement2 = jQuery(cellElement2).next()[0];
        if (typeof cellElement == 'undefined')
            break;
        }
    }
}
}

below is the picture:

sample source code have been attached.

 is there have other better way? thanks a lot for your help.