jQuery Grid Plugin - jqGridForum

30/06/2012
18:41

javiut

San Cristobal

Member

Members

Forum Posts: 6

Member Since:
29/12/2011

Offline

1

Hi Guys. i just move from JQGRID version 4.1.2 to 4.40 Cool for frozen columns but in 4.1.2 my search button is working smoothly Wink but in 4.40 you click on the button and nothing happens can somebody give a tip. Cry . thanks a lot a best regards…. Wink

10/07/2012
13:59

tony

Sofia, Bulgaria

Moderator

Members

Moderators

Forum Posts: 7721

Member Since:
30/10/2007

Offline

2

Hello,

In order to get help you will need to provide a code - providing a link to the problim will be the best.

Did you have get chance to look in the demos here

http://trirand.com/blog/jqgrid.....qgrid.html

where the search work as expected.

Regards

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

10/07/2012
17:10

javiut

San Cristobal

Member

Members

Forum Posts: 6

Member Since:
29/12/2011

Offline

3

hey Toni thanks for answering i just move from 4.12 to 4.40 version my search code was working perfect.i was using the callbacks to see what's wrong in version[4.40] in version 4.12 the callbacks are as follows.

* onInitializedSearch

* beforeShowSearch

* AfterShowSearch

everything is OK.

but when i change the <script src="JS/JQGrid/jquery.jqGrid.src.js"></script> 4.12

to

the same code it was working as above. gives me the following callbacks.

when i click on the button nothing happens. none callback methods is even called.

* onInitializedSearch[Missing] Never Called.

* beforeShowSearch[Missing]Never Called.

* AfterShowSearch[Missing]Never Called.

searchOptions

{

closeOnEscape:true,

modal:true,

afterShowSearch:function(){alert('afterShowSearch');},

onInitializeSearch:function(){alert('onInitalizedSearch');},

onSearch:function(){alert('on Search');},

beforeShowSearch: function(form)

{alert('beforeShowSearch');},onClose: function(data){}

}

this code is working very well in the last Year. i have try the different version of the CSS and that's is not the problem.

with 4.12 the BOX HTML is here

<div class="ui-widget ui-widget-content ui-corner-all ui-jqdialog jqmID1" id="searchmodfbox_flujo10" dir="ltr" style="width: 450px; height: auto; z-index: 90000; overflow: hidden; top: 234px; left: 139px; display: block;" tabindex="-1" role="dialog" aria-labelledby="searchhdfbox_flujo10" aria-hidden="false"><div class="ui-jqdialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix" id="searchhdfbox_flujo10" style="cursor: move;"><span class="ui-jqdialog-title" style="float: left;">Búsqueda...</span><a class="ui-jqdialog-titlebar-close ui-corner-all" href="javascript:void(0)" style="right: 0.3em;"><span class="ui-icon ui-icon-closethick"></span></a></div><div class="ui-jqdialog-content ui-widget-content" id="searchcntfbox_flujo10"><span><div style="overflow: auto;" class="searchFilter" id="fbox_flujo10"><table style="border: 0px none;" class="group ui-widget ui-widget-content"><tbody><tr style="display: none;" class="error"><th align="left" class="ui-state-error" colspan="5"></th></tr><tr><th align="left" colspan="5"><span></span></th></tr><tr><td class="first"></td><td class="columns"><select><option selected="selected" value="id2">Código Barra</option><option value="id">Codigo SAP</option><option value="descripcion">Descripcion</option><option value="rotacion">Rótacion</option><option value="sucursal">Sucursal</option><option value="unidades">U. Vendidas</option><option value="valores">Valores(Bs.)</option><option value="stock">U. Stock</option></select></td><td class="operators"><select class="selectopts"><option selected="selected" value="cn">contiene</option><option value="bw">empiece por</option><option value="ew">termina por</option><option value="eq">igual </option></select></td><td class="data"><input recreatefilter="false" style="width: 98%;" role="textbox" class="input-elm"></td><td></td></tr></tbody></table></div><table id="fbox_flujo10_2" style="border:0px none;margin-top:5px" class="EditTable"><tbody><tr><td colspan="2"><hr style="margin:1px" class="ui-widget-content"></td></tr><tr><td style="text-align:left" class="EditButton"><a class="fm-button ui-state-default ui-corner-all fm-button-icon-left ui-search" href="javascript:void(0)"><span class="ui-icon ui-icon-arrowreturnthick-1-w"></span>Limpiar</a></td><td class="EditButton"><a class="fm-button ui-state-default ui-corner-all fm-button-icon-right ui-reset" id="fbox_flujo10_search" href="javascript:void(0)"><span class="ui-icon ui-icon-search"></span>Buscar</a></td></tr></tbody></table></span></div><div class="jqResize ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se ui-icon-grip-diagonal-se"></div></div>

with 4.40 not Box is created. i have checked this with FireBug.

i want to upgrade because the frozen columns is this is not a option how can i use the frozencolumns in 4.12 i would be very grateful

12/07/2012
21:12

Grausam

Member

Members

Forum Posts: 10

Member Since:
27/02/2012

Offline

4

I am having the same problem.

I modified jqgrid.src at line 6878 function showFilter(_filter)

function showFilter(_filter) {

showFrm = $($t).triggerHandler("jqGridFilterBeforeShow", [_filter]);

console.log("shwFrm:",showFrm);

if(typeof(showFrm) === "undefined") {

showFrm = true;

}

if(showFrm && $.isFunction(p.beforeShowSearch)) {

console.log("calling before show search, showFrm is now:", showFrm);

showFrm = p.beforeShowSearch.call($t,_filter);

console.log("function called, showFrm is now:", showFrm);

}

if(showFrm) { … }

This produces:

shwFrm: undefined

calling before show search, showFrm is now: true

function called, showFrm is now: undefined

The showFrm variable is changed from true to undefined as a result of the p.beforeShowSearch.call() call, and since it's not true the form is never shown.

If you change line 6884 to be:

p.beforeShowSearch.call($t,_filter);

instead of

showFrm = p.beforeShowSearch.call($t,_filter);

everything works as before.

In the min file: change r=c.beforeShowSearch.call(e,b) to be c.beforeShowSearch.call(e,b).

Ben

Mods: It's also Line 82 in grid.formedit.js.

13/07/2012
02:29

javiut

San Cristobal

Member

Members

Forum Posts: 6

Member Since:
29/12/2011

Offline

5

Hey Grausam. do you solve the problem?? if you do can you upload the file fixed. thanks..

14/07/2012
07:11

zenixgrace

Jakarta

Member

Members

Forum Posts: 41

Member Since:
10/05/2010

Offline

6

Grausam said:

I am having the same problem.

I modified jqgrid.src at line 6878 function showFilter(_filter)

function showFilter(_filter) {

showFrm = $($t).triggerHandler("jqGridFilterBeforeShow", [_filter]);

console.log("shwFrm:",showFrm);

if(typeof(showFrm) === "undefined") {

showFrm = true;

}

if(showFrm && $.isFunction(p.beforeShowSearch)) {

console.log("calling before show search, showFrm is now:", showFrm);

showFrm = p.beforeShowSearch.call($t,_filter);

console.log("function called, showFrm is now:", showFrm);

}

if(showFrm) { … }

This produces:

shwFrm: undefined

calling before show search, showFrm is now: true

function called, showFrm is now: undefined

The showFrm variable is changed from true to undefined as a result of the p.beforeShowSearch.call() call, and since it's not true the form is never shown.

If you change line 6884 to be:

p.beforeShowSearch.call($t,_filter);

instead of

showFrm = p.beforeShowSearch.call($t,_filter);

everything works as before.

In the min file: change r=c.beforeShowSearch.call(e,b) to be c.beforeShowSearch.call(e,b).

Ben

Mods: It's also Line 82 in grid.formedit.js.

I have same problem and I try this solution.

But it's only work when the search button event is first call, but at the second call firebug give me an error (searchDialog is undefined).

here is my grid configuration:

$(function() {
   var myGrid = $('#listRDpConfirm').jqGrid({
       datatype: 'local',
       mtype: 'post',
       colNames: ['Code','Date','Method','Bank Account','Amount','Description','Status'],
       colModel: [
           {name:'rdpconfirm_code',index:'rdpconfirm_code',width:80},
           {name:'rdpconfirm_date',index:'rdpconfirm_date',width:80,
               formatter: 'date',
               formatoptions: {srcformat:'Y-m-d',newformat:'d M Y'},
               searchoptions: {
                   sopt: ['eq','ne'],
                   dataInit: function(el) {
                       $(el).datepicker({changeMonth:true,changeYear:true,dateFormat:'dd M yy',maxDate:'today'});
                   }
               }
           },
           {name:'rdpconfirm_method',index:'rdpconfirm_method',width:100,
               stype: 'select',
               searchoptions: {
                   sopt: ['eq'],
                   value: "1:Cash Deposit;2:ATM Transfer;3:e-Banking"
               }
           },
           {name:'rdpconfirm_bank',index:'rdpconfirm_bank',width:150,
               searchoptions: {
                   sopt: ['eq','ne','bw','bn','ew','en','cn','nc']
               }
           },
           {name:'rdpconfirm_amount',index:'rdpconfirm_amount',align:'right',
               formatter: 'currency',
               formatoptions: {thousandsSeparator: ','},
               searchtype: 'number',
               searchoptions: {
                   sopt: ['eq','ne','lt','le','gt','ge'],
                   dataInit: function(el) {
                       $(el)
                           .keypress(function(e) {
                               if (!checkCurrency(this,e)) return false;
                           })
                           .blur(function() {
                               if ($(el).val() != '')
                                   $(el).formatCurrency({symbol: ''});
                           })
                           .focus(function() {
                               $(el).toNumber();
                           })
                           .css('text-align', 'right');
                   }
               }
           },
           {name:'rdpconfirm_desc',index:'rdpconfirm_desc',width:300,
               searchoptions: {
                   sopt: ['eq','ne','bw','bn','ew','en','cn','nc']
               }
           },
           {name:'rdpconfirm_status',index:'rdpconfirm_status',
               stype: 'select',
               searchoptions: {
                   sopt: ['eq'],
                   value: "P:Pending Approval;A:Approve"
               }
           }
       ],
       autowidth: true,
       shrinkToFit: false,
       rowNum: 15,
       rowList: [15,30,45,60],
       pager: jQuery('#pListRDpConfirm'),
       sortname: 'rdpconfirm_date',
       height: 330,
       viewrecords: true,
       sortorder: 'asc',
       caption: 'Report Deposit Confirmation'
   }).jqGrid ('navGrid','#pListRDpConfirm',{edit:false,add:false,del:false,search:true},
       {}, // edit options
       {}, // add options
       {}, // del options
       {
           resize: true,
           multipleSearch: true,
           beforeShowSearch: function($form) {
               var searchDialog = $form[0],
                   oldrReDraw = searchDialog.reDraw, // save the original reDraw method
                   newrReDraw = function() {
                       // hide the AND/OR operation selection
                       $('select.opsel', searchDialog).hide();

                       /*setTimeout(function() {
                           // set focus in the last input field
                           $('input[type="text"]:last', searchDialog).focus();
                       }, 50);*/

                   }

               searchDialog.reDraw = function() {
                   oldrReDraw.call(searchDialog); // call the original reDraw method
                   newrReDraw();
               }

               newrReDraw();
           }
       } // search options
   /*).jqGrid ('navButtonAdd', '#pListRDpConfirm', {caption:'',buttonicon:'ui-icon-calculator',title:'choose column',
       onClickButton: function() {
           $(this).jqGrid('columnChooser', {
               width: 550,
               msel_opts: {dividerLocation: 0.5},
           });

           // add Search: label at column chooser form
           $("#colchooser_" + $.jgrid.jqID(this.id) + ' div.available>div.actions')
               .prepend('<label style="float:left;position:relative;margin-left:0.6em;top:0.6em">Search:</label>');
       }}*/
   ).jqGrid ('navButtonAdd', '#pListRDpConfirm', {caption:'Export to Excel',title:'Export to Excel',
       onClickButton: function() {
           exportExcel(this);
       }
   }).jqGrid('bindKeys', {onEnter: null});

   $.extend(true, $.jgrid.col, {
       dialog_opts: {
           minWidth: 470,
       }
   });
});

is there any solution?

16/07/2012
04:04

Grausam

Member

Members

Forum Posts: 10

Member Since:
27/02/2012

Offline

7

javiut said:Hey Grausam. do you solve the problem?? if you do can you upload the file fixed. thanks..

I don't know if this is a good fix. It works for me but I don't know if it will work for everyone. I am not a mod so I hope the fix will appear in 4.4.1.. I don't think the javascript fun.call() method returns anything and that's the bug. Can someone confirm this for me.

04/09/2012
23:42

Grausam

Member

Members

Forum Posts: 10

Member Since:
27/02/2012

Offline

8

This bug still exists in 4.4.1..

Here is an update:

The documentation on /jqgridwiki/doku.php?id=wiki:singe_searching

says the default is null. So you don't expect a return type.. However if you

return true it will work.

..

so this should be an appropriate fix.

beforeShowSearch: function() {

....

return true;

}

05/09/2012
00:40

javiut

San Cristobal

Member

Members

Forum Posts: 6

Member Since:
29/12/2011

Offline

9

oh. that seems to work... thanks. God Bless.

13/09/2012
03:48

reformer

Australia

New Member

Members

Forum Posts: 1

Member Since:
13/09/2012

Offline

10

I also had this same problem.

I found a solution here: http://stackoverflow.com/quest.....buttonicon

I was using jquery-1.8.0.min.js. I needed to revert back to jquery-1.7.2.min.js.

The search dialog now opens as expected.