更新:問題が同じオリジン ポリシーのみに起因する可能性を回避するために、すべてのアセットが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>