0

I can't get the grid to populate my data. The correct number of rows shows up, but everything is empty (in my case, 8 empty rows). I am using jqGrid-free 4.15.5, jQueryUI 1.21.1, jQuery 3.5.1.

Is there something simple that I'm doing wrong?

Some things that are important to me:

  • loadonce: true (so that I get my dataset one time and do client sorting from there)
  • forceClientSorting: true

Also, I've seen varying solutions to pagers, so I'm not sure if I'm doing that correctly. From what I understand, simply setting pager: true should be sufficient with this version of jqGrid.

Controller Action:

public IActionResult GridData(string sidx, string sord, int page, int rows)
        {
            int pageIndex = page - 1;
            int pageSize = rows;
            List<SubCampaignData> subCampaignData = new List<SubCampaignData>();
            
                subCampaignData = database.SubCampaignData
                    .Include(scd => scd.ContentPriority)
                    .Include(scd => scd.DataSources)
                    .Include(scd => scd.DeliveryMethod)
                    .Include(scd => scd.DeliveryPriority)
                    .Include(scd => scd.Contacts)
                        .ThenInclude(c => c.Role)
                    .ToList();

            var sortColumn = typeof(SubCampaignData).GetProperty(sidx);
            if (sord.ToUpper() == "ASC")
            {
                subCampaignData = subCampaignData.OrderBy(scd => sortColumn.GetValue(scd, null)).ToList();
            }
            else
            {
                subCampaignData = subCampaignData.OrderByDescending(scd => sortColumn.GetValue(scd, null)).ToList();
            }
            
            var gridData = subCampaignData.Select(scd => new
            {
                Campaign = scd.Campaign,
                SubCampaign = scd.SubCampaign,
                BulkCampaignName = scd.BulkCampaignName,
                DeliveryMethodName = scd.DeliveryMethod.DeliveryMethodName,
                AutomationTriggerName = scd.AutomationTriggerName,
                MasterDataExtension = scd.MasterDataExtension,
                Purpose = scd.Purpose,
                Active = scd.Active.ToString(),
                FailureContactName = string.Join(';', scd.Contacts.Where(c => c.Role.RoleName.ToUpper() == "FAILURE CONTACT").Select(c => c.Name).ToList()),
                DeliveryPriorityName = scd.DeliveryPriority.PriorityName,
                ContentPriorityName = scd.ContentPriority.PriorityName,
                EscalateAfter = scd.EscalateAfter,
                ClientName = string.Join(';', scd.DataSources.Select(ds => ds.ClientName).ToList()),
                SourceJob = scd.SourceJob,
                MainframeFileName = scd.MainframeFileName,
                AggregationJob = scd.AggregationJob,
                AggregationRunTime = scd.AggregationRunTime,
                SendTime = scd.SendTime,
                RunFrequency = scd.RunFrequency,
                RunDays = scd.RunDays,
                RunMonths = scd.RunMonths,
                SendPend = scd.SendPend,
                SendPendDelay = scd.SendPendDelay,
                SendPendReason = scd.SendPendReason,
                RegressionScripts = scd.RegressionScripts.ToString(),
                ConfirmedActiveDate = FormatNullableDateTime(scd.ConfirmedActiveDate),
                StartDate = FormatNullableDateTime(scd.StartDate),
                Resend = scd.Resend,
                ResendAbility = scd.ResendAbility.ToString(),
                RecreateAbility = scd.RecreateAbility.ToString(),
                ResendRecreateDetails = scd.ResendRecreateDetails,
                BusinessOwnerName = string.Join(';', scd.Contacts.Where(c => c.Role.RoleName.ToUpper() == "BUSINESS OWNER").Select(c => c.Name).ToList()),
                BusinessSponsorName = string.Join(';', scd.Contacts.Where(c => c.Role.RoleName.ToUpper() == "BUSINESS SPONSOR").Select(c => c.Name).ToList()),
                BusinessSponsorEmailAddress = string.Join(';', scd.Contacts.Where(c => c.Role.RoleName.ToUpper() == "BUSINESS SPONSOR").Select(c => c.EmailAddress).ToList()),
                BusinessSponsorConfirmedDate = string.Join(';', FormatNullableDateTimes(scd.Contacts.Where(c => c.Role.RoleName.ToUpper() == "BUSINESS SPONSOR").Select(c => c.ConfirmedDate).ToList())),
                FailureContactEmailAddress = string.Join(';', scd.Contacts.Where(c => c.Role.RoleName.ToUpper() == "FAILURE CONTACT").Select(c => c.EmailAddress).ToList()),
                FailureContactConfirmedDate = string.Join(';', FormatNullableDateTimes(scd.Contacts.Where(c => c.Role.RoleName.ToUpper() == "FAILURE CONTACT").Select(c => c.ConfirmedDate).ToList())),
                SmeAnalystName = string.Join(';', scd.Contacts.Where(c => c.Role.RoleName.ToUpper() == "SME/ANALYST").Select(c => c.Name).ToList()),
                SmeAnalystEmailAddress = string.Join(';', scd.Contacts.Where(c => c.Role.RoleName.ToUpper() == "SME/ANALYST").Select(c => c.EmailAddress).ToList()),
                SmeAnalystConfirmedDate = string.Join(';', FormatNullableDateTimes(scd.Contacts.Where(c => c.Role.RoleName.ToUpper() == "SME/ANALYST").Select(c => c.ConfirmedDate).ToList())),
            }).ToArray();

            return Json(gridData);
        }

View (grid function):

 $(function () {
        "use strict";
        var mydata = [
            { id: "10", campaign: "Agent AutoReply Emails", subcampaign: "FAO_Agent_Inhouse_SoldQuote", commdeliverycampaign: "", deliverymethod: "Triggered Send", automationtriggeredsend: "Agent_AutoReply", masterdataextension: "Agent_AutoReply", purpose: "Sent to Agency when PGR has written new business for a customer on the Agency's behalf", active: "true", failurecontact: "", deliverypriority: "Medium", contentpriority: "Medium", escalateafter: "2", datasource: "Probill", sourcejob: "", mainframefile: "", inputfile: "", aggregationjob: "", aggregationruntime: "", sendtime: "Real-time", runfrequency: "Daily", rundays: "SMTWThFSa", runmonths: "JanFebMarAprMayJunJulAugSepOctNovDec", sendpend: "N", sendpenddelay: "", sendpendreason: "", regression: "false", confirmactivedate: "2020-07-22", startdate: "", resend: "", resendability: "false", recreateability: "true", resendcomments: "Can recreate the list of Agencies from a report for the date.", businessowner: "", businesssponsor: "Dan Merk;Patrick D Astolfo", sponsoremail: "[email protected];[email protected]", sponsorconfirmdate: "2020-01-30", failureemail: "", failureconfirmdate: "", smeanalyst: "", smeanalystemail: "", smeanalystconfirmed: "", metadata: "" }
        ],
            initDateEdit = function (elem, options) {
                // we need get the value before changing the type
                var orgValue = $(elem).val(), newformat,
                    cm = $(this).jqGrid("getColProp", options.name);

                $(elem).attr("type", "date");
                if ((Modernizr && !Modernizr.inputtypes.date) || $(elem).prop("type") !== "date") {
                    // if type="date" is not supported call jQuery UI datepicker
                    $(elem).css({ width: "8em" }).datepicker({
                        dateFormat: "yy-mm-dd",
                        autoSize: true,
                        changeYear: true,
                        changeMonth: true,
                        showButtonPanel: true,
                        showWeek: false
                    });
                } else {
                    // convert date to ISO
                    if (orgValue !== "") {
                        newformat = cm.formatoptions != null && cm.formatoptions.newformat ?
                            cm.formatoptions.newformat :
                            $(this).jqGrid("getGridRes", "formatter.date.newformat");
                        $(elem).val($.jgrid.parseDate.call(this, newformat, orgValue, "yy-mm-dd"));
                    }
                    $(elem).css("width", "11em");
                }
            },
            initDateSearch = function (elem) {
                setTimeout(function () {
                    $(elem).datepicker({
                        dateFormat: "yy-mm-dd",
                        autoSize: true,
                        changeYear: true,
                        changeMonth: true,
                        showWeek: false,
                        showButtonPanel: true
                    });
                }, 50);
            },
            numberTemplate = {
                formatter: "number", align: "right", sorttype: "number",
                editrules: { number: true, required: true },
                searchoptions: { sopt: ["eq", "ne", "lt", "le", "gt", "ge", "nu", "nn", "in", "ni"] }
            };
        $("#list").jqGrid({
            url: "/Home/GridData",
            datatype: "json",
            //data: mydata,
            mtype: "GET",
            colModel: [
                { name: "act", template: "actions", frozen: true },
                { name: "Campaign", label: "Campaign Name", width: 120, editable: false, frozen: true },
                { name: "SubCampaign", label: "SubCampaign Name", width: 141, editable: true, frozen: true },
                {
                    name: "BulkCampaignName", label: "Bulk Campaign", width: 120,
                    editrules: { edithidden: true }, editable: true, hidden: true
                },
                {
                    name: "DeliveryMethodName", label: "Delivery Method", width: 120, formatter: "select",
                    formatoptions: { value: "Adhoc Bulk, Bulk, Bulk Text Messaging, Triggered Send, Triggered Text Messaging", defaultvalue: "Bulk" },
                    stype: "select",
                    searchoptions: { value: ":Any;Adhoc Bulk:Adhoc Bulk;Bulk:Bulk;Bulk Text Messaging:Bulk Text Messaging;Triggered Send:Triggered Send;Triggered Text Messaging:Triggered Text Messaging" },
                    editable: true
                },
                { name: "AutomationTriggerName", label: "Automation/Triggered Send", width: 185, editable: true },
                { name: "MasterDataExtension", label: "Master Data Extension", width: 155, editable: true },
                { name: "Purpose", label: "Purpose", width: 155, editable: true },
                {
                    name: "Active", label: "Active", width: 120, align: "center", formatter: "checkbox",
                    stype: "select", searchoptions: { sopt: ["eq", "ne"], value: ":Any;true:Yes;false:No" },
                    editable: true,
                    edittype: "checkbox", editoptions: { value: "Yes:No", defaultValue: "Yes" }
                },
                { name: "FailureContactName", label: "Failure Contact", width: 155, editable: true },
                {
                    name: "DeliveryPriorityName", label: "Delivery Priority", width: 120, formatter: "select",
                    formatoptions: { value: "Low, Low-Medium, Medium, Medium-High, High", defaultvalue: "Medium" },
                    editable: true
                },
                {
                    name: "ContentPriorityName", label: "Content Priority", width: 120, formatter: "select",
                    formatoptions: { value: "Low, Low-Medium, Medium, Medium-High, High", defaultvalue: "Medium" },
                    editable: true
                },
                { name: "EscalateAfter", label: "Escalate After (days)", width: 120, editable: true },
                { name: "ClientName", label: "Data Source", width: 100, editable: true },
                { name: "SourceJob", label: "Source Job", width: 120, editable: true },
                { name: "MainframeFileName", label: "Mainframe File", width: 120, editable: true },
                { name: "AggregationJob", label: "AggregationJob", width: 120, editable: true },
                { name: "AggregationRunTime", label: "Aggregation Run Time", width: 120, editable: true },
                { name: "SendTime", label: "Send Time", width: 120, editable: true },
                { name: "RunFrequency", label: "Run Frequency", width: 120, editable: true },
                { name: "RunDays", label: "Run Days", width: 120, editable: true },
                { name: "RunMonths", label: "Run Months", width: 120, editable: true },
                { name: "SendPend", label: "SendPend", width: 120, editable: true },
                { name: "SendPendDelay", label: "SendPend Delay", width: 120, editable: true },
                { name: "SendPendReason", label: "SendPend Reason", width: 120, editable: true },
                {
                    name: "RegressionScripts", label: "Regression Scripts", width: 120, align: "center", formatter: "checkbox",
                    stype: "select", searchoptions: { sopt: ["eq", "ne"], value: ":Any;true:Yes;false:No" },
                    editable: true,
                    edittype: "checkbox", editoptions: { value: "true:false", defaultValue: "false" }
                },
                {
                    name: "ConfirmedActiveDate", label: "Last Confirmed Active", width: 120, align: "center", sorttype: "date",
                    formatter: "date", formatoptions: { newformat: "Y-m-d" }, editable: true,
                    editoptions: { dataInit: initDateEdit },
                    searchoptions: { sopt: ["eq", "ne", "lt", "le", "gt", "ge"], dataInit: initDateSearch }
                },
                {
                    name: "StartDate", label: "Start Date", width: 120, align: "center", sorttype: "date",
                    formatter: "date", formatoptions: { newformat: "Y-m-d" }, editable: true,
                    editoptions: { dataInit: initDateEdit },
                    searchoptions: { sopt: ["eq", "ne", "lt", "le", "gt", "ge"], dataInit: initDateSearch }
                },
                { name: "Resend", label: "Resend", width: 120, editable: true },
                {
                    name: "ResendAbility", label: "Business Can Resend", width: 120, align: "center", formatter: "checkbox",
                    stype: "select", searchoptions: { sopt: ["eq", "ne"], value: ":Any;true:Yes;false:No" },
                    editable: true,
                    edittype: "checkbox", editoptions: { value: "true:false", defaultValue: "false" }
                },
                {
                    name: "RecreateAbility", label: "Business Can Recreate", width: 120, align: "center", formatter: "checkbox",
                    stype: "select", searchoptions: { sopt: ["eq", "ne"], value: ":Any;true:Yes;false:No" },
                    editable: true,
                    edittype: "checkbox", editoptions: { value: "true:false", defaultValue: "false" }
                },
                { name: "ResendRecreateDetails", label: "Resend/Recreate Details", width: 120, editable: true },
                { name: "BusinessOwnerName", label: "Business Platform Owner", width: 120, editable: true },
                { name: "BusinessSponsorName", label: "Business Sponsor", width: 120, editable: true },
                { name: "BusinessSponsorEmailAddress", label: "Sponsor Email", width: 120, editable: true },
                {
                    name: "BusinessSponsorConfirmedDate", label: "Sponsor Confirmed", width: 120, align: "center", sorttype: "date",
                    formatter: "date", formatoptions: { newformat: "Y-m-d" }, editable: true,
                    editoptions: { dataInit: initDateEdit },
                    searchoptions: { sopt: ["eq", "ne", "lt", "le", "gt", "ge"], dataInit: initDateSearch }
                },
                { name: "FailureContactEmailAddress", label: "Failure Email", width: 120, editable: true },
                {
                    name: "FailureContactConfirmedDate", label: "Failure Confirmed", width: 120, align: "center", sorttype: "date",
                    formatter: "date", formatoptions: { newformat: "Y-m-d" }, editable: true,
                    editoptions: { dataInit: initDateEdit },
                    searchoptions: { sopt: ["eq", "ne", "lt", "le", "gt", "ge"], dataInit: initDateSearch }
                },
                { name: "SmeAnalystName", label: "SME/Analyst", width: 120, editable: true },
                { name: "SmeAnalystEmailAddress", label: "SME/Analyst Email", width: 120, editable: true },
                {
                    name: "SmeAnalystConfirmedDate", label: "SME/Analyst Confirmed", width: 120, align: "center", sorttype: "date",
                    formatter: "date", formatoptions: { newformat: "Y-m-d" }, editable: true,
                    editoptions: { dataInit: initDateEdit },
                    searchoptions: { sopt: ["eq", "ne", "lt", "le", "gt", "ge"], dataInit: initDateSearch }
                }
                
            ],            
            loadonce: true,
            forceClientSorting: true,
            cmTemplate: { autoResizable: true },
            autoResizing: { compact: false, adjustGridWidth: false },
            shrinkToFit: false,
            autowidth: true,
            rownumbers: true,
            ignoreCase: true,
            height: "auto",
            sortname: "Campaign",
            sortorder: "asc",
            threeStateSort: true,
            sortable: true,
            pager: true,
            rowNum: 10,
            viewrecords: true,
            searching: {
                defaultSearch: "cn"
            },
            multiSort: true,
            formEditing: {
                onclickSubmit: function (options, postdata, formOper) {
                    return {};
                }
            }
        }).jqGrid("setFrozenColumns")
            .jqGrid("navGrid", { add: true, edit: true, del: true })
            .jqGrid("inlineNav", { add: false, edit: false })
            .jqGrid("filterToolbar")
            .jqGrid("gridResize");
    });

1 Answer 1

0
return Json(gridData);

Instead of the above code please place the below code.

int totalRecords = gridData.Count();
var totalPages = (int)Math.Ceiling((float)totalRecords / (float)rows);
 var Data = new
                {
                    total = totalPages,
                    page,
                    records = totalRecords,
                    rows = gridData
                };
                return Json(Data, JsonRequestBehavior.AllowGet);              

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.