How to Generate Column via Loop Function?
How to Generate Column via Loop Function?
hooix0013
Posts: 17Questions: 5Answers: 0
I need to generate column with for loop inside the Column Object. Is it possible to do it in Datatables?
This is what I want to achieve to generate the column base on the element in the MonthList:
"columns": [
{ 'data': 'ID', "className": "text-center" },
{ 'data': 'ID', "className": "text-center" },
{ 'data': 'ID', "className": "text-center" },
function GenerateColm() {
for (var i = 0; i < MonthList[i].length; i++) {
title: MonthList[i],
className: "text-center",
orderable: false,
data: null,
defaultContent: '',
}
}
]
To Have a function like GenerateColm() in the columns object or any other alternative way to generate the column with the MonthList. Any Help is Appreciated!
This question has an accepted answers - jump to answer
Answers
Sounds like
columns.renderis what you want to use.Kevin
Actually, if I've understood correctly, then you want to add multiple columns in the
columnsarray? If so, yes it is quite possible, but not like that, as it is invalid Javascript.Create an array:
Then add any columns you want to it:
Put that in a loop if you need.
Then assign the columns array:
Allan
@allen yupp what I want is something you posted. Thanks for giving me idea. However, what i have done is as below, I first declare the pre-defined columns and then generate another array which 'title' will be get once data retrieved. Then I merge the oriCol and addedCol as my column:
Here I generate another array
Then Merge them together
Assign into columns
The predefined part works well when the datatable rendered, However the addedCol part was not able to render. Is there something wrong with the code? When I console I am able to saw the whole array value but for some reason the addedCol part can't be rendered.
It would help if you could post a test case demonstrating the issue. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.
Cheers,
Colin
http://live.datatables.net/kemefive/1/edit?html,js,output
Here's my latest example code. I was trying to add the columns dynamically base on the MonthList via for loop to append the th element. However it's not working.
FYI, I know if the MonthList is declare outside the datatable, it is able to populate the columns. But the MonthList will only generated in dataSrc in my case. So I cant run the for loop outside the datatable since it cannot read MonthList
Tbh, I'm not clear what you're trying to do here. That loop in
dataSrcis attempting to add to the table header. Can you explain please what the final goal is.Colin
You will need to get the column information before initializing Datatables. See this example:
http://live.datatables.net/qimukefe/1/edit
It sends a jQuery ajax() first to fetch the columns and builds it in the success function. The example uses the same URL as the
ajaxoption. This is due to limitations of what is available on the server side. You will use a different URL that just collects the column information.Kevin
@colin Sorry for unclear clarifying. What I want to achieve is that to dynamically add new columns based on the MonthList. My ajax will call some data which will be sorted as the initial columns. Then I will be sorting the data from the ajax call to form another array which is MonthList. And base on MonthList, generate new columns. That's why I use Append in the table to dynamically add MonthList's data into the existing columns.
Thanks for the clarification. You'd need to take the approach used in Kevin's example. DataTables does not have an API to add additional columns after initialisation. They need to be setup for initialisation.
Allan