How to Generate div Elements from Excel Spreadsheet

Question

What's the best way to go from a table or excel spreadsheet to div elements? I have table that has a couple hundred rows that I want to represent as div elements in a HTML file. The finished product will look something like this:

<div id="COL1" style="display:none;">COL2 blah blah COL3</div>

The text between COL2 and COL3 will all be the same. I can just as easily insert it into my table before converting. Any thoughts?

Answer 1

I'm not sure I understood the input correctly, but if you want to generate a bunch of DIVs with some repeating text, you may add to E1 (assuming your text COL1...3 and blah blah are placed in columns A:D starting first row) the following formula:

="<div id="""&A1&""" style="""&"display:none;"""&">"&B1&" "&C1&" "&D1&"</div>"

Autofill it down the list of text values and export / copy to HTML editor generated DIVs.

Sample file: https://www.dropbox.com/s/gd52pp2p34flesg/DIVgenerator.xlsx

Answer 2

You need to use Javascript/jquery or whatever scripting language you are familiar with.

First step will be getting the data from excel sheet into an array and then you can append it in the html using

var i=0;
$.each(array, function () {
$("#DIVID").append(array[i]);
i++;
});

this will basically iterate through each element in the array[].