jquery AJAX RESTはデータテーブルを再初期化します

Question

私は正しいことができないようなコードを少し持っています。私はこれで非常に新しいですし、誰かが正しい方向に私を指すことができればうまくいけば私はできるように最善を尽くそうとしています。私はSharepointリストからいくつかの情報を引き出すためのシンプルなAJAXコードを持っています。

私は1つをクリックするとテーブルにロードされた1セットの情報を取得し、他のボタンをクリックすると別の情報を取得する2つのボタンがあります。残念ながら、私はそれを得ることができないので、私は1つをクリックすることができます情報を取得し、2番目のをクリックするとテーブルを消去し、新しい情報で置き換える必要がありますが、両方の作業が、クリック間のページを更新する必要があります。

アドバイスをいただければ幸いです。私はウェブ上で高低を検索し、この問題に対する多くの「解決策」を見つけましたが、誰も私にとってはうまくいかなかったようです。以下のコードを参照してください。

function ButtonFunction(input) { 
var call = $.ajax({ 
    url: _spPageContextInfo.webAbsoluteUrl + "/_api/Web/Lists/GetByTitle('List1')/items?$select=Title,Column4,Column7&$filter=(Column6 eq '"+input+"')&$top=5000", 
    type:"GET", 
    dataType: "json", 
    headers: { 
    Accept: "application/json;odata=verbose" 
    } 
    }); 

    call.done(function (data,textStatus, jqXHR){ 
     $('#example').dataTable({ 
      "bDestroy":true, 
      "bProcessing":true, 
      "aaData":data.d.results, 
      "aoColuns": [ 
        {"mData": "Title" }, 
        {"mData": "Column4" }, 
        {"mData": "Column7" }, 
     ] 
    }); 
}); 

call.fail(function (jqXHR, textStatus,errorThrown){ 
    alert("Error" + jqXHR.responseText); 
}); 

}

Answer 1

。どうやら私は古いバージョンのdatatables.cssを持っていた。私が最新のバージョンにリンクしたとき、すべてのものはちょうどそれが想定されていたように機能した。

Answer 2

テーブルからすべての行を削除します。

すべて申し訳ありません

var table = $('#example').DataTable(); 
var rows = table.rows().remove() 


function ButtonFunction(input) { 
var table = $('#example').DataTable(); 
var rows = table.rows().remove() 
var call = $.ajax({ 
url: _spPageContextInfo.webAbsoluteUrl + "/_api/Web/Lists/GetByTitle('List1')/items?$select=Title,Column4,Column7&$filter=(Column6 eq '"+input+"')&$top=5000", 
type:"GET", 
dataType: "json", 
headers: { 
Accept: "application/json;odata=verbose" 
} 
}); 

call.done(function (data,textStatus, jqXHR){ 
    $('#example').dataTable({ 
     "bDestroy":true, 
     "bProcessing":true, 
     "aaData":data.d.results, 
     "aoColuns": [ 
       {"mData": "Title" }, 
       {"mData": "Column4" }, 
       {"mData": "Column7" }, 
    ] 
    }); 
}); 

    call.fail(function (jqXHR, textStatus,errorThrown){ 
    alert("Error" + jqXHR.responseText); 
});