Grid take too long time to load

[CrazyDev]

Hello Team,

We face one strange issue with pqGrid. We load just 580 rows in grid with 20 columns. But it takes more than 2 minute. Below is my grid code.

Code: [Select]

var obj = { title: "Bulk Edit Vendor Task Assignment", resizable: true, scrollModel: { autoFit: true }, virtualX: true, virtualY: true };
    obj.colModel = [{ title: "ID", width: 10, dataIndx: "ID", dataType: "integer", hidden: true },
             { title: "Vendor Type", width: 100, dataIndx: "Type", dataType: "string", cls: 'beige', editable: false },
        { title: "Vendor Name", width: 150, dataIndx: "Name", dataType: "string", cls: 'beige', editable: false },
        { title: "Job / Batch (UnitType)", width: 100, dataIndx: "Job", dataType: "string", align: "right", cls: 'beige', editable: false },
        { title: "Batch / Item", width: 100, dataIndx: "BatchItem", dataType: "string", align: "right", cls: 'beige', editable: false },
        { title: "Task Name", width: 100, dataIndx: "TaskName", dataType: "string", align: "right", cls: 'beige', editable: false },
        { title: "Batch File Path", width: 150, dataIndx: "BatchFilePath", dataType: "string", align: "right" },
        { title: "Assigned Quantity (*)", width: 100, dataIndx: "AssignedQuantity", dataType: "float",
            render: function (ui) {
                // debugger;
                var rd = ui.rowData;
                if (rd["AssignedQuantity"] != '' && rd["AssignedQuantity"] != null) {
                    ui.rowData["Amount"] = parseFloat(parseFloat(rd["AssignedQuantity"]).toFixed(2) * parseFloat(rd["Price"]).toFixed(2)).toFixed(2);
                }
                else {
                    ui.rowData["Amount"] = null;
                }
                $("#grid_array").pqGrid("refreshCell", { rowIndx: ui.rowIndx, dataIndx: "Amount" });
            }
        },
       { title: "Price / Unit", width: 50, dataType: "float", dataIndx: "Price", cls: 'beige', editable: false },
       { title: "Amount", width: 75, dataType: "float", dataIndx: "Amount", cls: 'beige', editable: false },
       { title: "Start Date (*)", width: "100", dataIndx: "StartDate",
           editor: {
               type: 'textbox',
               init: dateEditor
           }
       }
     , { title: "ETA Date (*)", width: "100", dataIndx: "ETADate",
         editor: {
             type: 'textbox',
             init: dateEditor
         }
     }
        ,
         { title: "Description", width: 125, dataIndx: "Description", dataType: "string", align: "right" },
         { title: "Status", width: 75, dataIndx: "Status", dataType: "string", align: "right", cls: 'beige', editable: false },
         { title: "Pending Quantity", width: 75, dataIndx: "PendingQty", dataType: "integer", align: "right", cls: 'beige', editable: false },
         { title: "CurrencyData", width: 10, dataIndx: "CurrencyData", dataType: "string", hidden: true },
         { title: "Receive Quantity (*)", width: 100, dataIndx: "ReceiveQty", dataType: "integer" },
         { title: "Time Hours (HH) (*)", width: 100, dataIndx: "TimeHrs", dataType: "integer" },
         { title: "Time minutes (MM) (*)", width: 100, dataIndx: "TimeMinits", dataType: "integer" },
         { title: "Receive File Path", width: 100, dataIndx: "ReceiveFilePath", dataType: "string" }
        ];
    obj.dataModel = {
        dataType: "JSON",
        location: "remote",
        recIndx: "ID",
        method: "GET",
        getUrl: function () {
            return { url: "/VendorTaskAssignment/JsonBulkEdit", data: { projId: projIds} };
        },
        getData: function (response) {
            return {
                data: response.data
            };
        }
    };


    var grid1 = $("#grid_array").pqGrid(obj);
    $("#grid_array").pqGrid("option", "height", '100%-10');
Please help to to fix this issue.

[paramvir]

If it's taking long to render the grid, then use virtualX: true and virtualY: true options in the grid.

If it's taking 2 minutes to load data from remote location, then you need to check your remote script.

[CrazyDev]

Thanks for the reply. I have already used virtualX and virtualY to true. but still its taking too long to load. I am not using any remote location. It is an Asp.net MVC application and i load data from my own local MS SQL Server database.

You can see code on my original post to check properties and methods i used.

[Cintionmi]

I know I'm not very smart. So come to ask for knowledge from all of you.