jQuery Grid Plugin - jqGrid - Topic: onSortCol fails to fire with certain grid name http://www.trirand.com/blog/?page_id=393/bugs/onsortcol-fails-to-fire-with-certain-grid-name Simple:Press Version 5.7.5.3 tony on onSortCol fails to fire with certain grid name http://www.trirand.com/blog/?page_id=393/bugs/onsortcol-fails-to-fire-with-certain-grid-name#p29660 Bugs http://www.trirand.com/blog/?page_id=393/bugs/onsortcol-fails-to-fire-with-certain-grid-name#p29660 Hello,

Just tested your example (one to one copy/paste - of cource with my data ) and it works fine.

The simple test is to use FireFox and set in grid options

...

onSortCol: function(){

   lastId = false;

   console.log("onSort");

},

...

Thgis will tell you if it works, otherwiese check your additional code for some errors.

Regards

]]> Mon, 14 Oct 2013 15:30:36 +0300 aerowhiz on onSortCol fails to fire with certain grid name http://www.trirand.com/blog/?page_id=393/bugs/onsortcol-fails-to-fire-with-certain-grid-name#p29650 Bugs http://www.trirand.com/blog/?page_id=393/bugs/onsortcol-fails-to-fire-with-certain-grid-name#p29650 When my grid is named "dg1" the onSortCol event fails to fire. Tested only in Firefox 24. Noticed that header clicks no longer caused sorting to occur and no warning or errors were reported by the debugger. Backed out the changes between two backups (one working, one not working) until I found that changing the grid name and corresponding table id from "list" to "dg1" prompted the failure (Of course that was the last change I backed out:). The 3 character name "lis" also worked.

I do not see a way to attach a file, so here is the page that fails:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Shopflo</title>
    <meta name="author" content="Copyright 2013 Michael Cannon, Cannon Research" />
    <!-- Date: 2013-09-22 -->
    
    <link rel="stylesheet" type="text/css" media="screen" href="css/ui-redmond/jquery-ui-1.9.2.custom.css" />
    <link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />
    <link rel="stylesheet" type="text/css" media="screen" href="css/ui.multiselect.css" />
    <script src="js/jquery-1.9.1.js" type="text/javascript"></script>
    <script src="js/jquery-ui-1.10.3.custom.js" type="text/javascript"></script>
    <script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>
    <script src="js/ui.multiselect.js" type="text/javascript"></script>
    <script src="js/jquery.jqGrid.src.js" type="text/javascript"></script>
    
    <script type="text/javascript">
    var lastId=false;
    var team="";
    var cdate="2013-10-03";
    
    function lineBreak (max, txt) { //breaks up text longer than max into lines
      var  t='', nl='', sp='', w=0;
      var a = txt.split(' ')
      for (x in a) {
        if (w + a[x].length > max) {
          t += nl + a[x];
          w = a[x].length;
        } else {
          t += sp + a[x] ;
          w += a[x].length +1;
        }
        nl = '\n'; sp = ' ';
      }
      return t;
    }
    function orderTitle (row, val, r) {
      var h = r[1]==1 ? 'Yes' : 'No';
      var w = r[2]==1 ? 'Yes' : 'No';
      var ot = toCellDate(r[8]);
      var pt = toCellDate(r[9]);
      var dt = toCellDate(r[10]);
      return ' title="Order: ' + val + '\nHold: ' + h + '\nWaiting: ' + w + '\nAdvisor: ' + r[3] + '\nTag: ' + r[4] + '\nStatus: ' + r[5] +
      '\nLast Name: ' + r[6] + '\nFirst Name: ' + r[7] + '\nOrdered: ' + ot + '\nPromised: ' + pt + '\nDelivered: ' + dt +
      '\nLicense: ' + r[11] + '\nVin: ' + r[12] + '\nStock Number: ' + r[13] + '\nMileage: ' + r[14] + '\nYear: ' + r[15] + '\nMake: ' + r[16] +
      '\nModel: ' + r[17] + '\nColor: ' + r[18] + '\nAddress: ' + r[19] + '\nCity: ' + r[20] + '\nState: ' + r[21] + '\nZip: ' + r[22] +
      '\nPhone: ' + r[23] + '\nCell: ' + r[24] + '\nEmail: ' + r[25] + '\nCustomer: ' + r[26] + '\nLabor: ' + r[27] +
      '\nParts: ' + r[28] + '\nCost: ' + r[29] + '\n' + lineBreak(22, 'Remark: ' + r[30]) + '"';
    }
    function advisorTitle (row, val) {
      return ' title="Goofball' + 'asdf"';
    }
    function zfill (max, str) { //zerofill
      return str.length < max ? zfill(max, "0" + str) : str;
    }
    function toCellDate(cellvalue) {
      if (cellvalue == null) { return ""; }
      var d1 = new Date(cellvalue.replace(" ","T"));
      var d2 = cdate.split("-");
      var value = zfill(2, d1.getHours() + '') + ":" + zfill(2, d1.getMinutes() + ''); //time only if current date
      if (d1.getDate() != d2[2] || 1 + d1.getMonth() != d2[1] || d1.getFullYear() != d2[0]) {
        value = zfill(2, 1 + d1.getMonth() + "") + "/" + zfill(2, d1.getDate() + "") + "/" + d1.getFullYear() + " " + value;
      }
      return value;
    }
    function toSqlDate(cellvalue) {
      
    }
    function statusColor (row, val, r) {
      var s = r[31];
      var c = '';
      if (r[31] == 'C98') {
        c = '#E0E0E0'; //closed- gray
      } else if (r[2] == 1) {
        c = '#F0C0C0'; //waiting- red
      } else if (r[31] == 'I98') {
        c = '#C0C0C0'; //working- blue
      } else if (s[0] == 'C') {
        c = '#C0F0C0'; //completed- green
      } else if (s[0] == 'H') {
        c = '#F0F0C0'; //hold- yellow
      }
      if (c != '') {c = ' style="background-color:' + c + ';"'}
      return ' title = "' + r[31] + '"' + c;
    }

    jQuery.extend(jQuery.jgrid.defaults,{emptyrecords: "No Orders for this date.", loadtext: "Updating..."});
    $(function () {
      $("#dg1").jqGrid({
        url: "query.php?qtype=1&cdate=" + cdate + "&team=" + team,
        datatype: "jsonp",
        mtype: "GET",
        colNames: ["Ord", "H", "W", "Adv", "Tag", "Status", "Last Name", "First Name", "Ordered", "Promised", "Delivered",
                  "License", "Vin", "Stk #", "Miles", "Yr", "Make", "Model", "Color", "Address", "City", "S", "Zip", "Phone",
                  "Cell", "Email", "Cus", "Labor", "Parts", "Cost", "Remark"],
        colModel: [
          { name: "Order_Num", index:'Order_Num',width: 50, align: "left", hidedlg: true, frozen: true, resizable: false, cellattr: orderTitle },
          { name: "Hold", index:'Hold',width: 15, align: "center", hidedlg: true, frozen: true, resizable: false, formatter: 'checkbox',
                   formatoptions: { disabled: false }, cellattr: function() { return ' onclick="return false"'; } },
          { name: "Waiting ", index:'Waiting',width: 15, align: "center", hidedlg: true, frozen: true, resizable: false, formatter: 'checkbox',
                   formatoptions: { disabled: false }, cellattr: function() { return ' onclick="return false"'; } },
          { name: "Advisor", index:'Advisor',width: 45, align: "left", hidedlg: true, frozen: true, resizable: false, cellattr: advisorTitle },
          { name: "Tag", index:'Tag',width: 60, align: "left" },
          { name: "Status", index:'Status',width: 80, align: "left", cellattr: statusColor },
          { name: "Last_Name", index:'Last_Name',width: 90, align: "left"},
          { name: "First_Name", index:'Last_Name',width: 90, align: "left"},
          { name: "Order_Time", index:'Order_Time',width: 105, align: "right", formatter:toCellDate},
          { name: "Promised_Time", index:'Promised_Time',width: 105, align: "right", formatter:toCellDate},
          { name: "Delivered_Time", index:'Delivered_Time',width: 105, align: "right", formatter:toCellDate},
          { name: "License", index:'License',width: 65, align: "left"},
          { name: "Vin", index:'Vin',width: 140, align: "left"},
          { name: "Stock_Num", index:'Stock_Num',width: 65, align: "left"},
          { name: "Mileage", index:'Mileage',width: 55, align: "left"},
          { name: "Year", index:'Year',width: 40, align: "centered"},
          { name: "Make", index:'Make',width: 70, align: "left"},
          { name: "Model", index:'Model',width: 65, align: "left"},
          { name: "Color", index:'Color',width: 80, align: "left"},
          { name: "Address", index:'Address',width: 140, align: "left"},
          { name: "City", index:'City',width: 90, align: "left"},
          { name: "State", index:'State',width: 30, align: "center"},
          { name: "Zip", index:'Zip',width: 50, align: "center"},
          { name: "Phone", index:'Phone',width: 90, align: "left"},
          { name: "Cell", index:'Cell',width: 90, align: "left"},
          { name: "Email", index:'Email',width: 140, align: "left"},
          { name: "Customer", index:'Customer',width: 50, align: "left"},
          { name: "Labor_Sale", index:'Labor_Sale',width: 60, align: "right"},
          { name: "Parts_Sale", index:'Parts_Sale',width: 60, align: "right"},
          { name: "Parts_Cost", index:'Parts_Cost',width: 60, align: "right"},
          { name: "Remark", index:'Remark',width: 90, align: "left"}
        ],
        pager: "#pager",
        rowNum: 0,
        rowList: [],
        pgtext: false,
        pginput: false,
        pgbuttons: false,
        hidegrid: false,
        viewrecords: true,
        recordtext: "{2} Orders Shown",
        scrollrows: true,
        sortname: "Order_Num",
        sortorder: "DESC",
        width: 1000,
        height: 400,
        shrinkToFit: false,
        gridview: true,
        autoencode: true,
        caption: "My first grid",
        gridComplete: function(){
          jQuery("#dg1").jqGrid('setSelection', lastId, false);
        },
        onSelectRow: function(id){
          lastId = id;
        },
        onSortCol: function(){
          lastId = false;
        }
      });
      jQuery("#dg1").jqGrid('setFrozenColumns');
      jQuery("#dg1").jqGrid('navGrid','#pager',{add:false,edit:false,del:false,search:false,refresh:false});
      jQuery("#dg1").jqGrid('navButtonAdd','#pager',{
        caption: "Columns", title: "Reorder Columns",buttonicon: 'ui-icon-wrench', onClickButton : function (){
          jQuery("#dg1").jqGrid('columnChooser');
        }
      });
    });
    </script>

  </head>
  <body>
    <table id="dg1"><tr><td></td></tr></table>
    <div id="pager"></div>
  </body>
</html>

]]> Fri, 11 Oct 2013 22:48:13 +0300