0

Help Me please !! What happened to this error? I changed the class name of the table, but I cannot change it and this error occurs? enter image description hereenter image description here

new gridjs.Grid({
    columns: [{ name: 'ID', width: '60px' },
        { name: 'Name', width: '200px' },
        { name: 'Position', width: '300px' },
        { name: 'Email', width: '200px' },
        { name: 'Tel', width: '100px' },
        { name: '', width: '40px', sort: false }],
    sort: true,
    search: true,
    pagination: {
        limit: 5,
    },

    className: {
        table: 'table',
        thead: 'thead-dark'
    },

    language: {
        'search': {
            'placeholder': ' Search...'
        },
    },
    server: {
        url: 'http://localhost:55289/ManageUser/GetUserList',
        then: data => data.map(user => [user.id,
            user.first_name + '\xa0\xa0\xa0' + user.last_name,
            user.position, user.email,
            user.tel_mobile,
            gridjs.html(`<a id="button-delete" href="/ManageUser/Delete/${user.id}"><button class="btn btn-danger"><i class="fa fa-close"></i></button></a>`)])
    }
}).render(document.getElementById("user-table"));
Tee Adkins
  • 43
  • 4
  • 3
    You need to show your code, not the implementation of the error message in the library. – Barmar Dec 23 '20 at 04:32
  • as @Barmar said please show your code, avoid sharing code images show your code instead of images so that someone can copy and implement the things on it. – Nads Dec 23 '20 at 04:43
  • I've updated it. – Tee Adkins Dec 23 '20 at 05:25
  • 2
    Have you tried adding the `id` property to your `columns` child with the empty `name`? I don't actually think you are supposed to use an empty `name` since it's required per https://gridjs.io/docs/config/columns – Tammy Shipps Dec 23 '20 at 11:29
  • In the error message it says an id for the columns is missing. Where do you define your ids for each column? – cloned Apr 18 '21 at 19:49

2 Answers2

1

As Tammy mentioned, you need to define a custom id for your column:

const grid = new Grid({
  columns: [{
     id: 'name',
     name: 'Name'
  }, {
     id: 'email',
     name: 'Email'
  }, {
     id: 'phoneNumber',
     name: 'Phone Number'
  }],
  data: [
    { name: 'John', email: 'john@example.com', phoneNumber: '(353) 01 222 3333' },
    { name: 'Mark', email: 'mark@gmail.com', phoneNumber: '(01) 22 888 4444' },
  ]
});

Demo: https://gridjs.io/docs/examples/import-json

Afshin Mehrabani
  • 33,262
  • 29
  • 136
  • 201
0

I had the same issue:

Could not find a valid ID for one of the columns. 
Make sure a valid "id" is set for all columns

And the fix was what Tammy mentions, I had an empty named column.

pcambra
  • 661
  • 9
  • 15