oracle Jet - заполнение базовой таблицы с помощью json - PullRequest
Новая
       30

oracle Jet - заполнение базовой таблицы с помощью json

0 голосов
/ 07 мая 2018

обновление

Мне кажется, я нашел ошибку. Я изменил JSON-данные и обнаружил, что мне удалось добавить "," в последнюю строку HeaderText в HTML. Удалил его и теперь он правильно помещает данные в таблицу.

Я пытаюсь заполнить таблицу некоторыми JSON-данными, но все, что я получаю, это ошибка: 

Uncaught Error: oj-table with id 'table1': Unable to parse columns='[
            {headerText: "ID", field: "id"},
            {headerText: "Name", field: "name"},
            {headerText: "Username", field: "username"},
            {headerText: "E-mail", field: "email"},
            ]' for OJ-TABLE with id table1 to a JSON Object. Check the value for correct JSON syntax, e.g. double quoted strings. SyntaxError: Unexpected token h in JSON at position 19
at Object._throwError (ojcustomelement.js:514)
at _coerceVal (ojcustomelement.js:1110)
at Object.oj.BaseCustomElementBridge.__ParseAttrValue (ojcustomelement.js:1124)
at Object.oj.BaseCustomElementBridge.__InitProperties (ojcustomelement.js:1028)
at Object.InitializeElement (ojcomponentcore.js:5504)
at Object._connected (ojcustomelement.js:378)
at HTMLElement._connectedCallback [as connectedCallback] (ojcustomelement.js:404)
at Object.setDomNodeChildren (knockout-3.4.2.debug.js:288)
at Object.setDomNodeChildren (knockout-3.4.2.debug.js:2827)
at Object.oj.CompositeTemplateRenderer.renderTemplate (ojcomposite-knockout.js:105)

Я использую https://jsonplaceholder.typicode.com/users в качестве JSON-источника. Я хочу вставить данные в указанные столбцы. Что мне не хватает? То, что я нашел в Google, очень похоже на мой код, и документация мне не сильно помогла.

Я хотел бы отметить, что я новичок в JET и до этого мало работал с данными JSON.

Мой код выглядит следующим образом

HTML 

<oj-table id='table1' aria-label='testTable'
  data='[[dataSource]]'
  columns='[
            {headerText: "ID", field: "id"},
            {headerText: "Name", field: "name"},
            {headerText: "Username", field: "username"},
            {headerText: "E-mail", field: "email"},
            ]'
  style='width: 50%;'>

JS 

define(
['ojs/ojcore', 'knockout', 'jquery', 'ojs/ojtable', 'ojs/ojarraytabledatasource'], 
function (oj, ko, $) {
    function testTable() {
        var self = this;          
        self.data = ko.observableArray();
        $.getJSON("https://jsonplaceholder.typicode.com/users").
            then(function (users) {
                $.each(users, function() {
                    self.data.push({
                        id: this.id,
                        name: this.name,
                        username: this.username,
                        email: this.email
                    });
                });
            });
        self.dataSource = new oj.ArrayTableDataSource(
            self.data,
            {idAttribute: 'id'}
        );
    }             
        return testTable;
});

1 Ответ

0 голосов
/ 07 мая 2018

Ошибка довольно проста, и, надеюсь, этого небольшого изменения будет достаточно: в вашем определении столбца HTML также используйте двойные кавычки для ключей, а не только для значений. 

<oj-table id='table1' aria-label='testTable'
  data='[[dataSource]]'
  columns='[
        {"headerText": "ID", "field": "id"},
        {"headerText": "Name", "field": "name"},
        {"headerText": "Username", "field": "username"},
        {"headerText": "E-mail", "field": "email"},
        ]'
  style='width: 50%;'>
...