title: Kendo UI Grid not showing JSON data
body: <p>I am facing this problem for quite a while now with the problem that I am unable to bind JSON data that my controller action is passing to the kendo UI Grid, there were few JavaScript issues before but now they are gone but still my grid is not showing any results:</p>
  
  <p>In <code>Model</code>:</p>
  
  <pre><code>public object GetResult(string id)
      {
          var sqlCom = new SqlCommand("SELECT [No],[Desc],[Date],[Height],[Final] FROM [cr_form] WHERE [uId]=@id;", sqlConn);
          sqlCom.Parameters.AddWithValue("@id", id);
  
          StringBuilder sb = new StringBuilder();
          StringWriter sw = new StringWriter(sb);
          JsonWriter jsonWriter = new JsonTextWriter(sw);
          var rcrds = GETSQLRESULTS(sqlCom);
  
          try
          {
              int i = 0;
              if (rcrds != null || rcrds.HasRows)
              {
                  //jsonWriter.WriteStartObject();
                  while (rcrds.Read())
                  {
                      jsonWriter.WriteStartObject(); //Changed
                      for (int j = 0; j &lt; rcrds.FieldCount; j++)
                      {
                          jsonWriter.WritePropertyName(rcrds.GetName(j)); // column name
                          jsonWriter.WriteValue(rcrds.GetValue(j)); // value in column
                      }
                      i++;
                      jsonWriter.WriteEndObject(); //Changed
                  }
                  //jsonWriter.WriteEndObject();
  
              }
  
          }
  
          catch (Exception ex) { }
          return jsonWriter;
      }
  </code></pre>
  
  <p>In <code>Controller</code>:</p>
  
  <pre><code>    public ActionResult GetRecords()
      {
          var usrObj = new User();
          var jsnRslt = usrObj.GetResult(Session["Id"].ToString());
      //Till here jsnRslt contains this string: “{"No":null,"Desc":"asfasfasfasfasfasfasfasfasfasfasfasf","Date":"2013-03-27T00:00:00","Height":0,"Final":null,"No":null,"Desc":"etwetwetwetwet","Date":"2013-03-27T00:00:00","Height":0,"Final":0,"No":null,"Desc":"asfasfasfskfjklajsfkjasklfjklasjfklajsfkljaklsfjklasjfkljasfkljlasf","Date":"2013-03-27T00:00:00","Height":0,"Final":0,"No":null,"Desc":"askjfkajsfklaskjfkajsfklaskjfkajsfklaskjfkajsfklaskjfkajsfklaskjfkajsfklaskjfkajsfklaskjfkajsfklaskjfkajsfklaskjfkajsfklaskjfkajsfklaskjfkajsfkl","Date":"2013-03-27T00:00:00","Height":0,"Final":0,"No":null,"Desc":"safasfasfasfasfasf","Date":"2013-03-27T00:00:00","Height":0,"Final":0,"No":null,"Desc":"asfasf","Date":"2013-03-27T00:00:00","Height":0,"Final":0,"No":null,"Desc":"asfasfasf","Date":"2013-03-27T00:00:00","Height":2,"Final":0}”
  
      //After Changes in the Model I am getting it in the required Array format:
      //{"No":null,"Desc":"asfasfasfasfasfasfasfasfasfasfasfasf","Date":"2013-03-27T00:00:00","Height":0,"Final":null}
      //{"No":null,"Desc":"etwetwetwetwet","Date":"2013-03-27T00:00:00","Height":0,"Final":0}
      //{"No":null,"Des...
  
          return Json(jsnRslt, JsonRequestBehavior.AllowGet);            
      }
  </code></pre>
  
  <p>In <code>View</code>:</p>
  
  
      
  
  <pre><code>&lt;div&gt;
      &lt;script type="text/javascript"&gt;
          $(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: "Date", title: "Date" },
                          { field: "Height", title: "Height" },
                          { field: "Final", title: "Final" }
                      ],
                  dataBound: function () {
                      this.expandRow(this.tbody.find("tr.k-master-row").first());
                  }
              });
          });
      &lt;/script&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>But after all this all I can see is an empty grid. And no errors in JavaScript console.</p>
  
  <p>Please help</p>