BUGS 11.1.0 with fixes

[jplevene]

See the following:

Code: [Select]

onEditorKeyUp: function(evt, ui) {
var $ed = ui.$editor,
edtype, val = $ed.val(),
i = pq.intel,
pos;
if (val && val.indexOf("=") === 0) {
if (edtype = $ed.is("textarea") ? 1 : $ed.is("div[contenteditable") ? 2 : 0) {
pos = edtype == 2 ? window.getSelection().getRangeAt(0).startOffset : ed.selectionEnd;
i.popup(val, pos, $ed);
this.select(val, pos)
}
}
},
"ed.selectionEnd" should be "$ed.selectionEnd"

ALSO

If you dynamically create an element and make it into a grid inside a hidden block of elements, the grid hasn't rendered, so sizing variables, etc. haven't been defined.  Fixes are:

Code: [Select]

calcTopBottom: function(left) {
if(typeof(this.dims)==="undefined") return 0; // *********** ADD THIS LINE TO TOP
...

getTop: function(ri, actual) {
var top = this.topArr ? this.topArr[ri] : 0,  // *********** CHANGE
...

getLeft: function(_ci, actual) {
if(typeof(this.leftArr)==="undefined") return 0;   // *********** ADD THIS LINE TO TOP
...
getHeightR: function(ri, rows) {
if(typeof(ri)==="undefined" || ri<0) return 0;  // *********** ADD THIS LINE TO TOP
...
Once the grid becomes visible and refreshes, the variables are set.  The above just prevents errors that cause a fatal crash

ALSO:

In columnModel setting halign now doesn't work:

Code: [Select]

halign:"center",
ALSO:

Using pqgrid.dev.js (with my added code above), line 3399 it reads

Code: [Select]

hIndx == nullbut should be:

Code: [Select]

hIndx = null

[jplevene]

Another SERIOUS bug has appeared, however it wasn't an issue when v11.1.0 was released.

The newly released jQuery v4.0.0 has REMOVED the depricated $.trim(), $.isFunction() and $.isArray()

This means pqGrid does not work at all with the latest jQuery 4.0.0.

For anybody that needs a temporary fix, add the following after installing jQuery and before pqGrid:

Code: [Select]

// Make sure $.trim() exists
if(!jQuery.trim) {
jQuery.trim = function(text) {
return text == null ? "" : (text + "").trim();
};
}
// Make sure $.isArray() exists
if(!jQuery.isArray) {
jQuery.isArray = Array.isArray;
}
// Make sure $.isFunction() exists
if(!jQuery.isFunction) {
jQuery.isFunction = function(obj) {
        return typeof(obj)==="function";
    };
}

[jplevene]

The column drag cursor doesn't go and is always visble.  See attached.

After loading the screen, the drop indicator icon is on the bottom left of the grid.  After moving a column, the drop indicator icon moves from the bottom and does not disappear.

For the icons I am using FontAwesome with the below css to map the Font Awesome icons :

Code: [Select]

.ui-icon {
    background-image: none !important; /* Hide old PNG */
    text-indent: 0 !important;
    overflow: visible !important;
    display: inline-block !important;
    text-align: center;
    width: 1.25em;
    height: 1em;
    line-height: 1;
    vertical-align: middle;
    position: relative;
margin-top: 2px !important;
}

/* --- 2. PSEUDO-ELEMENT SETUP --- */
.ui-icon::before {
    font-family: "Font Awesome 7 Free" !important;
    font-weight: 900 !important;
    display: block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}

...
.ui-icon-circle-arrow-n::before { content: "\f0aa"; } /* fa-circle-up */
...

[jplevene]

Last issue is a me problem.  CSS error, I removed the "!important" from the .ui-icon display:inline-block.