簡體   English   中英

jqWidgets:不顯示數據和網格

[英]jqWidgets: Data and grid are not displayed

我正在使用jqWidgets在Angular中使用jqxGrid創建網格。

在這里按照此演示獲取表格網格

但是,我在瀏覽器中看到的只是列名,而在列和行周圍沒有輪廓。 即使我鏈接到設置了所有數據的xml,也沒有顯示任何數據,但是什么也不顯示。

import { Component } from '@angular/core';
import { jqxGridComponent } from 'jqwidgets-framework/jqwidgets-ts/angular_jqxgrid';

@Component({
templateUrl: 'buttons.component.html',
selector: 'my-app',

})
export class ButtonsComponent {

constructor() { }

source: any =
 {
    datatype: "xml",        
    datafields: [
        { name: 'EmployeeNum', type: 'int' },
        { name: 'FullName', type: 'string' },
        { name: 'MarketCenter', type: 'string' },
        { name: 'FunctionTitle', type: 'string' },
        { name: 'HireDate', type: 'date' },
        { name: 'TermDate', type: 'date' }
    ],
    root: "Employees",
    record: "Employ",
    id: 'EmployeeID',

    url: "demos/sampledata/products.xml"
 };

dataAdapter: any = new $.jqx.dataAdapter(this.source);

unitsInStockRenderer: any = (row, columnfield, value, defaulthtml, columnproperties, rowdata) =>
{
    if (value < 20)
    {
        return '<span style="margin: 4px; float: ' + columnproperties.cellsalign + '; color: #ff0000;">' + value + '</span>';
    }
    else
    {
        return '<span style="margin: 4px; float: ' + columnproperties.cellsalign + '; color: #008000;">' + value + '</span>';
    }
};

columns: any[] =
[
    {
        text: 'Employee #', columngroup: 'ProductDetails',
        datafield: 'EmployeeNum', width: 330
    },
    {
        text: 'Name', columngroup: 'ProductDetails',
        datafield: 'FullName', width: 330
    },
    {
        text: 'M/C', columngroup: 'ProductDetails', 
        datafield: 'MarketCenter', width: 330
    },
    {
        text: 'Function', columngroup: 'ProductDetails',
        datafield: 'FunctionTitle', width: 330
    },
    {
        text: 'Hire Date', columngroup: 'ProductDetails',
        datafeild: 'HireDate', width: 330
    },
    {
        text: 'Term Date', columngroup: 'ProductDetails',
        datafeild: 'TermDate', width: 330
    }
]; 

}

這是包含表數據的products.xml文件。 這里以一排為例

<Employees>

<Employ EmployeeID="1">
<EmployeeNum>2793</EmployeeNum>
<FullName>Brian Miller</FullName>
<MarketCenter>458-Salt Lake City</MarketCenter>
<FunctionTitle>Controller</FunctionTitle>
<HireDate>10/12/2008</HireDate>
<TermDate>10/12/2008</TermDate>
</Employ>

</Employees>

關於顯示網格內數據的任何幫助,以及為什么我鏈接到的上面的演示中的網格和列周圍沒有輪廓。 任何幫助表示贊賞。 謝謝

我只需要將xml文件放在資產文件夾中即可正常工作

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM