CODEWITHSUNDEEP
javascriptjqueryhtmljson
Jake Chasan
Jake Chasan

Reputation: 6550

Load a JQuery Page from JSON

This is what I am trying to do: have an unordered list, and when the user taps on one of the rows, the program fetches a longer definition from JSON data, because the row title of the table and the JSON key are the same.

My goal: Only have one JQuery Mobile Page that loads definitions (because they will all look identical), but load the JSON data so each page has different JSON.

Finally, if possible, the new page would just extend the length of the menu cell and add the definition below.

So to wrap up: user taps on cell, of word, definition slides out underneath, and extends the length of the list so the next item is visible.

Ideas?

Upvotes: 0

Views: 57

Answers (1)

4m1r
4m1r

Reputation: 12552

I think you're looking for something like this? Check out the fiddle too: http://jsfiddle.net/R5aFq/

var descriptionObject = {
    cool_row: {
        description: "You are so cool."
    },
    cooler_row: {
        description: "So are you!"
    }
};

$('body').on('click', 'li', function (e) {
    e.preventDefault();

    var myDescription = descriptionObject[$(this).data('title')].description;

    $(this)
        .find('.row-description')
        .html(myDescription);
});

Upvotes: 1

Related Questions