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

PaulSpoerry priority asked 10 months 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 10 months 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

  • User: 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