使用CORS使用ASP.NET Core WebAPI數據源填充jqwidgets dataAdapter

Question

我正在嘗試使用CORS從asp.net核心webapi項目填充jqx.dataAdapter，並且能夠看到數據傳遞回JQWidgets項目，直到嘗試填充DataAdapter。 jqx.dataAdapter.records不會填充，但是jqx.dataAdapter.recordids將填充8個預期行。

WebAPI項目：

// GET api/changelog
[HttpGet]
public JsonResult Get()
{
    IEnumerable<ApplicationChangeEntryExtension> results = null;
    try
    {
       results = (from x in db.tblApplicationChangeLogEntries
                  select new ApplicationChangeEntryExtension()
                  {
                      ID = x.ID,
                      Application = x.Application,
                      Version = x.Version,
                      ReleaseCandidate = x.ReleaseCandidate,
                      IsReleaseCandidate = x.IsReleaseCandidate,
                      CustomerContent = x.CustomerContent,
                      InternalContent = x.InternalContent,
                      DevDate = x.DevDate,
                      TestDate = x.TestDate,
                      PreReleaseDate = x.PreReleaseDate,
                      PreProductionDate = x.PreProductionDate,
                      DeployDate = x.DeployDate
                  });
    }
    catch(Exception exc)
    {
        Console.WriteLine(exc);
    }
    return Json(results);
}

jqwidgets項目：

$('#ChangeLogLink').on('click', function (event) {
    $('#popupwindowChangeLog').jqxWindow({
        showCollapseButton: false,
        showCloseButton: true,
        draggable: false,
        isModal: true,
        autoOpen: false,
        height: 500,
        width: 850,
        theme: _Theme,
        modalOpacity: 0,
        initContent: function () {
            var _source = {
                type: 'GET',
                datatype: 'json',
                root: 'results',
                datafields: [
                    { name: 'ID', type: 'integer' },
                    { name: 'Application', type: 'string' },
                    { name: 'Version', type: 'string' },
                    { name: 'ReleaseCandidate', type: 'integer' },
                    { name: 'IsReleaseCandidate', type: 'boolean' },
                    { name: 'CustomerContent', type: 'string' },
                    { name: 'InternalContent', type: 'string' },
                    { name: 'DevDate', type: 'date' },
                    { name: 'TestDate', type: 'date' },
                    { name: 'PreReleaseDate', type: 'date' },
                    { name: 'PreProductionDate', type: 'date' },
                    { name: 'DeployDate', type: 'date' }
                ],
                url: 'http://localhost:2512/api/changelog',
                id: 'ID'
            };

            var _dataAdapter = new $.jqx.dataAdapter(_source);

            $("#divChangeLogListContainer").html('<div id="divChangeLogList"></div>');
            $("#divChangeLogList").jqxDataTable({
                source: _dataAdapter,
                width: '100%',
                height: '100%',
                theme: _integronTheme,
                pageable: true,
                pagerButtonsCount: 5,
                sortable: true,
                filterable: false,
                columnsResize: true,
                pageSize: 25,
                altRows: true,
                columns: [
                    { text: 'ID', datafield: 'ID'},
                    { text: 'Application', datafield: 'Application'},
                    { text: 'Version', datafield: 'Version'},
                    { text: 'Release Candidate', datafield: 'ReleaseCandidate'},
                    { text: 'Is Release Candidate', datafield: 'IsReleaseCandidate'},
                    { text: 'Customer Content', datafield: 'CustomerContent'},
                    { text: 'Internal Content', datafield: 'InternalContent'},
                    { text: 'Customer Order #', datafield: 'CustomerOrderID'},
                    { text: 'Dev Date', datafield: 'DevDate', cellsformat: 'M/d/yyyy', cellsalign: 'center', align: 'center'},
                    { text: 'Test Date', datafield: 'TestDate', cellsformat: 'M/d/yyyy', cellsalign: 'center', align: 'center'},
                    { text: 'PreRelease Date', datafield: 'PreReleaseDate', cellsformat: 'M/d/yyyy', cellsalign: 'center', align: 'center'},
                    { text: 'PreProduction Date', datafield: 'PreProductionDate', cellsformat: 'M/d/yyyy', cellsalign: 'center', align: 'center'},
                    { text: 'Deploy Date', datafield: 'DeployDate', cellsformat: 'M/d/yyyy', cellsalign: 'center', align: 'center'}
                ]
            });
        }
    });
    $('#popupwindowChangeLog').jqxWindow('open');

});

Answer 1

我認為您在創建數據適配器或調用其dataBind()方法時會錯過autoBind參數。

或者，您也可以使用異步加載來創建數據表。

在jqwidgets.com上查看每種方法的示例