Question

我刚刚发现了jsGrid并开始使用“http://js-grid.com/demos/”中的“基本场景”示例。这是在我跟随“http://js-grid.com/getting-started/”开始之后。

为了进行测试，我最终得到了下面的html和js文件。问题，没有工作。

我无法获得基本场景“表格，因为它在演示中显示。

任何人都可以展示我所缺少的东西吗？

以下是我的理解： 1.下载jsgris js和css文件 - 我这样做了 2.你必须使用div“” - 我做了这个 3.需要js代码来创建jsgrid对象 - 我这样做了，（参见我的js代码）

我的理解是，在演示示例中，使用的数据源是“clients”数组，其中包含代码。

我错过了什么？

    var clients = [
        { "Name": "Otto Clay", "Age": 25, "Country": 1, "Address": "Ap #897-1459 Quam Avenue", "Married": false },
        { "Name": "Connor Johnston", "Age": 45, "Country": 2, "Address": "Ap #370-4647 Dis Av.", "Married": true },
        { "Name": "Lacey Hess", "Age": 29, "Country": 3, "Address": "Ap #365-8835 Integer St.", "Married": false },
        { "Name": "Timothy Henson", "Age": 56, "Country": 1, "Address": "911-5143 Luctus Ave", "Married": true },
        { "Name": "Ramona Benton", "Age": 32, "Country": 3, "Address": "Ap #614-689 Vehicula Street", "Married": false }
    ];
 
    var countries = [
        { Name: "", Id: 0 },
        { Name: "United States", Id: 1 },
        { Name: "Canada", Id: 2 },
        { Name: "United Kingdom", Id: 3 }
    ];
 
    $("#jsGrid").jsGrid({
        debugger;
        width: "100%",
        height: "400px",
 
        inserting: true,
        editing: true,
        sorting: true,
        paging: true,
 
        data: clients,
 
        fields: [
            { name: "Name", type: "text", width: 150, validate: "required" },
            { name: "Age", type: "number", width: 50 },
            { name: "Address", type: "text", width: 200 },
            { name: "Country", type: "select", items: countries, valueField: "Id", textField: "Name" },
            { name: "Married", type: "checkbox", title: "Is Married", sorting: false },
            { type: "control" }
        ]
    });

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <link href="/public/css/style.css" rel="stylesheet" />
    <link href="http://js-grid.com/css/jsgrid.min.css" rel="stylesheet" />
    <link href="http://js-grid.com/css/jsgrid-theme.min.css" rel="stylesheet" />
    <title>JSGrid and PHP Sample</title>
</head>
<body>
<header>
    <h1>JSGrid and PHP Sample</h1>
</header>

<div id="jsGrid"></div>

<script>

</script>


<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="http://js-grid.com/js/jsgrid.min.js"></script>
<script src="/public/js/sample.js"></script>
</body>
</html>

如何开始使用jsGrid

0 个答案: