How to bind data from sql server to Kendo Grid in MVC - json

Question

I create kendo grid in my view but there`s no value display in my kendo grid and this is my code in chtml
<div style="width:100%;height:100%">
#(Html.Kendo().Grid<TBSWebApp.Models.DisplayRecords>()
.Name("BindGridUsingRead")
.DataSource(DataSource => DataSource.Ajax()
.Model(Model => Model.Id(m => m.InvoiceNo))
.Read(read => read.Action("BindGrid2", "Invoice")))
.Columns(columns =>
{
columns.Bound(p => p.InvoiceNo).Width(15).Title("Invoice
No.").Filterable(false);
columns.Bound(p => p.InvoiceDate).Title("Invoice
Date").Width(15).Filterable(false);
columns.Bound(p => p.FileAs).Title("Client
Name").Width(50).Filterable(false);
columns.Bound(p =>
p.Amount).Title("Amount").Width(15).Filterable(false);
})
.Pageable()
.Sortable()
)
</div>
and i have controlled which i call for my database in sql and this is the code is to bind my kendo grid to display my database and convert into json.
public ActionResult BindGrid2([DataSourceRequest]DataSourceRequest request)
{
try
{
string FileAs = "";
List<Models.DisplayRecords> lst = new List<Models.DisplayRecords>();
lst = GetGridData(FileAs).ToList();
DataSourceResult result = lst.ToDataSourceResult(request, p => new Models.DisplayRecords
{
InvoiceNo = p.InvoiceNo,
InvoiceDate = p.InvoiceDate,
FileAs = p.FileAs,
Amount = p.Amount,
});
//return Json(result, JsonRequestBehavior.AllowGet);
return Json(result);
}
catch (Exception ex)
{
var errorMsg = ex.Message.ToString();
return Json(errorMsg, JsonRequestBehavior.AllowGet);
}
}
and this one is to call sql server connection and select from the table that i want to bind it
public IEnumerable<Models.DisplayRecords> GetGridData(string ClientName)
{
List<Models.DisplayRecords> objCmp = new List<Models.DisplayRecords>();
List<Models.DisplayRecords> listCompany = new List<Models.DisplayRecords>();
string strServer = GlobalVariable.prServer;
string strDatabase = GlobalVariable.prDatabase;
string mainconn = string.Format(ConfigurationManager.ConnectionStrings["BackendEntities"].ConnectionString, strServer, strDatabase);
SqlConnection sqlconn = new SqlConnection(mainconn);
string s1 = "SELECT InvoiceNo,InvoiceDate,FileAs,LoanBalance FROM tblInvoice LEFT OUTER JOIN tblContacts ON tblInvoice.CustomerID = tblContacts.ContactID WHERE LEFT(InvoiceNo,2) ='LR'";
SqlCommand sqlcomm = new SqlCommand(s1);
sqlcomm.Connection = sqlconn;
sqlconn.Open();
SqlDataReader sdr = sqlcomm.ExecuteReader();
List<DisplayRecords> objmodel = new List<DisplayRecords>();
if (sdr.HasRows)
{
while (sdr.Read())
{
objCmp.Add(new Models.DisplayRecords() { InvoiceNo = sdr["InvoiceNo"].ToString(), InvoiceDate = sdr["InvoiceDate"].ToString(), FileAs = sdr["FileAs"].ToString(), Amount = sdr["LoanBalance"].ToString() });
}
sqlconn.Close();
}
if (ClientName != "")
{
listCompany = objCmp.ToList().Where(a => a.FileAs == ClientName).ToList();
return listCompany.AsEnumerable();
}
return objCmp.ToList().AsEnumerable();
}
but the result is still no data display in my kendo grid. I dont know why but when i try to break point on my controller action the "public ActionResult BindGrid2" is not passing by and this is the result of running web view:
Click to view Image