creating a jquery grid from json data that came back from an ajax request

Question

hi everyone,

i am searching for a way to create a grid (from some kind of jquery grid plugin didnt choose one yet)

anyway i want to call a webmethod and return a json serialized from a List of an object i created.

today i just use a regular grid view inside an iframe. but i want to eliminate that iframe

and create those grids with ajax requests

please help.

thank you

Answer 1

you can try using Chain.js

Answer 2

guy,

i use a little routine that dynamically creates the grid based on columns etc. it's good for prototyping and might help you out initially:

/************************************************/
/* Build a Dynamic HTML table from JSON results */
/* By: Zachary Hunter                           */
/* On: April 1, 2010                            */
/************************************************/

function CreateTableView(objArray, theme, enableHeader) {
    // set optional theme parameter
    if (theme === undefined) {
        theme = 'mediumTable'; //default theme
    }

    if (enableHeader === undefined) {
        enableHeader = true; //default enable headers
    }

    var array = typeof  objArray != 'object' ? JSON.parse(objArray) : objArray;

    var str = '<table class="' + theme + '">';

    // table head
    if (enableHeader) {
        str += '<thead><tr>';
        for (var index in array[0]) {
            str += '<th scope="col">' + index + '</th>';
        }
        str += '</tr></thead>';
    }

    // table body
    str += '<tbody>';
    for (var i = 0; i < array.length; i++) {
        str += (i % 2 == 0) ? '<tr class="alt">' : '<tr>';
        for (var index in array[i]) {
            str += '<td>' + array[i][index] + '</td>';
        }
        str += '</tr>';
    }
    str += '</tbody>'
    str += '</table>';
    return str;
}

cheers

jim