Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Loading…

jQuery Events in jqGrid (still without form editing and tree grid modules) #236

Closed
wants to merge 5 commits into from

3 participants

@OlegKi

The changes are made based on my suggestion http://www.trirand.com/blog/?page_id=393/feature-request/usage-of-jquery-events-in-jqgrid-together-with-callback-functions-used-currently/#p25559

jqGridGridComplete, jqGridLoadComplete are introduced to make some default actions, like project defaults.

jqGridAfterGridComplete, jqGridAfterLoadComplete are introduced to make some corections after possible grid modification inside of loadComplete method.

TODOs:
I didn't introduced events for grid.formedit.js and grid.treegrid.js

In the grid.formedit.js one should choose the name converstion for the events. One can share one event for add and edit row, but include options as additional parameter (like in inline edit).
Additionally one should set grid as this in all callback of grid.formedit.js (use .call($t, ...))

Signed-off-by: Dr. Oleg Kiriljuk oleg.kiriljuk@ok-soft-gmbh.com

@wildraid

Very nice! Events are the biggest thing i've missed in jqGrid.

OlegKi added some commits
@OlegKi OlegKi Synchronization of the searching toolbar contain with the current val…
…ues from postData.filters

Signed-off-by: Dr. Oleg Kiriljuk <oleg.kiriljuk@ok-soft-gmbh.com>
59c86ec
@OlegKi OlegKi fill the contain of the searching toolbar based on the postData.filte…
…rs at the end of the toolbar creation.

Signed-off-by: Dr. Oleg Kiriljuk <oleg.kiriljuk@ok-soft-gmbh.com>
b1ce5e6
@OlegKi OlegKi set this for formatters and unformatters
Signed-off-by: Dr. Oleg Kiriljuk <oleg.kiriljuk@ok-soft-gmbh.com>
1f4f0af
@OlegKi OlegKi extend options of formatter with the information from the colNames fo…
…r the column.

Signed-off-by: Dr. Oleg Kiriljuk <oleg.kiriljuk@ok-soft-gmbh.com>
7255f67
@OlegKi OlegKi If cell contain has complex structur then `e.target` from the `click`…
… event on the cell can be a child element of `<td>`. If inside of `onSelectRow` the `editRow` will be called the contain of the `<td>` will be overwritten by `<input>` or other control.

In the case the `e.target` will be *modified*. The DOM element `e.target` will be not more the child of the `<td>` and `e.target.parentNode` will be set to `null`.

The old (current) code of jqGrid called `$.jgrid.getCellIndex(td)` *after* the `setSelection`. So inside of [the line](https://github.com/tonytomov/jqGrid/blob/v4.3.1/js/grid.base.js#L37) exception will be fired. In the case not only `c.parentNode.cells` could be not calculated in IE, but even `c` will be undefined because `c` calculated as `c.closest("td,th")[0]` will be `undefined`.

To fix the bug will be suggested to change the order of `onCellSelect` and `setSelection` or `editCell` calls.

Signed-off-by: Dr. Oleg Kiriljuk <oleg.kiriljuk@ok-soft-gmbh.com>
3877603
@tonytomov tonytomov closed this
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Commits on Jan 14, 2012
  1. @OlegKi

    Synchronization of the searching toolbar contain with the current val…

    OlegKi authored
    …ues from postData.filters
    
    Signed-off-by: Dr. Oleg Kiriljuk <oleg.kiriljuk@ok-soft-gmbh.com>
  2. @OlegKi

    fill the contain of the searching toolbar based on the postData.filte…

    OlegKi authored
    …rs at the end of the toolbar creation.
    
    Signed-off-by: Dr. Oleg Kiriljuk <oleg.kiriljuk@ok-soft-gmbh.com>
  3. @OlegKi

    set this for formatters and unformatters

    OlegKi authored
    Signed-off-by: Dr. Oleg Kiriljuk <oleg.kiriljuk@ok-soft-gmbh.com>
  4. @OlegKi

    extend options of formatter with the information from the colNames fo…

    OlegKi authored
    …r the column.
    
    Signed-off-by: Dr. Oleg Kiriljuk <oleg.kiriljuk@ok-soft-gmbh.com>
Commits on Jan 19, 2012
  1. @OlegKi

    If cell contain has complex structur then `e.target` from the `click`…

    OlegKi authored
    … event on the cell can be a child element of `<td>`. If inside of `onSelectRow` the `editRow` will be called the contain of the `<td>` will be overwritten by `<input>` or other control.
    
    In the case the `e.target` will be *modified*. The DOM element `e.target` will be not more the child of the `<td>` and `e.target.parentNode` will be set to `null`.
    
    The old (current) code of jqGrid called `$.jgrid.getCellIndex(td)` *after* the `setSelection`. So inside of [the line](https://github.com/tonytomov/jqGrid/blob/v4.3.1/js/grid.base.js#L37) exception will be fired. In the case not only `c.parentNode.cells` could be not calculated in IE, but even `c` will be undefined because `c` calculated as `c.closest("td,th")[0]` will be `undefined`.
    
    To fix the bug will be suggested to change the order of `onCellSelect` and `setSelection` or `editCell` calls.
    
    Signed-off-by: Dr. Oleg Kiriljuk <oleg.kiriljuk@ok-soft-gmbh.com>
This page is out of date. Refresh to see the latest.
View
39 js/grid.base.js
@@ -978,11 +978,13 @@ $.fn.jqGrid = function( pin ) {
formatter = function (rowId, cellval , colpos, rwdat, _act){
var cm = ts.p.colModel[colpos],v;
if(typeof cm.formatter !== 'undefined') {
- var opts= {rowId: rowId, colModel:cm, gid:ts.p.id, pos:colpos };
+ var opts= {rowId: rowId, colModel:cm, gid:ts.p.id, pos:colpos,
+ colName: (typeof ts.p.colNames !== 'undefined' && typeof ts.p.colNames[colpos] !== 'undefined') ?
+ ts.p.colNames[colpos] : (typeof cm.label !== 'undefined' ? cm.label : cm.name)};
if($.isFunction( cm.formatter ) ) {
v = cm.formatter.call(ts,cellval,opts,rwdat,_act);
} else if($.fmatter){
- v = $.fn.fmatter(cm.formatter, cellval,opts, rwdat, _act);
+ v = $.fn.fmatter.call(ts,cm.formatter,cellval,opts,rwdat,_act);
} else {
v = cellVal(cellval);
}
@@ -2336,14 +2338,20 @@ $.fn.jqGrid = function( pin ) {
cSel = $(ts).triggerHandler("jqGridBeforeSelectRow", [ptr[0].id, e]);
cSel = (cSel === false || cSel === 'stop') ? false : true;
if(cSel && $.isFunction(ts.p.beforeSelectRow)) { cSel = ts.p.beforeSelectRow.call(ts,ptr[0].id, e); }
- if (td.tagName == 'A' || ((td.tagName == 'INPUT' || td.tagName == 'TEXTAREA' || td.tagName == 'OPTION' || td.tagName == 'SELECT' ) && !scb) ) { return this; }
+ if (td.tagName == 'A' || ((td.tagName == 'INPUT' || td.tagName == 'TEXTAREA' || td.tagName == 'OPTION' || td.tagName == 'SELECT' ) && !scb) ) { return; }
if(cSel === true) {
+ ri = ptr[0].id;
+ ci = $.jgrid.getCellIndex(td);
+ tdHtml = $(td).closest("td,th").html();
+ $(ts).triggerHandler("jqGridCellSelect", [ri,ci,tdHtml,e]);
+ if($.isFunction(ts.p.onCellSelect)) {
+ ts.p.onCellSelect.call(ts,ri,ci,tdHtml,e);
+ }
if(ts.p.cellEdit === true) {
if(ts.p.multiselect && scb){
$(ts).jqGrid("setSelection",ptr[0].id,true,e);
} else {
ri = ptr[0].rowIndex;
- ci = $.jgrid.getCellIndex(td);
try {$(ts).jqGrid("editCell",ri,ci,true);} catch (_) {}
}
} else if ( !ts.p.multikey ) {
@@ -2374,18 +2382,7 @@ $.fn.jqGrid = function( pin ) {
$("#jqg_"+$.jgrid.jqID(ts.p.id)+"_"+ptr[0].id)[ts.p.useProp ? 'prop' : 'attr']("checked", scb);
}
}
- ri = ptr[0].id;
- ci = $.jgrid.getCellIndex(td);
- tdHtml = $(td).html();
- $(ts).triggerHandler("jqGridCellSelect", [ri,ci,tdHtml,e]);
- if($.isFunction(ts.p.onCellSelect)) {
- ts.p.onCellSelect.call(ts,ri,ci,tdHtml,e);
- }
- //e.stopPropagation();
}
- //else {
- return this;
- //}
}).bind('reloadGrid', function(e,opts) {
if(ts.p.treeGrid ===true) { ts.p.datatype = ts.p.treedatatype;}
if (opts && opts.current) {
@@ -2732,7 +2729,7 @@ $.jgrid.extend({
res[nm] = $.jgrid.htmlDecode($("span:first",this).html());
} else {
try {
- res[nm] = $.unformat(this,{rowId:ind.id, colModel:$t.p.colModel[i]},i);
+ res[nm] = $.unformat.call($t,this,{rowId:ind.id, colModel:$t.p.colModel[i]},i);
} catch (e){
res[nm] = $.jgrid.htmlDecode($(this).html());
}
@@ -2794,7 +2791,7 @@ $.jgrid.extend({
$(this.p.colModel).each(function(i){
nm = this.name;
if( data[nm] !== undefined) {
- lcdata[nm] = this.formatter && typeof(this.formatter) === 'string' && this.formatter == 'date' ? $.unformat.date(data[nm],this) : data[nm];
+ lcdata[nm] = this.formatter && typeof(this.formatter) === 'string' && this.formatter == 'date' ? $.unformat.date.call(t,data[nm],this) : data[nm];
vl = t.formatter( rowid, data[nm], i, data, 'edit');
title = this.title ? {"title":$.jgrid.stripHtml(vl)} : {};
if(t.p.treeGrid===true && nm == t.p.ExpandColumn) {
@@ -2883,7 +2880,7 @@ $.jgrid.extend({
for(i = gi+si+ni; i < t.p.colModel.length;i++){
cm = t.p.colModel[i];
nm = cm.name;
- lcdata[nm] = cm.formatter && typeof(cm.formatter) === 'string' && cm.formatter == 'date' ? $.unformat.date(data[nm],cm) : data[nm];
+ lcdata[nm] = cm.formatter && typeof(cm.formatter) === 'string' && cm.formatter == 'date' ? $.unformat.date.call(t,data[nm],cm) : data[nm];
v = t.formatter( rowid, $.jgrid.getAccessor(data,nm), i, data, 'edit');
prp = t.formatCol(i,1,v, data, rowid, true);
row += "<td role=\"gridcell\" aria-describedby=\""+t.p.id+"_"+nm+"\" "+prp+">"+v+"</td>";
@@ -3239,7 +3236,7 @@ $.jgrid.extend({
}
if($t.p.datatype == "local") {
var cm = $t.p.colModel[pos], index;
- nData = cm.formatter && typeof(cm.formatter) === 'string' && cm.formatter == 'date' ? $.unformat.date(nData,cm) : nData;
+ nData = cm.formatter && typeof(cm.formatter) === 'string' && cm.formatter == 'date' ? $.unformat.date.call($t,nData,cm) : nData;
index = $t.p._index[rowid];
if(typeof index != "undefined") {
$t.p.data[index][cm.name] = nData;
@@ -3272,7 +3269,7 @@ $.jgrid.extend({
var ind = $t.rows.namedItem(rowid);
if(ind) {
try {
- ret = $.unformat($("td:eq("+pos+")",ind),{rowId:ind.id, colModel:$t.p.colModel[pos]},pos);
+ ret = $.unformat.call($t,$("td:eq("+pos+")",ind),{rowId:ind.id, colModel:$t.p.colModel[pos]},pos);
} catch (e){
ret = $.jgrid.htmlDecode($("td:eq("+pos+")",ind).html());
}
@@ -3301,7 +3298,7 @@ $.jgrid.extend({
while(i<ln){
if($($t.rows[i]).hasClass('jqgrow')) {
try {
- val = $.unformat($($t.rows[i].cells[pos]),{rowId:$t.rows[i].id, colModel:$t.p.colModel[pos]},pos);
+ val = $.unformat.call($t,$($t.rows[i].cells[pos]),{rowId:$t.rows[i].id, colModel:$t.p.colModel[pos]},pos);
} catch (e) {
val = $.jgrid.htmlDecode($t.rows[i].cells[pos].innerHTML);
}
View
6 js/grid.celledit.js
@@ -62,7 +62,7 @@ $.jgrid.extend({
$(cc).addClass("edit-cell ui-state-highlight");
$($t.rows[iRow]).addClass("selected-row ui-state-hover");
try {
- tmp = $.unformat(cc,{rowId: $t.rows[iRow].id, colModel:cm},iCol);
+ tmp = $.unformat.call($t,cc,{rowId: $t.rows[iRow].id, colModel:cm},iCol);
} catch (_) {
tmp = ( cm.edittype && cm.edittype == 'textarea' ) ? $(cc).text() : $(cc).html();
}
@@ -467,14 +467,14 @@ $.jgrid.extend({
if (mthd=='dirty') {
if ($(this).hasClass('dirty-cell')) {
try {
- res[nm] = $.unformat(this,{rowId:$t.rows[j].id, colModel:$t.p.colModel[i]},i);
+ res[nm] = $.unformat.call($t,this,{rowId:$t.rows[j].id, colModel:$t.p.colModel[i]},i);
} catch (e){
res[nm] = $.jgrid.htmlDecode($(this).html());
}
}
} else {
try {
- res[nm] = $.unformat(this,{rowId:$t.rows[j].id,colModel:$t.p.colModel[i]},i);
+ res[nm] = $.unformat.call($t,this,{rowId:$t.rows[j].id,colModel:$t.p.colModel[i]},i);
} catch (e) {
res[nm] = $.jgrid.htmlDecode($(this).html());
}
View
70 js/grid.custom.js
@@ -132,6 +132,7 @@ $.jgrid.extend({
p = $.extend({
autosearch: true,
searchOnEnter : true,
+ synchronizeToolbar: true,
beforeSearch: null,
afterSearch: null,
beforeClear: null,
@@ -282,6 +283,71 @@ $.jgrid.extend({
}
}
};
+ var refreshSearchingToolbar = function () {
+ var $this = $(this), postData, filters, i, l, rules, rule, iCol, cm, cmi, control, tagName,
+ getColumnIndex = function (grid, columnIndex) {
+ var cm = grid.jqGrid('getGridParam', 'colModel'), i, l = cm.length;
+ for (i = 0; i < l; i++) {
+ if ((cm[i].index || cm[i].name) === columnIndex) {
+ return i; // return the colModel index
+ }
+ }
+ return -1;
+ };
+
+ if (!this.grid) { return; }
+
+ postData = $this.jqGrid('getGridParam', 'postData');
+ cm = $this.jqGrid('getGridParam', 'colModel');
+
+ if (typeof (postData.filters) === "string" &&
+ typeof (this.ftoolbar) === "boolean" && this.ftoolbar) {
+ // first clear the searching toolbar
+ for (i = 0, l = cm.length; i < l; i++) {
+ control = $("#gs_" + $.jgrid.jqID(cm[i].name));
+ if (control.length > 0) {
+ tagName = control[0].tagName.toUpperCase();
+ if (tagName === "SELECT") { // && cmi.stype === "select"
+ control.find("option[value='']")
+ .attr('selected', 'selected');
+ } else if (tagName === "INPUT") {
+ control.val('');
+ }
+ }
+ }
+
+ filters = $.parseJSON(postData.filters);
+ if (filters && filters.groupOp === "AND" && typeof (filters.groups) === "undefined") {
+ // only in case of advance searching without grouping we import filters in the
+ // searching toolbar
+ rules = filters.rules;
+ for (i = 0, l = rules.length; i < l; i++) {
+ rule = rules[i];
+ iCol = getColumnIndex($this, rule.field);
+ if (iCol >= 0) {
+ cmi = cm[iCol];
+ control = $("#gs_" + $.jgrid.jqID(cmi.name));
+ if (control.length > 0 &&
+ (((typeof (cmi.searchoptions) === "undefined" ||
+ typeof (cmi.searchoptions.sopt) === "undefined")
+ && rule.op === p.defaultSearch) ||
+ (typeof (cmi.searchoptions) === "object" &&
+ $.isArray(cmi.searchoptions.sopt) &&
+ cmi.searchoptions.sopt.length > 0 &&
+ cmi.searchoptions.sopt[0] === rule.op))) {
+ tagName = control[0].tagName.toUpperCase();
+ if (tagName === "SELECT") { // && cmi.stype === "select"
+ control.find("option[value='" + $.jgrid.jqID(rule.data) + "']")
+ .attr('selected', 'selected');
+ } else if (tagName === "INPUT") {
+ control.val(rule.data);
+ }
+ }
+ }
+ }
+ }
+ }
+ };
// create the row
function bindEvents(selector, events) {
var jElem = $(selector);
@@ -431,6 +497,10 @@ $.jgrid.extend({
this.triggerToolbar = triggerToolbar;
this.clearToolbar = clearToolbar;
this.toggleToolbar = toggleToolbar;
+ if (p.synchronizeToolbar) {
+ refreshSearchingToolbar.call($t);
+ $($t).bind('jqGridLoadComplete.filterToolbar', refreshSearchingToolbar);
+ }
});
},
View
4 js/grid.formedit.js
@@ -433,7 +433,7 @@ $.jgrid.extend({
tmp = $("td:eq("+i+")",obj.rows[ind]).text();
} else {
try {
- tmp = $.unformat($("td:eq("+i+")",obj.rows[ind]),{rowId:rowid, colModel:this},i);
+ tmp = $.unformat.call(obj,$("td:eq("+i+")",obj.rows[ind]),{rowId:rowid, colModel:this},i);
} catch (_) {
tmp = (this.edittype && this.edittype == "textarea") ? $("td:eq("+i+")",obj.rows[ind]).text() : $("td:eq("+i+")",obj.rows[ind]).html();
}
@@ -534,7 +534,7 @@ $.jgrid.extend({
tmp = $(this).text();
} else {
try {
- tmp = $.unformat($(this),{rowId:rowid, colModel:cm[i]},i);
+ tmp = $.unformat.call(obj,$(this),{rowId:rowid, colModel:cm[i]},i);
} catch (_) {
tmp = cm[i].edittype=="textarea" ? $(this).text() : $(this).html();
}
View
2  js/grid.inlinedit.js
@@ -60,7 +60,7 @@ $.jgrid.extend({
if(treeg) { tmp = $("span:first",this).html();}
else {
try {
- tmp = $.unformat(this,{rowId:rowid, colModel:cm[i]},i);
+ tmp = $.unformat.call($t,this,{rowId:rowid, colModel:cm[i]},i);
} catch (_) {
tmp = ( cm[i].edittype && cm[i].edittype == 'textarea' ) ? $(this).text() : $(this).html();
}
View
6 js/jquery.fmatter.js
@@ -55,8 +55,8 @@
var v=cellval;
opts = $.extend({}, $.jgrid.formatter, opts);
- if ($.fn.fmatter[formatType]){
- v = $.fn.fmatter[formatType](cellval, opts, rwd, act);
+ if ($.isFunction($.fn.fmatter[formatType])){
+ v = $.fn.fmatter[formatType].call(this, cellval, opts, rwd, act);
}
return v;
};
@@ -493,7 +493,7 @@
re = /([\.\*\_\'\(\)\{\}\+\?\\])/g,
unformatFunc = options.colModel.unformat||($.fn.fmatter[formatType] && $.fn.fmatter[formatType].unformat);
if(typeof unformatFunc !== 'undefined' && $.isFunction(unformatFunc) ) {
- ret = unformatFunc($(cellval).text(), options, cellval);
+ ret = unformatFunc.call(this, $(cellval).text(), options, cellval);
} else if(!$.fmatter.isUndefined(formatType) && $.fmatter.isString(formatType) ) {
var opts = $.jgrid.formatter || {}, stripTag;
switch(formatType) {
Something went wrong with that request. Please try again.