We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

When I add columns the scroll bar doesnt scroll the columns.


As in the subject heading i add columns to the grid using the following code i cant scroll properly.

function addColumns(cols)
        colWidth = 100;
        var gridObj = $("#grid").data("ejGrid");
        for (var i = 0; i < cols.length; ++i)
            gridObj.columns(cols[i], "add");
            gridObj.resizeColumns(cols[i], colWidth);
            width += 100;


however now when i scroll only the grid with the data values scrolls. I attached images of what it looks like.

Also here is the original table.

        .ScrollSettings(scroll => { scroll.Height(300).Width(970); })
        .Columns(col =>

How can i add the columns correctly so that they will still scroll?


Attachment: scroll_issue_cfccc013.zip

2 Replies

MA Matheu February 4, 2016 08:55 PM UTC

So I finally got it working, sort of.

instead of using the api I make the grid in a partial and ajax it in adding columns in the razor view with code like this:

        .ScrollSettings(scroll => { scroll.Width(ViewBag.width); })
        .Columns(col =>
            col.Field("name").HeaderText("Geo Item").IsPrimaryKey(true).TextAlign(TextAlign.Left).Width(75).Add();
            if (ViewBag.cols != null)
                foreach (var x in ViewBag.cols)

where cols is a List<string> and width is a counter that i incremented by 150 so the table grows by 150 for each column.

JK Jayaprakash Kamaraj Syncfusion Team February 5, 2016 09:06 AM UTC

Hi Matheu, 

Thanks for the update.

Please get back to us if you need any further assistance.  


Jayaprakash K.

Live Chat Icon For mobile
Up arrow icon