msbyuva
msbyuva

Reputation: 3625

jqGrid 4.5.4 ASP.NET MVC3 Column Separator line showing/display away

I am using jqGrid 4.5.4 for ASP.NET MVC application in which I have an issue with column separator.

First grid is the one I am using, when I am trying to expand the column using column separator at pkd column I see the separator line is showing away (in between create date column)as seen in image.

I am having this behavior across all the columns (Column Separator line displays away) through out the jqGrid

Second grid is from the demo in which I clicked on CustomerID and I see the column separator exactly at the end of CustomerID column

jqGrid Column Separator issue..

Upvotes: 0

Views: 281

Answers (2)

zhenyong
zhenyong

Reputation: 249

jqgrid use mouse x-postion to place the marker, in fact the marker's offset parent is the table wrapper, so just use the offset-x as x-place, u can see my overrided codes follow.

        dragStart: function(i,x,y) {
            //>>>override zhenyong
            // this.resizing = { idx: i, startX: x.clientX, sOL : x.clientX-6};
            this.resizing = { idx: i, startX: x.clientX, sOL : y[0]};
            //<<<override

            this.hDiv.style.cursor = "col-resize";
            this.curGbox = $("#rs_m"+$.jgrid.jqID(p.id),"#gbox_"+$.jgrid.jqID(p.id));
            //>>>override zhenyong
            // this.curGbox.css({display:"block",left:x.clientX-6,top:y[1],height:y[2]});
            this.curGbox.css({display:"block",left:y[0],top:y[1],height:y[2]});
            //<<<override
            $(ts).triggerHandler("jqGridResizeStart", [x, i]);
            if($.isFunction(p.resizeStart)) { p.resizeStart.call(ts,x,i); }
            document.onselectstart=function(){return false;};
        },

Upvotes: 0

Oleg
Oleg

Reputation: 222007

გამარჯობა (Gamarjoba)! The version jqGrid 4.1.2 is a real retro version. If you really need to use the old version I would suggest you to modify jquery.jqGrid.src.js code. There are bug in the code of dragStart function (see the code). Some time before I posted the pull request which fix the bug. Now the code looks as the following (see here)

dragStart: function(i,x,y) {
    var gridLeftPos = $(this.bDiv).offset().left;
    this.resizing = { idx: i, startX: x.clientX, sOL : x.clientX - gridLeftPos };
    this.hDiv.style.cursor = "col-resize";
    this.curGbox = $("#rs_m"+$.jgrid.jqID(p.id),"#gbox_"+$.jgrid.jqID(p.id));
    this.curGbox.css({display:"block",left:x.clientX-gridLeftPos,top:y[1],height:y[2]});
    $(ts).triggerHandler("jqGridResizeStart", [x, i]);
    if($.isFunction(p.resizeStart)) { p.resizeStart.call(ts,x,i); }
    document.onselectstart=function(){return false;};
},

I hope it will fix the problem which you have. Probably you will need make some other dependent changes (see the code fragment and compare it with the code here, see changes in getOffset and the usage of new getColumnHeaderIndex).

Upvotes: 1

Related Questions