var populationDataTable = (populationdata) => { var lengthMenu = [10, 25, 50, 100, 1000]; if(populationdata.length > 1000) { lengthMenu.push(populationdata.length) } $("#tbl-select-population").DataTable({ responsive: true, lengthMenu: lengthMenu, language: { processing: "Processing… Please wait.", loadingRecords: "Loading population — Please wait.", lengthMenu: "Show _MENU_ populations", info: "Showing _START_ to _END_ of _TOTAL_ populations" }, data: populationdata, columns: [ { data: (apopulation) => { return `<input type="radio" name="population_id"` + `id="rdo_population_id_${apopulation.InbredSetId}" ` + `value="${apopulation.InbredSetId}">`; } }, { data: (apopulation) => { return `<label for="rdo_population_id_${apopulation.InbredSetId}" ` + `class="control-label" style="font-weight: 1;">` + `${apopulation.FullName} (${apopulation.InbredSetName})` + `</label>`; } } ] }); }; $(() => { populationDataTable(JSON.parse( $("#tbl-select-population").attr("data-populations-list"))); });