ok, vertical-align: middle solved the issue, and gave me a little satisfaction :-) Thanks for your help.

Petko, last thing left for me to be done :

I added this style to site.css ( made them red to see position)  :

.jjGrid.ui-iggrid-table > tbody > tr.ui-iggrid-activerow > td.ui-iggrid-selectedcell > span,
.jjGrid.ui-iggrid-table > tbody > tr.ui-iggrid-altrecord.ui-iggrid-activerow > td.ui-iggrid-selectedcell > span {
        border-top: 2px solid red;
    border-bottom: 2px solid  red;
    line-height: 30px;
   

}

and removed template from column setting.. it added two lines to the check box column when selected .. but they are not straight ( continuous ) , the red line on the check box column is 1 - 2 px off..  do you know how to correct it..if you are please show it on the latest  sample site attached.

Thanks

Hi Petco

Attached updated site.. I need some help me with style.. I added style.css with selectors that work with template: "<span class='cellContent'>${ProductID}</span>" in columns setting...all columns work well except check box column (InStock) If you can help me to configure it correctly so checkbox column looks the same on selected row.  basically .cellContent for selected row has { border-top: 2px solid #27c7eb;
    border-bottom: 2px solid #27c7eb;} but somehow attempt to apply the same style to checkbox column leads to checkbox disappear.

can you help to fix it so the check box is visible and functional and on the selected row check box cell styles exactly the same as other cells in selected row, i.e. white background with two blue lines...

Thanks.

Hi,

I’m glad you managed to resolve the issue. If you have any further questions please don’t hesitate to contact us again.

Kind regards,

Petko Zhekov

Software Developer

Hi Petko,

Thanks for your help. The last update is pretty close but 'dataSource = updating.grid.dataSource;' still does not bring changes to the data source ( products ) so I updated

this to  :

               origfun.call(this, val, updating);
                if(updating){
                    var grid = updating.grid;
                    var rowID = updating._row_;
                    updating.endEdit(true);
                    var prodRow = _.find(products, function (product) {
                      return ( product.ProductID == rowID )
                    })
                    if (prodRow) {
                        prodRow.inStock = val;
                    }

That seemed to start working and keeping products and grid in sync.  I'll leave this case open since I might have question when transferring it to main project, but close in couple of days it it goes well.. 

Thanks.