9

更新:問題が同じオリジン ポリシーのみに起因する可能性を回避するために、すべてのアセットがServehttp://localhost:4000を使用した。問題は解決しませんでした。そのため、同じオリジン ポリシーが原因でフィドルの編集が機能しない可能性がありますが、そこにコードが表示されます。


Dynatableを使用して外部 JSON をロードし、読み取り/正規化ステップ (既存のテーブルから JSON を生成する) をスキップしようとしています。これはサポートされているはずですが、うまくいきません。

JSFiddle に対する私の試みは次のとおりです。フィドルに見られるように、ドキュメント内からの JSON のロード (これは私にはあまり役に立たないようです) は完全に機能しています。しかし、URL からのプルはまったく機能しません。

これが私のJavaScriptです:

// getting JSON from the document works, but of what use is that?
$(document).ready( function() {
    $('#local').dynatable({
        dataset: {
            records: JSON.parse($('#music').text())
        }
    });        
    // getting JSON from a remote source fails:
    $('#remote').dynatable({
        dataset: {
            ajax: true,
            ajaxOnLoad: true,
            ajaxUrl: '//www.dynatable.com/dynatable-ajax.json',
            records: []
        }
    });
});

...これは、「ローカル」の ID を持つテーブルと「リモート」の ID を持つ別のテーブルの 2 つのテーブルと、ローカル テーブルのデータを含むスクリプトを参照します。

<h3>Remote JSON: Failing</h3>
<table class="table table-striped" id="remote">
  <thead>
    <th>Some Attribute</th>
    <th>Some Other Attribute</th>
  </thead>
  <tbody>
  </tbody>
</table>
<hr>
<h3>Local JSON: Succeeding</h3>
<table class="table table-striped" id="local">
  <thead>
    <th style="color: black;">Band</th>
    <th>Album</th>
  </thead>
  <tbody>
  </tbody>
</table>
<script id="music">
[
    {
        "band": "The Police",
        "album": "Ghost In The Machine"
    },{
        "band": "Supertramp",
        "album": "Breakfast In America"
    },{
        "band": "Peter Tosh",
        "album": "Mama Africa"
    },{
        "band": "The Police",
        "album": "Regatta d'Blanc"
    },{
        "band": "The Police",
        "album": "Zenyatta Mondatta"
    },{
        "band": "Supertramp",
        "album": "Crime of the Century"
    },{
        "band": "Talking Heads",
        "album": "Remain in Light"
    },{
        "band": "Talking Heads",
        "album": "Speaking in Tongues"
    }
]
</script>
4

1 に答える 1