Topic: How do I utilize a string/convert one correctly to use in Datatable

PaulSpoerry priority asked 2 years ago


Expected behavior Wanting to be able to build the JSON to pass into the datatable. I'm using an older Classic ASP codebase with an MDB redesign. I need to be able to loop over the data and build it to pass into the JS.

EX (snippet attached):

let k = "{columns: [ { 'label': 'Column 1 DT', 'width': '100', 'fixed': 'true', 'sort': 'false' }, { 'label': 'Column 2'}], 'rows': ['Value 1', 'Value 2'] }, { 'bordered': 'true' } ";

const datatableInstance1 = new mdb.Datatable( document.getElementById('datatable1'), JSON.parse(JSON.stringify(k)) );

Actual behavior No matching results found. I can't pass as a string, or stringify, or parse/stringify. Slamming my head on my desk over this one. lol

Resources: (code snippets) https://mdbootstrap.com/snippets/standard/paulspoerry/3584350


Michał Duszak staff answered 2 years ago


Your JSON format was not valid and/or mispelled. I fixed your snippet.

https://mdbootstrap.com/snippets/standard/m-duszak/3593023

const datatableInstance2 = new mdb.Datatable(document.getElementById('datatable2'), {
columns: [
    { label: 'Column 1 DT2', width: 100, fixed: true, sort: false },
    { label: 'Column 2'}
],
rows: [
    ['Value 1', 'Value 2']
]
}, {
    bordered: true
});


let k = `{
    "columns": [{
        "label": "Column 1 DT",
        "width": 100,
        "fixed": true,
        "sort": false
    }, {
        "label": "Column 2"
    }],
    "rows": [["Value 1", "Value 2"]]
}`;

const datatableInstance1 = new mdb.Datatable( document.getElementById('datatable1'), JSON.parse(k), {
    bordered: true
} );


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Priority
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: MDB5 3.10.1
  • Device: Desktop
  • Browser: Edge 96.0.1054.62
  • OS: Win10Pro
  • Provided sample code: No
  • Provided link: Yes