Grid works without TRANSPORT section / Nothing but headers get displayed with the TRANSPORT section

1 Answer 38 Views
Grid
Bill
Top achievements
Rank 1
Bill asked on 07 Sep 2021, 07:38 PM

Support

 I am new to Telerik Grid.  This code I put together from a couple of the sites examples

to show "proof of concept" for a newly assigned project.  The display of the grid works fine

if I remove the "TRANSPORT section of the datasource.  The popup edit will save to the cached data but

will not call the update action as specified.  As you see the data is generated as a list and converted

to JSON on entry to the view.  Any assistance would be greatly appreciated.  Thank you.

 

Bill Lawler 

 

Below is my controller, model, and View snippets 

 

MY CONTROLLER

    public class TankTagItemVM
    {
        public string Tank { get; set; }
        public string Level_Tag { get; set; }
        public string Material_Tag { get; set; }
        public string Temperature_Tag { get; set; }
        public string Water_Level_Tag { get; set; }
        public string Gross_Pumpable_Tag { get; set; }
        public string Gross_Heel_Tag { get; set; }
        public string Gross_Volume_Tag { get; set; }
        public string Gross_Max_Tag { get; set; }
        public string Net_Volume_Tag { get; set; }
        public string Mvmt_Level_Tag { get; set; }
        public string Mvmt_Gross_Pumpable_Tag { get; set; }
        public string Mvmt_Gross_Heel_Tag { get; set; }
        public string Mvmt_Gross_Volume_Tag { get; set; }
        public string Mvmt_Gross_Max_Tag { get; set; }
        public string Mvmt_Net_Volume_Tag { get; set; }
    } 

 

 

 

MY CONTROLLER

        public ActionResult GetTankTags([DataSourceRequest] DataSourceRequest request)
        {

            DateTime startDate = DateTime.Parse("2021-01-17");
            var page = request.Page;
            var pagesize = request.PageSize;

            string conn = ConfigurationManager.ConnectionStrings["PMRCConnectionString"].ConnectionString;
            SqlConnection sqcon = new SqlConnection(conn);
            SqlCommand cmd = new SqlCommand();
            SqlDataAdapter sd = new SqlDataAdapter(cmd);
            DataTable dt = new DataTable();
            cmd.Connection = sqcon;
            cmd.CommandText = "dmi.tml_get_tank_tag_items_sp";
            cmd.CommandType = System.Data.CommandType.StoredProcedure;
            sd.SelectCommand.Parameters.Add("@pDtToday", SqlDbType.DateTime).Value = startDate;
            sqcon.Open();
            sd.Fill(dt);
            sqcon.Close();
            List<TankTagItemVM> TanksTagSummary = new List<TankTagItemVM>();
            foreach (DataRow dr in dt.Rows)
            {
                TankTagItemVM st = new TankTagItemVM();
                st.Tank = dr["Tank"].ToString();
                st.Level_Tag = dr["Level_Tag"].ToString();
                st.Material_Tag = dr["Material_Tag"].ToString();
                st.Temperature_Tag = dr["Temperature_Tag"].ToString();
                st.Water_Level_Tag = dr["Water_Level_Tag"].ToString();
                st.Gross_Pumpable_Tag = dr["Gross_Pumpable_Tag"].ToString();
                st.Gross_Heel_Tag = dr["Gross_Heel_Tag"].ToString();
                st.Gross_Volume_Tag = dr["Gross_Volume_Tag"].ToString();
                st.Gross_Max_Tag = dr["Gross_Max_Tag"].ToString();
                st.Net_Volume_Tag = dr["Net_Volume_Tag"].ToString();
                st.Mvmt_Level_Tag = dr["Mvmt_Level_Tag"].ToString();
                st.Mvmt_Gross_Pumpable_Tag = dr["Mvmt_Gross_Pumpable_Tag"].ToString();
                st.Mvmt_Gross_Heel_Tag = dr["Mvmt_Gross_Heel_Tag"].ToString();
                st.Mvmt_Gross_Volume_Tag = dr["Mvmt_Gross_Volume_Tag"].ToString();
                st.Mvmt_Gross_Max_Tag = dr["Mvmt_Gross_Max_Tag"].ToString();
                st.Mvmt_Net_Volume_Tag = dr["Mvmt_Net_Volume_Tag"].ToString();
                TanksTagSummary.Add(st);
          }
          return View(TanksTagSummary);
        }

 

 

MY CSHTML 

@model List<WebApplication5.Models.TankTagItemVM>
@{
    ViewBag.Title = "GetTankTags";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Tank Tags List</h2>

<div id="grid"></div>
<script>
    $(document).ready(function () {
        var model =@{@Html.Raw(Json.Encode(Model))};
        var crudServiceBaseUrl = "https://localhost:44387/TanksList";

        dataSource = new kendo.data.DataSource({
            data: model,
            pageSize: 20,
            schema: {
                model: {
                    id: "Tank",
                    fields: {
                        Tank: { type: "string" },
                        Level_Tag: { type: "string" },
                        Material_Tag: { type: "string" },
                        Temperature_Tag: { type: "string" },
                        Water_Level_Tag: { type: "string" },
                        Gross_Pumpable_Tag: { type: "string" },
                        Gross_Heel_Tag: { type: "string" },
                        Gross_Volume_Tag: { type: "string" },
                        Gross_Max_Tag: { type: "string" },
                        Net_Volume_Tag: { type: "string" },
                        Mvmt_Level_Tag: { type: "string" },
                        Mvmt_Gross_Pumpable_Tag: { type: "string" },
                        Mvmt_Gross_Heel_Tag: { type: "string" },
                        Mvmt_Gross_Volume_Tag: { type: "string" },
                        Mvmt_Gross_Max_Tag: { type: "string" },
                        Mvmt_Net_Volume_Tag: { type: "string" },
                    }
                }
            },
            transport: {
                read: {
                    url: '@Url.Action("GetTankTags", "TanksList")',
                    dataType: 'json'
                },
                update: {
                    url: '@Url.Action("GetTankTags_Update", "TanksList")',
                    dataType: 'json',
                    type: 'POST'
                },
                parameterMap: function (options, operation) {
                    if (operation !== "read" && options.models) {
                        return { models: kendo.stringify(options.models) };
                    }
                }
            }
        });

        $('#grid').kendoGrid({
            dataSource: dataSource,
            selectable: "single",
            sortable : {
                mode :"single",
                allowUnsort : "false"
            },
            height: 550,
            pageable : {
                refresh : false,
                pageSizes : true,
                buttonCount:10
            },
            columns: [
                { field: "Tank", title: "Tank", width: "70px" },
                { field: "Level_Tag", title: "Level", width: "70px" },
                { field: "Material_Tag", title: "Material", width: "100px" },
                { field: "Temperature_Tag", title: "Liquid Temp", width: "100px" },
                {
                    title: "Midnight Cut-off Tags", attributes: { style: "text-align: center" },
                    columns: [
                        { field: "Water_Level_Tag", title: "Water Level", width: "100px" },
                        { field: "Gross_Pumpable_Tag", title: "Gross Pumpable", width: "100px" },
                        { field: "Gross_Heel_Tag", title: "Gross Heel", width: "100px" },
                        { field: "Gross_Volume_Tag", title: "Gross Volume", width: "100px" },
                        { field: "Gross_Max_Tag", title: "Gross Max", width: "100px" },
                        { field: "Net_Volume_Tag", title: "Net Volume", width: "100px" }
                    ]
                },
                {
                    title: "Pumper Log Tags",
                    columns: [
                        { field: "Mvmt_Level_Tag", title: "Level", width: "70px" },
                        { field: "Mvmt_Gross_Pumpable_Tag", title: "Gross Pumpable", width: "100px" },
                        { field: "Mvmt_Gross_Heel_Tag", title: "Gross Heel", width: "100px" },
                        { field: "Mvmt_Gross_Volume_Tag", title: "Gross Volume", width: "100px" },
                        { field: "Mvmt_Gross_Max_Tag", title: "Gross Max", width: "100px" },
                        { field: "Mvmt_Net_Volume_Tag", title: "Net Volume", width: "100px" }
                    ]
                },
                { command: ["edit", "destroy"], title: "&nbsp;", width: "250px" }
            ],
            editable: "popup"
        });

1 Answer, 1 is accepted

Sort by
0
Neli
Telerik team
answered on 10 Sep 2021, 12:10 PM

Hi Bill,

Could you please try to return JSON from the controller as demonstrated below:

return Json(result);

In case this is .Net MVC and not a .Net Core project you may need to set the JsonRequestBehavior as follows:

return Json(result, JsonRequestBehavior.AllowGet);

If this does not resolve the issue could you please send us more information about the returned response? I would suggest you open the Developer Tools in the browser and check for errors in the console or in the Network tab.

For convenience attached you will find a small .Net MVC sample project using Kendo UI for jQuery configuration. In case the issue continues to persist, could you please try to modify the example in order to replicate the issue the way it is on your side and send it back for a review? This way we could investigate locally and provide further assistance.

Regards,
Neli
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
Grid
Asked by
Bill
Top achievements
Rank 1
Answers by
Neli
Telerik team
Share this question
or