2016-09-20 7 views
1

を動作しません、私はモーダル上にプロットされたデータテーブルの上に私のデータを移入したいと思い、私はリンクの多くを検索し、私は1つの興味深いトピックに出会いました。..移入データは

私がボタンを持っていますそれは...サーブレットからデータを取得する機能をトリガします

<button class="w3-btn w3-black w3-round-xxlarge w3-hover-green" id="viewButton" onClick="loadDoc(this.id)">View</button> 

私のAjaxコード..

<script> 
function loadDoc(id) { 
    var xhttp = new XMLHttpRequest(); 
    xhttp.onreadystatechange = function() { 
    if (this.readyState == 4 && this.status == 200) { 
     openModal(this.responseText); 
    } 
    }; 
    xhttp.open("GET", "/ETEEAP/ViewApplication?id=" + id, true); 
    xhttp.send(); 
} 
function openModal(id){ 
document.getElementById('id01').style.display='block'; 
loadTable(id); 
} 
</script> 

私は、モーダルを開くことができたが、それは「UNKNOWN REQUESTED」エラーを返しますこれは私がサーブレットから取得応答をある

<div id="id01" class="w3-modal"> 
<div class="w3-modal-content w3-animate-top w3-card-8" style="margin-top:20px;"> 
<header class="w3-container w3-teal"> 
    <span onclick="document.getElementById('id01').style.display='none';" 
    class="w3-closebtn">&times;</span> 
    <h2>Program Details</h2> 
</header> 
<div class="w3-container w3-light-grey" style="margin-bottom: 50px;"> 
    <div class="w3-container w3-padding-8 w3-opacity w3-white w3-round-xlarge w3-border w3-hover-border-black" 
    style="margin: 10px 10px 10px 10px;"> 
     <table id="myTable1" class="display"> 
     <thead> 
     <tr> 
      <th>SUBJECT</th> 
      <th>COURSE</th> 
      <th>UNITS</th> 
      <th>SEMESTER</th> 
      <th>YEAR LEVEL</th> 
      <th>STATUS</th> 
     </tr> 
     </thead> 
     <tfoot> 
     <tr> 
      <th>SUBJECT</th> 
      <th>COURSE</th> 
      <th>UNITS</th> 
      <th>SEMESTER</th> 
      <th>YEAR LEVEL</th> 
      <th>STATUS</th> 
     </tr> 
     </tfoot> 
     <tbody> 
    </tbody> 
    </table> 
    <script> 
     function loadTable(id){ 
      alert(id); 
      $('#myTable1').DataTable({ 
       aaData : id, 
       aoColumns : [ 
        {mDataProp : "SUBJECT"}, 
        {mDataProp : "COURSE"}, 
        {mDataProp : "UNITS"}, 
        {mDataProp : "SEMESTER"}, 
        {mDataProp : "YEAR LEVEL"}, 
        {mDataProp : "STATUS"} 
          ] 
      }); 
     } 
    </script> 
    </div> 
</div> 

これは私のモーダルコードです

エラーの詳細についてhttp://datatables.net/tn/4 .. .. ..

[{"SUBJECT":"Programming I","UNITS":"3","SEMESTER":"First","COURSE":"BSCPE","YEAR LEVEL":"First","STATUS":"PENDING"}, {"SUBJECT":"Communication Arts I","UNITS":"2","SEMESTER":"First","COURSE":"BSCPE","YEAR LEVEL":"First","STATUS":"PENDING"}, {"SUBJECT":"Programming II","UNITS":"3","SEMESTER":"Second","COURSE":"BSCPE","YEAR LEVEL":"First","STATUS":"PENDING"}, {"SUBJECT":"COMORG","UNITS":"4","SEMESTER":"Second","COURSE":"BSCPE","YEAR LEVEL":"Second","STATUS":"PENDING"}] 

このプログラムを実行すると、上記のエラーがスローされます。しかし、変数に指定された応答を割り当ててハードコードすると、正常に動作します。それは働いていませんか?誰もがそれが今取り組んでいる。..

+0

'loadTable'関数も投稿できますか? –

+0

そのモーダルコード..:D –

+0

サーブレットからの応答は文字列かJSONオブジェクトですか? – CMedina

答えて

1

を私を助けることができます..私は..

をID = $ .parseJSON(ID)JSONへの応答を変換します。