1

I have this multidimensional json that is supposed to generate an html table. But as of right now, the only things that are getting written, is the tr's, no td's.

I know there is already a similar question title, but usage is quite different.

The difference from what I can tell is that I am writing my templates using the template method instead of declaring each one as its own script...

This is the parsed(JSON) array


[
    [
        {
        "name": "Morning meeting.",
        "description": "The morning business meeting hosted at Apple.",
        "image": "302632084.png",
        "rating": "1.5",
        "category": "4"
        },
        {
        "name": "Winning",
        "description": "",
        "image": "321752348.png",
        "rating": "5.0",
        "category": "3"
        },
        {
        "name": "1234566890abcdefghijklmnopqrstuvwxyz",
        "description": "",
        "image": "316892896.png",
        "rating": "3.0",
        "category": "16"
        }
    ],
    [
        {
        "name": "Kristian Lunch",
        "description": "Having a lunch break.",
        "image": "320196094.png",
        "rating": "3.0",
        "category": "8"
        },
        {
        "name": "Dropping the kids off at the pool.",
        "description": "A daly lesson on taking the kids to the pool.",
        "image": "302658031.png",
        "rating": "5.0",
        "category": "4"
        },
        {
        "name": "Dropping the kids off at the pool.",
        "description": "A daly lesson on taking the kids to the pool.",
        "image": "302658031.png",
        "rating": "5.0",
        "category": "4"
        }
    ]
]

This is my method that's supposed to write the data


EventsView.prototype.writeGrid = function(events)
{
    var gridRows = "<td class='gridRow'>${name}</td>";    
    $.template("gridRows", gridRows);
    var markup = "<tr class='gridCol'>{{events, gridRows}}</tr>";
    $.template( "gridCols", markup );
    $.tmpl( "gridCols", events )
        .appendTo("#gridBody");
}

As of right now, this is the html that is generated


<tbody id="gridBody">
    <tr class="gridCol">
    </tr>
    <tr class="gridCol">
    </tr>
</tbody>

This is the HTML I want...


<tbody id="gridBody">
    <tr class="gridCol">
        <td class="gridRow">Morning meeting.</td>
        <td class="gridRow">Winning</td>
        <td class="gridRow">1234566890abcdefghijklmnopqrstuvwxyz</td>
    </tr>
    <tr class="gridCol">
        <td class="gridRow">Kristian Lunch</td>
        <td class="gridRow">Dropping the kids off at the pool.</td>
        <td class="gridRow">Dropping the kids off at the pool.</td>
    </tr>
</tbody>
0

1 Answer 1

1

JSON is your friend and much neater than a multidimensional array...

http://www.json.org/js.html

https://github.com/douglascrockford/JSON-js

Sign up to request clarification or add additional context in comments.

3 Comments

Are you using the json2.js? If so, can you please put up a jsFiddle and I will take a look for you? Only too happy to help with this, I've done a similar templating system not long ago... :-)
I'm not too sure what json I am using. I posted it up on jsfiddle.. Thanks for the help! jsfiddle.net/YHQAa
I found a work around not using the template system, but I really dont want to have this one part of the site that doesnt use it.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.