2012-08-10 106 views
1

我想實現我的ASP.NET MVC應用程序KendoUI Grid控制。 我知道KendoUI傢伙給出了很多例子,但它不適合我。綁定數據庫在ASP.NET MVC劍道UI電網

我的模型代碼是:

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using System.Data.SqlClient; 
using System.Data.Sql; 
using System.Data; 

namespace KendoGrid.Models 
{ 
    public class status 
    { 
     public string SiteId { get; set; } 
     public string SiteName { get; set; } 
     public string SiteStatus { get; set; } 

     public static List<status> StatusInfo() 
     {  
      SqlConnection sconn = new SqlConnection(@"Data Source=DS-7071BC8FDEE6\SQLEXPRESS;Initial Catalog=AmanoTest;User ID=sa;[email protected]"); 
      SqlCommand cmd = new SqlCommand("select * from SiteMaster", sconn); 
      SqlDataAdapter sda = new SqlDataAdapter(cmd); 
      DataTable dt = new DataTable(); 
      sda.Fill(dt); 
      status cstat; 
      List<status> statlist = new List<status>(); 
      foreach (DataRow dr1 in dt.Rows) 
      { 
       cstat = new status(); 
       cstat.SiteId = dr1[0].ToString(); 
       cstat.SiteName = dr1[1].ToString(); 
       cstat.SiteStatus = dr1[2].ToString(); 

       statlist.Add(cstat);  
      } 
      return statlist; 
     } 
    } 
} 

我的控制器代碼是:

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using System.Web.Mvc; 
using KendoGrid.Models; 
using Kendo.Mvc.UI; 

namespace KendoGrid.Controllers 
{ 
    public class statusController : Controller 
    { 
     // 
     // GET: /status/ 

     public ActionResult Index() 
     { 
      return View(); 
     } 
     public ActionResult Site() 
     { 
      //List<status> status = status.GetStatus(); 
      List<status> temp = status.StatusInfo(); 
      ViewData["table"] = temp; 
      return View(); 
     }  
    } 
} 

我的視圖(.cshtml頁)是:

@model KendoGrid.Models.status 
@using Kendo.Mvc.UI 

@*@{ 
    Layout = null; 
} 
*@ 
<!DOCTYPE html> 

<html> 
<head> 
    <meta name="viewport" content="width=device-width" /> 
    <title>Site</title> 
</head> 
<body> 
    <div> 
     @(Html.Kendo().Grid(Model)() 
       .Name("Grid") 
       .Columns(columns => 
        { 
         columns.Bound(p => p.siteID); 
         columns.Bound(p => p.siteID); 
         columns.Bound(p => p.siteID); 
        }) 
      .Pageable() 
      .Sortable() 
      .Scrollable() 
      .Filterable() 
      .DataSource(dataSource => dataSource   
     .Ajax() 
     .ServerOperation(false) 
     ) 
    ) 
    </div> 
</body> 
</html> 

上執行這樣說的:

爲 「Kendo.Mvc.UI.Fluent.WidgetFactory.Grid(System.Data.DataTable)」的最佳重載方法匹配具有 一些無效參數

+4

你傳遞回來的列表;但是'Grid'正在尋找一個DataTable。 – 2012-08-10 11:02:00

回答

0

您可以使用

var url = "/DesktopModules/MyServices/API/ATSManageClient/GetAllProjectsTechnologyBased?PortalId=210&tabid=95&Technology=" + selectedplatform; 

var element = $("#grid").kendoGrid({ 
//debugger; 
    type: "odata", 
    dataSource: { 
     transport: { 
      read: url 
     }, 
     schema: { 
      model: { 
       fields: { 
        RecievedDate: { type: "date" } 
       } 
      } 
     }, 
     pageSize: 100 
    }, 

    columnMenu: true, 
    scrollable: true, 
    filterable: true, 
    resizable: true, 
    sortable: true, 
    detailTemplate: kendo.template($("#template").html()), 
    detailInit: detailInit, 
    dataBound: function() { 
    }, 
    columns: [ 
{ 
    field: "ProjectID", 
    title: "Action", 
    template: "<a href='/Dashboard/Communication?ProjectID=#=ProjectID#'>View Communication</a>", 
    width: "20%" 
}, 
//s debugger; 
{ 
    field: "ClientName", 
    width: "20%", 
    title: "Client", 
    template: "<a href='Accounts/UpdateClient.aspx?ClientId=#=ClientID#'> #= ClientName #</a>", 
    attributes: { 
     title: "#=ClientName#" 
    } 
}, 
    { 
     field: "ProjectTitle", 
     width: "20%", 
     title: "Project", 
     template: "<a href='Project/EditProject.aspx?ProjectID=#=ProjectID#'> #= ProjectTitle #</a>", 
     attributes: { 
      title: "#=ProjectTitle#" 
     } 
    }, 
     { 
      field: "ColorList", 
      width: "20%", 
      template: kendo.template($("#template2").html()), 
      title: "Status" 
     }, 
     { 
      field: "RecievedDate", 
      width: "20%", 
      title: "Check List Status", 
      template: "" 
     }, 
     { 
      field: "RecievedDate", 
      width: "20%", 
      title: "Opened Bugs", 
      template: "" 
     } 

    ], 
    pageable: { 
     // we don't set any DataSource here 
     pageSizes: [100, 150, 200] 
    } 
});