2012-04-26 21 views
0

私がしたいのはこれです。
フォームを送信すると、フォームの値がコントローラに渡され、値が変換されてデータテーブルに返されます。

私はjsonデータをコントローラからデータテーブルに戻す方法を知っています。
また、フォーム値をAjax.BeginFormによってコントローラに渡す方法も知っています。
しかし、私は両方を行う方法がわかりません。
固定jsonデータをデータテーブルに返すだけのコードです。
フォーム値をコントローラに渡してjQueryデータテーブルに値を返す方法

ビュー

<script type="text/javascript"> 

     function PullIntoTable() { 
      $('#example').dataTable({ 
       "bDestroy": true, 
       "bAutoWidth": false, 
       "aoColumns": [ 
       { sWidth: '30%' }, 
       { sWidth: '10%' }, 
       { sWidth: '20%' }, 
       { sWidth: '20%' }, 
       { sWidth: '20%' }, ], 
       "sAjaxSource": '@Url.Action("Search", "SearchCompany")', 
       "fnServerData": function (sSource, aoData, fnCallback) { 
        $.ajax({ 
         dataType: 'json', 
         type: "POST", 
         url: sSource, 
         data: aoData, 
         success: function (json) { 
          fnCallback(json); 
         } 
        }) 
       } 
      }); 
     }; 

    </script> 

    <input type="submit" value="Search" onclick="PullIntoTable()" /> 


<table cellpadding="0" cellspacing="0" border="0" class="search_result" id="example" width="100%"> 
    <thead> 
     <tr> 
      <th>Company</th> 
      <th>Location</th> 
      <th>Address</th> 
      <th>Status</th> 
      <th>Inactive</th> 
     </tr> 
    </thead> 
    <tbody> 
    </tbody> 
    <tfoot> 
     <tr> 
      <th></th> 
      <th></th> 
      <th></th> 
      <th></th> 
      <th></th> 
     </tr> 
    </tfoot> 
</table> 

コントローラ

public class SearchCompanyController : Controller 
{ 
    [HttpPost] 
    public ActionResult Search() 
    { 
     var Result = new List<Result>() 
     { 
      new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"}, 
      new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"}, 
      new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"}, 
      new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"}, 
      new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"}, 
      new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"}, 
      new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"}, 
      new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"}, 
      new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"}, 
      new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"}, 
      new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"}, 
      new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"}, 
      new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"}, 
      new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"}, 
      new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"}, 
      new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"}, 
      new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"}, 
      new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"} 
     }; 

     return Json(
      new { aaData = Result.Select(x => new[] { x.Name, x.Location, x.Address, x.Status, x.Inactive }) }, 
      JsonRequestBehavior.DenyGet 
      ); 
    } 
} 

public struct Result 
{ 
    public string Name { get; set; } 
    public string Location { get; set; } 
    public string Address { get; set; } 
    public string Status { get; set; } 
    public string Inactive { get; set; } 
} 

答えて

1

DataTableのvery specific format内のデータが必要です。

There's an example using OpenSearch(具体的には、コールバック用のjavascriptでjsonオブジェクトを構築する非データ型固有の実装)の詳細を収集することができます。このソリューションは、データテーブル固有の実装の詳細をサーバーサイドのコードから守るため、私にとって最も魅力的です。

すでにasp.net samples on the datatables.net siteがありますが、あなたはほとんどあなたが必要とするすべてのものを提供していますが、むしろ醜いハンガリー語の表記形式です。

私は指先でサンプルを持っていませんが、私はc#サンプルを取ってアクションフィルタに変換しましたので、ハンガリー語表記に対処する必要はありませんでした。もし私がそれに手を置いて、あなたが興味を持っているなら、私はここにそれを掲示できるかどうかを見ます。

+0

はあなたに感謝し、次の

ビュースクリプトのようなデータテーブルにそれらを引くことができます。私は今、最初にウェブサイトを見るでしょう。 – Nigiri

0

解決済みです。
私はコントローラから値を取得し、

function PullIntoTable(e) { 
    $('#example').dataTable({ 
     "bDestroy": true, 
     "bAutoWidth": false, 
     "aoColumns": [ 
     { sWidth: '30%' }, 
     { sWidth: '10%' }, 
     { sWidth: '20%' }, 
     { sWidth: '20%' }, 
     { sWidth: '20%' }, ], 
     "aaData": e.aaData 
    }); 
}; 
関連する問題