2013-03-25 62 views
3

我在嘗試將KendoUi網格與來自控制器的Json數據綁定時遇到了一些問題。事情似乎很好,我的JSON對象包含數據,但尚格沒有顯示任何東西:無法將JSON數據綁定到KendoUI網格

,我在鉻收到此錯誤JavaScript控制檯:

GET http://localhost:8084/Records?take=5&skip=0&page=1&pageSize=5 500 (Internal Server Error) 

View

<div id="grid"> 
</div> 
<div> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $("#grid").kendoGrid({ 
       dataSource: { 
        type: "json", 
        serverPaging: true, 
        pageSize: 5, 
        groupable: true, 
        selectable: "row", 
        transport: { read: { url: "Records", dataType: "json"} } 
       }, 
       height: 400, 
       scrollable: true, 
       sortable: true, 
       filterable: true, 
       pageable: true, 
       columns: [ 
         { field: "No", title: "No" }, 
         { field: "Desc", title: "Description" }, 
         { field: "priority", title: "Priority" }, 
         { field: "decision", title: "Decision" } 
        ], 
       dataBound: function() { 
        this.expandRow(this.tbody.find("tr.k-master-row").first()); 
       } 
      }); 
     }); 
    </script> 

Controller

public ActionResult GetRecords() 
    { 
     var obj = new User(); 
     var jsnRslt = obj.GetResult(Session["id"].ToString()); 
//return Json(jsnRslt); 

     return Json(jsnRslt, JsonRequestBehavior.AllowGet); //Changed as suggested by Dismissile 
    } 

Model

public object GetResult(string usrId) 
    { 
… 
…. 
…..   try 
     { 
      int i = 0; 
      if (rcrds != null || rcrds.HasRows) 
      { 
       jsonWriter.WriteStartObject(); 
       while (rcrds.Read()) 
       { 
        for (int j = 0; j < rcrds.FieldCount; j++) 
        { 
jsonWriter.WritePropertyName(rcrds.GetName(j)); 
jsonWriter.WriteValue(rcrds.GetValue(j)); 
        } 
        i++; 
       } 
       jsonWriter.WriteEndObject(); 
      } 

     } 

     catch (Exception ex) { } 
     return jsonWriter; 
    } 
} 

請幫助。

+0

內部服務器錯誤是說在服務器上執行過程中出現問題。你是否用斷點調試你的應用程序? – 2013-03-25 14:05:27

+0

也許我錯了,但你發佈到你的服務器,但你的行動將接受你的參數在哪裏? – 2013-03-25 14:08:22

+0

是的,直到'Controller'中的這一行返回Json(jsnRslt);'一切都很好..JSON對象具有所需的數據和所有。 – Maven 2013-03-25 14:08:51

回答

1

你可能需要這個在你的JSON電話:

return Json(jsnRslt, JsonRequestBehavor.AllowGet); 

它看起來像你正在做一個GET調用,並默認GET不允許在一個JSON調用。

+0

完成,但仍然沒有改進。 – Maven 2013-03-27 05:17:36

0

我想你也需要在你的ActionMethod帕姆添加一個數據源請求

public ActionResult GetResult([DatasourceRequest]request, string usrId) 
return Json(jsnRslt.ToDatasourceResult(request), JsonRequestBehavior.AllowGet); 

每kendogrid需要這個

1

嘗試使用內部數據源的傳輸特性,這樣的事情:

<script type="text/javascript"> 



    var dataSource = new kendo.data.DataSource({ 
     batch: true, 
     schema: { 
      model: { 
       id: "EmployeeID", 
       fields: { 
        EmployeeID: { editable: true, validation: { required: true } }, 
        EmployeeName: { validation: { required: true } } 

       } 
      } 
     }, 
     transport: { 
      read: { 
       url: "/Home/GetData", 
       type: "GET" 

      }, 
      update: { 
       url: "/Home/Update", 
       type: "POST", 
       contentType: 'application/json' 


      }, 
      destroy: { 
       url: "/Home/Destroy", 
       type: "POST", 
       contentType: 'application/json' 

      }, 


      create: { 
       url: "/Home/Create", 
       type: "POST", 
       contentType: 'application/json' 

      }, 


      pageSize: 1, 





      parameterMap: function (options, operation) { 
       if (operation !== "read" && options.models) { 
        return kendo.stringify(options.models) ; 
       } 
      } 

     } 




    }); 





    $(document).ready(function() { 


     $("#grid").kendoGrid({ 
      dataSource: dataSource, 
      navigatable: true, 
      pageable: true, 
      height: 430, 
      sortable: true, 
      toolbar: ["create", "save", "cancel"], 
      columns: [ 

       { field: "EmployeeID", title: "Employee ID", width: 110 }, 
       { field: "EmployeeName", title: "Employee Name", width: 110 }, 

       { command: "destroy", title: "Delete", width: 90 }], 
      editable: true, 
      selectable: "multiple row", 
      groupable: true, 
      navigatable: true, 
      filterable: true 
     }); 
    }); 



</script> 

控制器:

public class HomeController : Controller 
{ 
    // 
    // GET: /Home/ 

    public ActionResult Index() 
    { 
     var employee = new Employee().GetEmployeeList(); 

     return View(employee); 
    } 

    [AcceptVerbs(HttpVerbs.Get)] 
    public JsonResult GetData() 
    { 
     var obj = new Employee(); 


     return Json(obj.GetEmployeeList(), JsonRequestBehavior.AllowGet); 
    } 

    [HttpPost] 
    public JsonResult Update(List<Employee> model) 
    { 
     var obj = new Employee(); 

     //return View(); 
     return Json(obj); 
    } 

    [HttpPost] 
    public JsonResult Create(List<Employee> model) 
    { 
     var obj = new Employee(); 

     return Json(obj); 
    } 

    public ActionResult Destroy(Employee model) 
    { 
     return View(); 
    } 

} 

返回從索引方法的HTML視圖以保持電網&

0

試試這個

transport: { read: { url: "Records", dataType: "jsonp"} } 

嘗試jsonp而不是json

0

您要退回ActionResult,應改爲JsonResult