7770


まず、現在の実装状況です。

HTMLではカラム名のみを設定しています。  
javascriptでは、すでにjsonを取得しています。  
jsonの内容は  
{"NO":"1", "cal1":"taro", "cal2":"1234", "cal3":"jap", "cal4":"30"}の構成で、複数来ます。  
取得したデータ要素はそれぞれ「No.←NO、列１←cal1、列２←cal1、列３←cal1、列４←cal1」というようにカラムに追加していきたいです。

※また、最終的にはTableにチェックボックスカラムを追加する予定です。

このように、JsonをTableに反映させたいのですが、方法が分かりません。ご教授をお願いします。

[code]

    ＊java script
    $(document).ready(function () {
        var url = "http://url";
       // Jsonデータ取得
        $.get(url, function (jsonData) {
    
        });
    
        $('#example').dataTable({
            bProcessing: true,
            iDisplayLength: 100,
            sPaginationType: "full_numbers",
            bSortClasses: false,
            bFilter: true,
            bLengthChange: true,
            bJQueryUI: true
        });
    });
    
[/code]

[code]

    *HTML
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=s-jis" />
        <title>DataTables example</title>
        <style type="text/css" title="currentStyle">
            @import "./css/styles1.css";
            @import "./css/jquery-ui-1.10.4.custom.min.css";
        </style>
        <script type="text/javascript" language="javascript" src="js/jquery.js"></script>
        <script type="text/javascript" language="javascript" src="js/jquery-ui-1.10.4.custom.min.js"></script>
        <script type="text/javascript" language="javascript" src="js/jquery.dataTables.js"></script>
    </head>
    <body id="dt_example">
        <table id="example">
            <thead>
                <tr>
                    <th>No.</th>
                    <th>列１</th>
                    <th>列２</th>
                    <th>列３</th>
                    <th>列４</th>
                </tr>
            </thead>
            <tbody>
    
        </table>
        <script src="js/script1.js"></script>
    </body>
    </html>
    
[/code]

画面イメージです。  
![イメージ](https://i.stack.imgur.com/dvVC9.png)


CC BY-SA 3.0
2015-03-11T06:37:49.303
7769
2015-03-11T07:00:37.043
2015-03-11T07:00:37.043
7626
7626
question
javascript html jquery json
Datatablesを使用して、JsonデータをTableに表示する方法が知りたいです。


htmlのtableに入れる必要がそもそもありません。  
DataTablesのdataオプションとcolumnsオプションを設定すれば直接jsonを読んでくれます。  
下記ページのData source types: object の項を参照してください  
<http://www.datatables.net/manual/data>


CC BY-SA 3.0
2015-03-11T06:46:27.540
7770
2015-03-11T06:46:27.540
525
7769
answer