Iterate an API list and populate it in table

Iterate an API list and populate it in table

Muhammad IzzatMuhammad Izzat Posts: 22Questions: 10Answers: 0

Greeting, I'm having trouble populating datatable data that coming from a API in a form of a list, when I populate it in my table, all the data are populated in 1 single row, can anyone help me with this, thanks

below is my code :

API :

[
    {
        "id": 9,
        "project_name": "Project A",
        "user": [
            "Person A",
            "Person B",
            "Person C",
        ]
    }
]

Javascript :

var artist_table = $('#artist-datatable').dataTable({
                    dom: 'Blrtip',
                    JQueryUI: true,
                    sScrollY: "350px",
                    responsive: false,
                    select: true,
                    ajax: {
                        url: "/api/scheduler/crew-list/" + project_id + "/?format=json",
                        dataSrc: ''
                    },
                    columns: [
                    {"data": "user", "class": "user_id"},

                ]
                })

Answers

  • colincolin Posts: 15,118Questions: 1Answers: 2,583

    Hi Muhammad,

    The data that's being sent doesn't match what you've configured. For example, do you want to show a user per row, or a project per row with multiple users in that row?

    We've created a live example here for you, which as you can see, is using local data rather than AJAX sourced. I would suggest poking about with that until you get what you want, then revert back to trying the AJAX data source.

    Hope that helps,

    Colin

This discussion has been closed.