jQuery UI Widgets Forums Grid Error on commit when deleting row in virtualmode

This topic contains 5 replies, has 4 voices, and was last updated by  Peter Stoev 3 years, 2 months ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author

  • Odie
    Participant

    I am getting the following javascript error tying to commit(true) after a successful ajax call to delete a record on the server. I have used the same methodology numerous times in the past with success. The only difference this time is I am using virtual mode for paging.

    I have also included the applicable code snippets below.

    Thank you,

    Doug

    Error:

    
    TypeError: j[h] is undefined                        jqx-all.js:7:1694263
    
    b.jqx.dataview/this.loadflatrecords                 https://example.com/jqwidgets/jqx-all.js:7:1694263
    b.jqx.dataview/this.updateview                      https://example.com/jqwidgets/jqx-all.js:7:1695081
    b.jqx.dataview/this.reload                          https://example.com/jqwidgets/jqx-all.js:7:1693298
    a.jqx.dataview.sort/this.sortby                     https://example.com/jqwidgets/jqx-all.js:7:1750603
    f                                                   https://example.com/jqwidgets/jqx-all.js:7:1610252
    g                                                   https://example.com/jqwidgets/jqx-all.js:7:1610445
    gridDeleteRow/<                                     https://example.com/Core/marsCore.min.js:3:304
    i                                                   https://example.com/jquery/jquery-base.js:2:27146
    fireWith                                            https://example.com/jquery/jquery-base.js:2:27914
    z                                                   https://example.com/jquery/jquery-base.js:4:12118
    c/<                                                 https://example.com/jquery/jquery-base.js:4:15680
    

    Applicable Code Snippets

    
      IV04Grid.prototype.setupGrid = function() {
        var daObject;
        var initrowdetails;
        var settings;
    
        //  Define Data Adapter source object
    
        this.daSource = {
          async: false,
          beforeprocessing: function (data) {
            $this.daSource.totalrecords = data[0].ttlRows;
          },
          cache: false,
          data: {
            action:   'buildGrid',
            class:    'MARS::IV::IV04',
            element:   this.grdId,
            selClt:   $('#selTabClt').val(),
            sid_cn:    sessionStorage.sidCN,
            modeGrid: 'CO'
          },
          datatype: 'json',
          datafields: [
            {
              name: 'id',
              type: 'number'
            },
            {
              name: 'itm_no',
              type: 'string'
            },
            {
              name: 'dscr',
              type: 'string'
            },
            {
              name: 'active',
              type: 'bool'
            }
          ],
          deleterow: function(rowid, commit) {
            gridDeleteRow( {
              commit:  commit,
              tbl:    'iv_itm_mst',
              val:     rowid
            } );
          },
          filter: function() {
            $($this.grdSelector).jqxGrid('updatebounddata', 'filter');
          },
          id: 'id',
          root: 'rows',
          sortcolumn: 'itm_no',
          sortdirection: 'asc',
          url: marsHandler
        };
    
        //  Define Data Adapter object
    
        daObject = marsDataAdapter(this.daSource);
    
        //  Define row detail grid
    
        initrowdetails = this.setupGridDetail();
    
        //  Define settings object for Item grid
    
        settings = {
          autoheight: true,
          columns: [
            {
              datafield: 'id',
              hidden:     true,
              text:      'ID'
            },
            {
              datafield: 'itm_no',
              text:      'Item No',
              width:      150
            },
            {
              datafield: 'dscr',
              text:      'Description',
              width:      280
            },
            {
              cellsrenderer: function (row, columnfield, value) {
                if (value == true) {
                  return gridCheckMark();
                }
                else {
                  return '&nbsp';
                }
              },
              datafield:  'active',
              text:       'Active',
              width:       50
            },
            {
              cellsrenderer: function () {
                return gridIcon( {
                  icon:    'Edit',
                  disabled: false
                } );
              },
              filterable: false,
              sortable:   false,
              text:       '',
              width:      25
            },
            {
              cellsrenderer: function () {
                return gridIcon( {
                  icon:    'Clone',
                  disabled: false
                } );
              },
              filterable: false,
              sortable:   false,
              text:       '',
              width:      25
            },
            {
              cellsrenderer: function () {
                return gridIcon( {
                  icon:     'Delete',
                  disabled:  false
                } );
              },
              filterable: false,
              sortable:   false,
              text:       '',
              width:      25
            }
          ],
          columnsresize:       false,
          initrowdetails:      initrowdetails,
          filterable:          true,
          height:              580,
          pageable:            true,
          pagesize:            15,
          pagesizeoptions:    ['10','15','20'],
          rendergridrows: function (params) {
            return params.data;
          },
          rowdetails:          true,
          rowdetailstemplate: {
            rowdetails:       "<div id='grid'></div>",
            rowdetailsheight:  117,
            rowdetailshidden:  true
          },
          selectionmode:      'singlerow',
          sortable:            true,
          source:              daObject,
          theme:              'mars',
          virtualmode:         true,
          width:               845
        };
    
        //  Create grid
    
        $(this.grdSelector).jqxGrid(settings);
      };
    
      IV04Grid.prototype.setupListeners = function() {
        $(this.grdSelector).on('cellclick', function(event) {
          var args  = event.args;
          var rowid = $(this).jqxGrid('getrowid', args.rowindex);
    
          if (args.columnindex == 7) {
            if (confirmDelete()) {
              $(this).jqxGrid('deleterow', rowid);
            }
          }
        } );
      };
    

    Odie
    Participant

    I forgot to include the gridDeleteRow function which might be applicable.

    
    function gridDeleteRow(obj) {
      var settings;
    
      settings = {
        action:  'delete',
        class:   'MARSCLASS::Web::Shared',
        element: 'record',
        sid_cn:   sessionStorage.sidCN,
        tbl:      obj.tbl,
        val:      obj.val
      };
    
      if (obj.dbase) { settings.dbase = obj.dbase }
      if (obj.col)   { settings.col   = obj.col }
    
      $.getJSON(marsHandler, settings)
       .done(function(objJSON) {
         if (objJSON.STATUS == 'OK') {
           obj.commit(true);
         }
         else {
           obj.commit(false);
           objJSON.ERRORS.reDirect = 0;
           displayError(objJSON);
         }
       } )
       .fail(function(objJSON, txtStatus, errorThrown) {
         ajaxFail(objJSON, txtStatus, errorThrown);
       } );
    };
    

    Odie
    Participant

    This is the first time I have posted to a forum. I’ve not received any responses so I am asking if I’ve not posted correctly or am I leaving something out.

    Thank you.


    Stanislav
    Participant

    Hello Odie,

    You can use a simple trick to get more information from the error you are getting, just replace jqx-all with the exact references for the widgets, that way the error will tell you exactly what is wrong.

    I would like to suggest you to take a look at this example’demo’ on your site. Create, Remove, Update

    Best Regards,
    Stanislav

    jQWidgets Team
    http://www.jqwidgets.com/


    JenkeNg
    Participant

    I seem to have encountered the same problem, in the virtual mode deleterow, the entire page will appear blank, the error feedback location is jqxGrid.js 13765 lines of ‘j[h].value’ here. But when I turned off virtualmode, the delete works fine, but then I can’t page, it seems that there is a conflict between the two. My jqxWidgets version is v5.5.0. I have posted another post on this issue, but I have not received a valid response.


    Peter Stoev
    Keymaster

    Hi,

    In virtual mode, the data that is displayed in the Grid is the data returned by the custom code in the rendergridrows function. Deleting a row in Virtual Mode with the Grid API only calls the custom source object deleterow function and re-renders the Grid.

    Best Regards,
    Peter

    jQWidgets Team
    https://www.jqwidgets.com

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.