javascript - JqueryGrid bind taking time when passing data from controller -
i have problem when fetch more 20k data using api.
data fetching fast when bind in jquery grid taking time 5 8 min
here using jquery plugin in db.js , binding in view page , taking soo time.
i working on mvc4(.net).
controller:
[httpget] public actionresult getmerchandise(string vendor = "", string desc = "", string model = "", string sku = "", string sku2 = "", string comment = "", string received = "", int location = 0, int barcode = 0, string barcodeprinted = "", string lastupdate = "", int damage = 0, string created = "", string shipdate = "", string consumedate = "", string pending = "", string isdonated = "", string retreq = "", string returnto = "", int quantity = 0, string grname = "", int custid = 0) { var model = new itemmodels(); itembl objitem = new itembl(); codebl objcode = new codebl(); if (session["currentcustomerid"] != null) { titemapicontroller _apititem = new titemapicontroller(); //var itemlist = _apititem.getitemsbycustomerid(convert.toint32(session["currentcustomerid"]), model, desc); var itemlist = _apititem.getitemsbycustomerid(convert.toint32(session["currentcustomerid"])); ienumerable<sp_titems_getbycustomerid_result> filtereditem; filtereditem = itemlist.where(x => (model != "" ? (x.modelnumber != null && x.modelnumber.tolower().contains(model.trim().tolower())) : true) && (desc != "" ? (x.description != null && x.description.tolower().contains(desc.trim().tolower())) : true) && (barcode != 0 ? (x.barcode != 0 && x.barcode.tostring().contains(barcode.tostring())) : true) && (vendor != "" ? (x.source != null && x.source.tolower().contains(vendor.trim().tolower())) : true) && (comment != "" ? (x.comments != null && x.comments.tolower().contains(comment.trim().tolower())) : true) && (sku != "" ? (x.sku != null && x.sku.tolower().contains(sku.trim().tolower())) : true) && (sku2 != "" ? (x.sku2 != null && x.sku2.tolower().contains(sku2.trim().tolower())) : true) && (custid != 0 ? (x.customerid != null && x.customerid.tostring().contains(custid.tostring())) : true) && (barcodeprinted != "" ? (x.bcprinted != null && x.bcprinted == convert.toboolean(barcodeprinted)) : true) && (pending != "" ? (x.pendingshipment != null && x.pendingshipment == convert.toboolean(pending)) : true) && (isdonated != "" ? (x.donated != null && x.donated == convert.toboolean(isdonated)) : true) && (retreq != "" ? (x.returnrequested != null && x.returnrequested == convert.toboolean(retreq)) : true) && (returnto != "" ? (x.returnto != null && x.returnto.tostring().contains(returnto.trim())) : true) && (quantity != 0 ? (x.quantity != null && x.quantity.tostring().contains(quantity.tostring())) : true) && (grname != "" ? (x.groupname != null && x.groupname.tostring().contains(grname.tostring())) : true) && (location != 0 ? (x.locationid != null && x.locationid.tostring().contains(location.tostring())) : true) && (damage != 0 ? (x.damagecodeid != null && x.damagecodeid.tostring().contains(damage.tostring())) : true) ).tolist(); //filtereditem = itemlist.tolist(); model.itemlist = filtereditem.select(x => { return new itemmodels() { barcode = x.barcode, customerid = x.customerid != null ? x.customerid.value : 0, bcprinted = x.bcprinted != null ? x.bcprinted.value : false, consumedate = x.consumedate.hasvalue != false ? x.consumedate.value : default(datetime), comments = x.comments != null ? x.comments : "", strcreateddate = x.createddate.hasvalue != false ? x.createddate.value.tostring("mm/dd/yyyy") : "", damagecode = x.damagecodeid != null ? x.damagecodeid.value : 0, strdeliveredforshotdate = x.deliveredforshotdate.hasvalue != false ? x.deliveredforshotdate.value.tostring("mm/dd/yyyy") : "", description = x.description != null ? x.description : "", description2 = x.description2 != null ? x.description2 : "", donated = x.donated != null ? x.donated.value : false, groupname = x.groupname != null ? x.groupname : "", itemname = x.itemname != null ? x.itemname : "", itemtypecodeid = x.itemtypecodeid != null ? x.itemtypecodeid.value : 0, strlastuseddate = x.lastuseddate.hasvalue != false ? x.lastuseddate.value.tostring("mm/dd/yyyy") : "", strlastupdateddate = x.lastupdateddate.hasvalue != false ? x.lastupdateddate.value.tostring("mm/dd/yyyy") : "", //lastupdateddate = x.lastupdateddate.hasvalue != false ? x.lastupdateddate.value : default(datetime), location = x.locationid != null ? x.locationid : "", //locationid = x.locationid != null ? oblloc.getalllocationsbyid(x.locationid).firstordefault().description : "", locationid = x.locationdescription != null ? x.locationdescription : "", strmerchordered = x.merchordered.hasvalue != false ? x.merchordered.value.tostring("mm/dd/yyyy") : "", modelnumber = x.modelnumber != null ? x.modelnumber : "", strorderdate = x.orderdate.hasvalue != false ? x.orderdate.value.tostring("mm/dd/yyyy") : "", packinglistid = x.packinglistid != null ? x.packinglistid.value : 0, pendingshipment = x.pendingshipment != null ? x.pendingshipment.value : false, pickup = x.pickup != null ? x.pickup.value : false, quantity = x.quantity != null ? x.quantity.value : 0, //receivedate = x.receivedate.hasvalue != false ? x.receivedate.value : default(datetime), strreceivedate = x.receivedate.hasvalue != false ? x.receivedate.value.tostring("mm/dd/yyyy") : "", strreleasedate = x.releasedate.hasvalue != false ? x.shipdate.value.tostring("mm/dd/yyyy") : "", returnrequested = x.returnrequested != null ? x.returnrequested.value : false, returnto = x.returnto != null ? x.returnto : "", //shipdate = x.shipdate.hasvalue != false ? x.shipdate.value : default(datetime), sku = x.sku != null ? x.sku : "", sku2 = x.sku2 != null ? x.sku2 : "", source = x.source != null ? x.source : "", upc = x.upc != null ? x.upc : "", strconsumedate = x.consumedate.hasvalue != false ? x.consumedate.value.tostring("mm/dd/yyyy") : "", strshipdate = x.shipdate.hasvalue != false ? x.shipdate.value.tostring("mm/dd/yyyy") : "", }; //}).tolist(); //}).orderbydescending(x => x.shipdate).tolist(); }).orderbydescending(x => x.barcode).tolist(); } var jsonresult = json(model.itemlist, jsonrequestbehavior.allowget); jsonresult.maxjsonlength = int.maxvalue; return jsonresult; } public actionresult getmerchant() { try { locationbl oblloc = new locationbl(); codebl objcode = new codebl(); var location = oblloc.getalllocationsbyid(""); var code = objcode.getalldamagecodebyid(0).where(x => x.codegroupid == 3).tolist(); var model = new itemmodels(); var loc = location.select(x => new { x.locationid, x.description }).tolist(); var loctempvalue = new { locationid = "", description = "" }; loc.insert(0, loctempvalue); var damage = code.select(x => new { x.codevalue, x.codeid }).tolist(); var dmgtempvalue = new { codevalue = "", codeid = 0 }; damage.insert(0, dmgtempvalue); var result = new { loc = loc, dam = damage }; return json(result, jsonrequestbehavior.allowget); } catch (exception ex) { throw ex; } } view:
<script> $(function () { $.ajax({ type: "get", url: "/merchandiselist/getmerchant", datatype:"json" }).done(function (data) { //$("#leftmenu").hide(); //reloadpage(data); var mydatefield = function (config) { jsgrid.field.call(this, config); }; mydatefield.prototype = new jsgrid.field({ sorter: function (date1, date2) { return new date(date1) - new date(date2); }, itemtemplate: function (value) { //debugger if (value == "") return ""; else { var date = new date(value).todatestring() //var date = new date(value).todatestring("mm/dd/yyyy") //return new date(value).todatestring(); //return value; var d = new date(date), month = '' + (d.getmonth() + 1), day = '' + d.getdate(), year = d.getfullyear(); if (month.length < 2) month = '0' + month; if (day.length < 2) day = '0' + day; var df = [month, day, year].join('/'); date = df; return date; } }, inserttemplate: function (value) { //debugger return this._insertpicker = $("<input>").datepicker({ defaultdate: new date() }); }, edittemplate: function (value) { //debugger if (value == "") return this._editpicker = $("<input>").datepicker({ defaultdate: new date() }); else { return this._editpicker = $("<input>").datepicker().datepicker("setdate", new date(value)); } }, insertvalue: function () { debugger if (this._insertpicker.datepicker("getdate") != null) return this._insertpicker.datepicker("getdate"); //.toisostring("mm/dd/yyyy") else return this._insertpicker.datepicker("getdate"); }, editvalue: function () { debugger if (this._editpicker.datepicker("getdate") != null) { //.toisostring("mm/dd/yyyy") return this._editpicker.datepicker("getdate"); } //return this._editpicker.datepicker("getdate").toisostring(); else return this._editpicker.datepicker("getdate"); } }); jsgrid.fields.mydatefield = mydatefield; $("#jsgrid").jsgrid({ height: "50%", width: "100%", filtering: true, editing: true, editbuttontooltip: "edit", inserting: true, sorting: true, paging: true, autoload: true, pagebuttoncount: 5, pagesize: 10, confirmdeleting: true, deleteconfirm: "do want delete merchandise?", refreshtext: "refresh", refreshtitle:"reload grid", controller: db, fields: [ { type: "control" }, { name: "source", type: "text", width: 120, title: "vendor" }, { name: "description", type: "text", width: 210, validate: { message: "description required!", validator: function (value) { return value != ""; } } }, { name: "modelnumber", type: "text", width: 120, title: "model#/item" }, { name: "sku", type: "text", width: 90 }, { name: "sku2", type: "text", width: 90 }, { name: "comments", type: "text", width: 200 }, { name: "strreceivedate", type: "mydatefield", width: 80, align: "center", title: "received" }, { name: "location", type: "select", items: data.loc, valuefield: "locationid", textfield: "description", width: 100 }, { name: "barcode", width: 80 }, { name: "barcodeprinted", type: "checkbox", title: "barcode printed", sorting: false }, //{ name: "strlastupdateddate", type: "mydatefield", width: 80, title: "last updated" }, { name: "strlastuseddate", type: "mydatefield", width: 80, title: "last updated" }, { name: "damagecode", type: "select", items: data.dam, valuefield: "codeid", textfield: "codevalue", title: "damage" }, { name: "strcreateddate", editable: false, width: 80, title: "created date", type: "mydatefield" }, { name: "strshipdate", type: "mydatefield", mycustomproperty: "bar", width: 80, title: "ship date" }, { name: "strconsumedate", type: "mydatefield", mycustomproperty: "bar", width: 80, title: "consume date" }, { name: "pendingshipment", type: "checkbox", title: "pending", sorting: false, width: 60 }, { name: "donated", type: "checkbox", title: "is donated", sorting: false, width: 60 }, { name: "returnrequested", type: "checkbox", title: "return requested", sorting: false }, { name: "returnto", type: "text", width: 150, title: "return to" }, { name: "quantity", type: "number", width: 50, title: "qty" }, { name: "groupname", type: "text", width: 150, title: "group name" }, { name: "customerid", width: 100, title: "customer id" } ], }); }); }); </script> db.js :
(function () { debugger var db = { loaddata: function (filter) { var startindex = (filter.pageindex - 1) * filter.pagesize;//,pagesize:startindex + filter.pagesize,pageindex:startindex return $.ajax({ type: "get", url: "/merchandiselist/getmerchandise", data: { vendor: filter.source, desc: filter.description, model: filter.modelnumber, sku: filter.sku, sku2: filter.sku2, comment: filter.comments, received: filter.strreceivedate, location: filter.location, barcode: filter.barcode, barcodeprinted: filter.barcodeprinted, lastupdate: filter.strlastuseddate, damage: filter.damagecode, created: filter.strcreateddate, shipdate: filter.strshipdate, consumedate: filter.strconsumedate, pending: filter.pendingshipment, isdonated: filter.isdonated, retreq: filter.returnrequested, returnto: filter.returnto, quantity: filter.quantity, grname: filter.groupname, custid: filter.customerid }, datatype: "json", success: function (result) { itemscount: result.length } }); }, insertitem: function (insertingclient) { return $.ajax({ type: "post", url: "/merchandiselist/insertmerchandise", data: { source: insertingclient.source, description: insertingclient.description, modelnumber: insertingclient.modelnumber, sku: insertingclient.sku, sku2: insertingclient.sku2, comments: insertingclient.comments, receiveddate: insertingclient.strreceivedate, location: insertingclient.location, barcodeprinted: insertingclient.barcodeprinted, strlastuseddate: insertingclient.strlastupdateddate, damagecode: insertingclient.damagecode, strcreateddate: insertingclient.strcreateddate, strshipdate: insertingclient.strshipdate, strconsumedate: insertingclient.strconsumedate, pendingshipment: insertingclient.pendingshipment, donated: insertingclient.donated, returnrequested: insertingclient.returnrequested, returnto: insertingclient.returnto, quantity: insertingclient.quantity, groupname: insertingclient.groupname }, datatype: "json", success: function (result) { loadmerchlist(); //window.location.href = "/test" }, error: function (result) { //alert('0'); loadmerchlist(); }, }); }, updateitem: function (updatingclient) { //var d = new date(parseint(updatingclient.receivedate.substr(6))).toutcstring(); return $.ajax({ type: "post", url: "/merchandiselist/updatemerchandise", data: { source: updatingclient.source, description: updatingclient.description, modelnumber: updatingclient.modelnumber, sku: updatingclient.sku, sku2: updatingclient.sku2, comments: updatingclient.comments, strreceivedate: (updatingclient.strreceivedate != null && updatingclient.strreceivedate != "") ? updatingclient.strreceivedate.toutcstring() : "", location: updatingclient.location, barcode: updatingclient.barcode, barcodeprinted: updatingclient.barcodeprinted, //strlastuseddate: (updatingclient.strlastupdateddate != null && updatingclient.strlastupdateddate != "") ? updatingclient.strlastupdateddate.toutcstring() : "", damagecode: updatingclient.damagecode, //strcreateddate: (updatingclient.strcreateddate != null && updatingclient.strcreateddate != "") ? updatingclient.strcreateddate.toutcstring() : "", strshipdate: (updatingclient.strshipdate != null && updatingclient.strcreateddate != "") ? updatingclient.strshipdate.toutcstring() : "", strconsumedate: (updatingclient.strconsumedate != null && updatingclient.strcreateddate != "") ? updatingclient.strconsumedate.toutcstring() : "", pendingshipment: updatingclient.pendingshipment, donated: updatingclient.donated, returnrequested: updatingclient.returnrequested, returnto: updatingclient.returnto, quantity: updatingclient.quantity, groupname: updatingclient.groupname }, datatype: "json", success: function (result) { loadmerchlist(); //window.location.href = "/test" }, error: function (result) { //alert('0'); loadmerchlist(); }, }); }, deleteitem: function (deletingclient) { var barcode = deletingclient.barcode; return $.ajax({ type: "post", url: "/merchandiselist/deletemerchandise", data: { barcode: barcode }, datatype: "json", success: function (result) { loadmerchlist(); //window.location.href = "/test" }, error: function (result) { //alert('0'); loadmerchlist(); }, }); //var clientindex = $.inarray(deletingclient, this.clients); //this.clients.splice(clientindex, 1); }, finishinsert: function (inserteditem) { this.clients.push(insertingclient); }, // handles finish of inserting item controller.insertitem finishdelete: function (deleteitem, deleteditemindex) { var clientindex = $.inarray(deletingclient, this.clients); this.clients.splice(clientindex, 1); } }; window.db = db; }());
i think problem causes linq query. think linq query creates big sql query , causes performance problem. can use https://www.linqpad.net/ performance linq query. in application, can see sql query generated , can fix it.
Comments
Post a Comment