Could not addrow with data in virtualmode

[jamieoroParticipant]

Hello!

I have problem adding new row to a grid if virtualmode is set to true.

// prepare the data
 var source = {
  //localdata: dataReturn,
  datatype: "json",
  datafields:
  [
   { name: 'itemLocationId', map: 'item_location_id', type: 'string' },
   { name: 'itemLocationItemCode', map: 'item_code', type: 'string' },
   { name: 'itemLocationItemName', map: 'item_name', type: 'string' },
   { name: 'itemLocationItemSmallestUomName', map: 'uom', type: 'string' },
   { name: 'itemLocationLocationCode', map: 'loc_code', type: 'string' },
   { name: 'itemLocationReorderLevel', map: 'recorder_level', type: 'float' },
   { name: 'itemLocationReorderQty', map: 'reorder_qty', type: 'float' },
   { name: 'itemLocationMinLevel', map: 'critical_level', type: 'float' },
   { name: 'itemLocationMaxLevel', map: 'max_level', type: 'float' },
   { name: 'itemLocationQoh', map: 'loc_qoh', type: 'float' },
   //{ name: 'itemLocationStorageAddressCode', map: 'qoh', type: 'string' },
   { name: 'itemLocationReplenishMethodCode', map: 'replenish_method', type: 'string' },
   { name: 'itemLocationActiveInd', map: 'active_boolean', type: 'bool' },
   { name: 'itemLocationSupplyingLocationCode', map: 'supp_loc_code', type: 'string' },
   { name: 'itemLocationInventory', map: 'inventory_boolean', type: 'bool' },
   { name: 'itemLocationAutoPutAway', map: 'autoputaway_boolean', type: 'bool'}
 ],
 url: '<?php echo Router::url(array('controller' => 'ItemLocationsSOMgr', 'action' => 'itemLocationListing', '')) . '/' . $locCode2; ?>',
 root: 'Rows',
 cache: false,
 beforeprocessing: function(data)
 {		
   source.totalrecords = data.TotalRows;
 },
};
var dataAdapter = new $.jqx.dataAdapter(source);

$("#itemLocationListGrid").jqxGrid({
  sortable: true,
  filterable: true,
  pageable: true, 
  source: dataAdapter,
  width: '100%',
  autorowheight:true,
  columnsresize: true,
  pageable: true,
  virtualmode: true,
  rendergridrows: function()
  {
    return dataAdapter.records;     
  },
  editable: true,
  columnsheight: 50,
  columns: [
    {text: 'Item Code', datafield: 'itemLocationItemCode', width: 150, align: 'center', columntype: 'combobox', nullable: true,
     createeditor: function(row, cellvalue, editor, celltext, cellwidth, cellheight) { 				   
     dropDownItemCodeGridCreateEditor(row, cellvalue, editor, celltext, cellwidth, cellheight);
     },
     initeditor: function(row, cellvalue, editor, celltext, cellwidth, cellheight) {
     dropDownItemCodeGridInitEditor(row, cellvalue, editor, celltext, cellwidth, cellheight);
     },
     validation: function(cell, value) {
       var obj = {
        //Dont change        //dataField in ur grid
	item_code: 'itemLocationItemCode',
	item_name: 'itemLocationItemName',
	item_uom: 'itemLocationItemSmallestUomName',
	validateYN: 'validateYN',
	item_category: 'itemLocationCategoryCode'
      };
      var gridId = 'itemLocationListGrid';
      return dropDownItemGridValidatation(cell, value, gridId, obj);
      }
      },
     {text: 'Item Name', columntype: 'textbox', datafield: 'itemLocationItemName', align:'center', width: 200}, 
     {text: 'UOM', columntype: 'textbox', datafield: 'itemLocationItemSmallestUomName', width: 100, align:'center'}, 
     {text: 'Supplying Location', datafield: 'itemLocationSupplyingLocationCode', align: 'center', width: 180, columntype: 'dropdownlist', 
      displayfield: 'itemLocationSupplyingLocationCode',  valueMember: "ID", 
      initeditor: function(row, value, editor) {
        editor.jqxDropDownList({
	  source: dropdownListAdapterStore, 
	  displayMember: "masterLocationCode", 
	  valueMember: "masterLocationCode", 
	  placeHolder: "Please Select",
	  renderer: function (index, label, value) 
	  {
	    var datarecord = dropdownListAdapterStore.records[index];
	    return datarecord.masterLocationCode + " - " + datarecord.masterLocationDescription;
  	  }
        });
        }
	}, 
       {text: 'Re-Order<br />Level', datafield: 'itemLocationReorderLevel', width: 80, cellsalign: 'right', align: 'center', cellsformat: 'F2',
	validation: function(cell, value) {
  	  var qty = parseFloat(value);
	   if (qty < 0) {
	     return {result: false, message: "Quantity can't less than 0!"};
	   } else {
	     return true;
	   }
	  }
	}, 
	{text: 'Re-Order<br />Qty', columntype: 'textbox', datafield: 'itemLocationReorderQty', width: 80, align:'center',cellsalign: 'right',  
         cellsformat: 'D2', 
         validation: function(cell, value) {
           var qty = parseFloat(value);
	    if (qty < 0) {
	     return {result: false, message: "Quantity can't less than 0!"};
	    } else {
	     return true;
	    }
	   }
	}, 
	{text: 'Critical<br />Level', columntype: 'textbox', datafield: 'itemLocationMinLevel', width: 80, align:'center',cellsalign: 'right', 
         cellsformat: 'D2',
	 validation: function(cell, value) {
	   var qty = parseFloat(value);
	   if (qty < 0) {
	    return {result: false, message: "Quantity can't less than 0!"};
	   } else {
	     return true;
	   }
	  }
	}, 
	{text: 'Max<br />Level', columntype: 'textbox', datafield: 'itemLocationMaxLevel', width: 80, align:'center',cellsalign: 'right', 
         cellsformat: 'D2',
	 validation: function(cell, value) {
	   var qty = parseFloat(value);
	   if (qty < 0) {
	    return {result: false, message: "Quantity can't less than 0!"};
	   } else {
	    return true;
	   }
	  }
	}, 
        {text: 'QOH', columntype: 'textbox', datafield: 'itemLocationQoh', width: 80, align:'center', cellsalign: 'right', editable: false, cellsformat: 'D2'}, 
	{text: 'Bin', datafield: 'loc_bin', align: 'center', width: 100, columntype: 'dropdownlist', displayfield: 'loc_bin',  valueMember: 
         "ID", initeditor: function(row, value, editor) {
                 editor.jqxDropDownList({source: dropdownListAdapterBin, displayMember:    
                 "masterlocationstorageaddressessomgr_all_master_location_storage_address_description", valueMember:  
                 "masterlocationstorageaddressessomgr_all_master_location_storage_address_code", placeHolder: "Please Select"});
         }
	},
	{text: 'Replenish<br />Method', datafield: 'itemLocationReplenishMethodCode', align: 'center', width: 100, columntype: 'dropdownlist',     
         displayfield: 'itemLocationReplenishMethodCode',  valueMember: "ID", 
	 initeditor: function(row, value, editor) {
           editor.jqxDropDownList({source: dropdownListAdapterReplenish, displayMember: "lookupssomgr_all_lookup_name", valueMember: 
           "lookupssomgr_all_lookup_code", placeHolder: "Auto"});
         }
	},
	{text: 'Inventory', datafield: 'itemLocationInventory', align: 'center', width: '8%', columntype: 'checkbox'},
	{text: 'Active', datafield:'itemLocationActiveInd', align: 'center', width: '8%', columntype: 'checkbox'},
	{text: 'Auto Put<br />Away', datafield: 'itemLocationAutoPutAway', align: 'center', width: '10%', columntype: 'checkbox'},
	{text: 'Validate', datafield: 'validateYN', align: 'center', hidden: true},
	{text: 'itemLocationId', datafield:'itemLocationId', hidden:true}, 
	{text: 'itemLocationLocationCode', datafield:'itemLocationLocationCode', hidden:true},
	{text: '', datafield: 'itemLocationCategoryCode', hidden: true}
     ]
});

// create new row.
$("#addrowbutton").on('click', function (e) {
  e.preventDefault();
  var obj = {
   itemLocationItemCode: 'Please choose item',
   itemLocationItemName: '',
   itemLocationItemSmallestUomName: '',
   itemLocationLocationCode: '',
   itemLocationReorderLevel: 0.00,
   itemLocationReorderQty: 0.00,
   itemLocationMinLevel: 0.00,
   itemLocationMaxLevel: 0.00,
   itemLocationQoh: 0.00,
   itemLocationReplenishMethodCode: 'Auto',
   itemLocationActiveInd: false,
   itemLocationSupplyingLocationCode: '',
   itemLocationInventory: false,
   itemLocationAutoPutAway: false
};
$("#itemLocationListGrid").jqxGrid("addrow", null, obj);
});

When user clicks to add new row, a new row should be added into the grid with the values being set in the click event listener but it’s only adding empty row.

If virtualmode is removed then it’s working.

Did I miss something? Sorry still new to jqxGrid.

Thanx!

[DimitarParticipant]

Hello jamieoro,

Please refer to the following forum topic, where the same issue is addressed: http://www.jqwidgets.com/community/topic/the-grid-add-blank-row-when-the-virtual-mode-is-enabled/.

Best Regards,
Dimitar

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

[Author]

Posts