2016-11-02 41 views
0

2つのエントリを持つオブジェクトの配列があります。 DataTableはエラーになりますが、テーブルは表示されません。私は正常に動作するように見える似構造を持っていますが、何らかの理由で、この1はしていません: HTML:DataTableでテーブルが表示されない理由

<form id=rparesponses class="hideme rpadealers"> 
    <table id="responseTbl" class="table table-striped table-border"> 

    <thead> 
    <tr> 
     <th>Dealer Email</th> 
     <th>MesgID</th> 
     <th>Name</th> 
     <th>Description</th> 
     <th>Price</th> 
     <th>Accept CC</th> 
     <th>Delivery</th> 
     <th>Rating</th> 
     <th>Place Order</th> 
    </tr> 
    </thead> 

    </table> 
</form> 

はJQuery:

function displayResponses(responses) 
     { 

     // var count=rpaResponses.length; 
      alert("responses.name: "+responses[0].name); 

      $('#responseTbl').DataTable({ 
      data: responses, 
       'sort': false, 
       'searching': false, 
       'paging': true, 
      columns: 
      [ 
       {'data': 'email'}, 
       {'data': 'mesgid'}, 
       {'data': 'name'}, 
       {'data': 'description'},    
       {'data': 'price'}, 
       {'data': 'ccard'}, 
       {'data': 'delivery'}, 
       {'data': 'rating'}, 
       {'data': 'order'} 
      ], 
      columnDefs: 
      [ 
       {'targets': 6, 
       'render': function(data,type,full,meta) 
       { 
       var pform='<form action="javascript: this.preventDefault"><select name="deliver"><option value="Pickup">Pickup</option><option value="Delivery">Delivery</option></select></form>'; 

       if(data) 
        return data; 
       else return pform; 
        } 
       }, 

       {'targets': 8, 
        'render': function(data,type,full,meta) 
        { 

        return '<button id="order" type="" class="btn btn-primary btn-details">Order</button>'; 

        } 
       } 
      ] 

      }); 

     } //end of display responses 

displayResponsesへの呼び出しが

です
socket.on('rparesponse', function(data) 
      { 

      var rpaResponses=JSON.parse(data); 

      alert("rpaResponses.length: "+rpaResponses.length); 
      alert("rpaResponses.name: "+rpaResponses[0].name); 

     if(rpaResponses.length>0) 
      localStorage.messageid=""; 

      displayResponses(rpaResponses); 

      $('#dealers').hide(); 
      $('#rpaResponses').show(); 
      $('#rpaview').hide(); 
      $('#rpawait').hide(); 


      }); 

Devtoolsを使用して、渡されたarg "responses"がオブジェクトの配列であることを確認できます。以下を参照してください:

rpaResponses: Array[2] 
    0 
    : 
    Object 
    ccard 
    : 
    "true" 
    delivery 
    : 
    "false" 
    description 
    : 
    "Fan Belt for BMW-x5 2012 model e" 
    email 
    : 
    "[email protected]" 
    mesgid 
    : 
    "ccc89e" 
    name 
    : 
    "Peters Auto " 
    order 
    : 
    false 
    price 
    : 
    "6000" 
    rating 
    : 
    "5" 
    __proto__ 
    : 
    Object 
    1 
    : 
    Object 
    ccard 
    : 
    "true" 
    delivery 
    : 
    "false" 
    description 
    : 
    "Fan Belt for BMW-x5 2012 model e" 
    email 
    : 
    "[email protected]" 
    mesgid 
    : 
    "ccc89e" 
    name 
    : 
    "Peters Auto " 
    order 
    : 
    false 
    price 
    : 
    "5000" 
    rating 
    : 
    "5" 
    __proto__ 
    : 
    Object 
    length 
    : 
    2 

私はChrome 54.28を使用しています... Firefoxで同じ問題が発生しています。私はnodejs、socketio、javascript、jqueryを使用しています。サーバー側はOKです。ソケットの上にテーブルを送信しました。OK ... JSON.string then JSON.parse。私はまた、この主題に関するこれまでの質問をチェックしましたが、どれも適用されません。

誰かが私のエラーを教えてもらえますか?....多分私の目は行くつもりです...私はこれについて新しいものですか?

+0

@offir Peer ... tbodyタグを追加しても問題は解決しませんでした。私はそれがなくても働く他のテーブルを持っているので私はそれを知りませんでした....その答えは解決策として受け入れられませんでした – MichaelE

+0

@offirピア....私は前にこのビデオを見て、もう一度見ました.. Ajaxのソース...私は何もしていない...彼らはtbodyタグを使用していないそのビデオでも注意してください。私は問題がdatatableデータソース(json、配列、オブジェクトなど)を表示する方法だと考えています。私はデータソースがオブジェクトの配列でなければならないという勧告を見た。私のデータソースはオブジェクトの配列です...これはdataTableにこれを伝える方法ですか?それがAjaxでどのように行われたか? – MichaelE

+0

@ OffirPe'er .... DataTablesの矛盾があると思われるのは、私が前に言ったように、まったく同じ構造が働いているからです...実際には同じHTML内にあります。表示するときに隠れる#dealersですこのテーブル.... – MichaelE

答えて

0

構文エラー... $(#rpaResponse).showを$(#rparesponse).showに変更します。

関連する問題