Hi there,

I am using a trial version to make sure it covers our project requirements. Will upgrade to full if this works.

I'm trying to display a dropdown for related data inline inside a grid. I've followed this link as closely as possible https://demos.telerik.com/aspnet-mvc/grid/editing-custom

But the ClientTemplate is not rendering the dropdown.

View:
@(Html.Kendo().Grid<GrindrodDataCapture.Models.RailConsignmentDetail>()
      .Name("grid")
      .Columns(columns =>
      {
          columns.Bound(c => c.LoadedWeight);
          columns.Bound(c => c.GrossWeight);
          columns.Bound(c => c.TareWeight);
          columns.Bound(c => c.Tarps);
          columns.Bound(c => c.Status).ClientTemplate("=Status.Name#");
          columns.Command(command => { command.Edit(); command.Destroy(); }).Width(180);
      })
      .ToolBar(toolBar =>
      {
          toolBar.Create();
          toolBar.Save();
      })
      .Editable(editable => editable.Mode(GridEditMode.InCell))
      .Pageable()
      .Sortable()
      .Scrollable()

      .DataSource(dataSource => dataSource
          .Ajax()
          .Batch(true)
        .ServerOperation(false)
        .Events(events => events.Error("error_handler"))
          .Model(model =>
          {
              model.Id(rd => rd.ID);
              model.Field(rd => rd.ID).Editable(false);
              model.Field(rd => rd.Status).DefaultValue(ViewData["defaultStatus"] as GrindrodDataCapture.Models.ConsignmentDetailStatus);
          })
          .PageSize(20)
          .Read(read => read.Action("RailConsignmentDetails_Read", "RailDetailGrid", new { headerID = Request.Params["ConsignmentHeaderID"] }))
          .Create(create => create.Action("RailConsignmentDetails_Create", "RailDetailGrid"))
          .Update(update => update.Action("RailConsignmentDetails_Update", "RailDetailGrid"))
          .Destroy(destroy => destroy.Action("RailConsignmentDetails_Destroy", "RailDetailGrid"))
      )
)

Controller section:

 public class RailDetailGridController : Controller
    {
        private GrindrodContext db = new GrindrodContext();

        public ActionResult Manage(int ConsignmentHeaderID)
        {
            PopulateWagons();
            return View();
        }

 private void PopulateWagons()
        {
            ViewData["statuses"] = db.ConsignmentDetailStatuses;
            ViewData["defaultStatus"] = db.ConsignmentDetailStatuses.First();
        }

public ActionResult RailConsignmentDetails_Read([DataSourceRequest]DataSourceRequest request, int headerID)
        {

            IQueryable<RailConsignmentDetail> railconsignmentdetails = (from rd in db.RailConsignmentDetails
                                                                        where rd.RailConsignment.ID == headerID
                                                                        select rd).Include("Status");

            DataSourceResult result = railconsignmentdetails.ToDataSourceResult(request, railConsignmentDetail => new {
                ID = railConsignmentDetail.ID,
                LoadedWeight = railConsignmentDetail.LoadedWeight,
                GrossWeight = railConsignmentDetail.GrossWeight,
                TareWeight = railConsignmentDetail.TareWeight,
                Tarps = railConsignmentDetail.Tarps,
                Status = new ConsignmentDetailStatus ()
                {
                    ID = railConsignmentDetail.Status.ID,
                    Code = railConsignmentDetail.Status.Code,
                    Name = railConsignmentDetail.Status.Name,
                    NameLocal = railConsignmentDetail.Status.NameLocal,
                    Description = railConsignmentDetail.Status.Description,
                    IsOcean = railConsignmentDetail.Status.IsOcean,
                    IsRail = railConsignmentDetail.Status.IsRail,
                    IsRoad = railConsignmentDetail.Status.IsRoad

                }
            });

            return Json(result, JsonRequestBehavior.AllowGet);
        }

I have visual studio 2015 Enterprise Update 3.
When i installed Telerik R1 2017 on it i faced the error below :

Please see the attached for it's screenshot.
By Disabling extensions from Tools -> Extensions and Updates...error vanished.
What is going on & why Telerik has no solution for this?
==============================================
"In VisualStudio 2015 -> Tools -> Extensions and updates ->
Online: Search for the string: "Fix NuGet GetFullVsVersionString must be
called on the UI thread" and install the given fix."

I did it and found nothing.
Where is that extension to fix this issue?
Why did they remove it from marketplace?

I have a working server-bound grid. I'm trying to add a server-bound template column based on the following snippet from here.

The ".Template" method generates the error:

Error CS1061 'GridBoundColumnBuilder<MyModel>' does not contain a definition for 'Template' and no accessible extension method 'Template' accepting a first argument of type 'GridBoundColumnBuilder<MyModel>' could be found (are you missing a using directive or an assembly reference?)

These lines are in my _ViewImports.cshtml:

@addTagHelper *, Kendo.Mvc
@using Kendo.Mvc.UI

Using Telerik.UI.for.AspNet.Core 2020.3.915

https://demos.telerik.com/aspnet-mvc/grid/serverrowtemplate

I have not yet found a solution after looking at many links. Am I really missing a using?

(And for the record, the New Thread editor for these forums is shameful. The standard Windows undo/redo/selection do not work in Chrome and poor/lack of formatting options significantly limit what I'm trying to convey.)

Hi Team,

We are using Kendo ListBox in our application. This can have, say a list of countries. Once user types a letter, the first record with that letter should be selected (similar behaviour like in dropdowns). Please advise how this can be achieved.

Thanks,

Faraaz

I  am using a KendoUI treeview. The treeview contain 13 anchor tags . This anchor tags are basically questions. On clicking each Anchor tag, I am making a Ajax call and on Ajax success , I am returning a Partial View as html in the div tag.  The Partial view contains textarea and  KendoUI grid. 
The html is loaded correctly in the div tag with text area and grid .However the console is showing error "Uncaught ReferenceError: onDataBound is not defined"

How do I fix the error ? Should I use Deferred Initialization ?
https://docs.telerik.com/aspnet-mvc/getting-started/helper-basics/fundamentals?&_ga=2.185465772.48909972.1612825511-1665294203.1606507004#deferring-initialization

Also, when I try to test .Read,.Create,.Destroy, .Update, the code does not hit the controller. 

Should I move the javascript code for the KendoUI grid in the PartialView to the global javascript file ?How do I make the Kendo UI grid work in Partial View after Ajax success ? A project with example will be helpful?

Index.cshtml : (Displaying html)

  <div id="divQuestions">

   </div>

Ajax Call:

if (id != null) {
        $.ajax({
            type: "POST",
            url: Globals.BaseUrl + "Questions/SaveTocAndShowQuestions/?questionNo=" + tocquestionNo + "&displayNumber=" + tocdisplayNo + "&sectionId=" + SectionId + "&subSectionId=" + SubSectionId,
            dataType: "html",
            async: true,
            cache: false,
            data: serializedForm,
            contentType: "application/x-www-form-urlencoded; charset=UTF-8",
            success: function (result, textStatus, jqXHR) {
                // window.location.href = result;
               // console.log(result);

                if ($("#divQuestions").length) {
                    $('#divQuestions').html(result);
                                      
                        }
                                          
                    },
            error: function (xhr, ajaxOptions, thrownError) {
                alert('Error during process: \n' + ajaxOptions + "," + thrownError + "," + xhr.responseText);
            }

        });

Partial View Containing KendoUI Grid

<div id="pnReporterCommentsGrid">


    @(Html.Kendo().Grid<FYQuestionCommentsInfo>()
         .Name("ReporterCommentGrid")
       
          .Columns(columns =>
          {
              columns.Command(command => { command.Edit(); command.Destroy(); }).Width(160);
              columns.Bound(m => m.RECORD_TYPE)
                      .Title("Record Type");
              columns.Bound(m => m.RECORDED_DATE).Format("{0:G}")
           .Title("Returned Date");
              columns.Bound(m => m.USERID)
             .Title("Returned By");
              columns.Bound(m => m.COMMENTS)
              .Title("Comments");

          })
        .ToolBar(toolbar => toolbar.Create().Text("Add New Item"))
        .Resizable(resize => resize.Columns(true))
          .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("FYQuestionsCommentsInfo").Window(w => w.Title("Edit").Name("customedit").Width(1000)))
      //    .Events(e => e.Edit("HideGridFields"))
          .Events(e => e.DataBound("onDataBound"))
         .Pageable()
        .Sortable()
        .Scrollable()
         .DataSource(dataSource => dataSource
        .Ajax()

        //  .ServerOperation(false)
        .Events(events => events
        .Sync("RefreshReporterCommentGrid"))
        .Events(events => events.Error("error_handler"))

        .Model(model =>
        {
            model.Id(m => m.QuestionCommentsInfoId);
            model.Field(m => m.QuestionCommentsInfoId).Editable(false);
            model.Field(m => m.USERID).DefaultValue(Model.upacsUserViewModel.Username);
            model.Field(m => m.RECORDED_DATE).Editable(false);

        })
        .Read(read => read.Action("Bind_Reporter", "Questions").Data("sendAntiForgery"))
        .Create(update => update.Action("CreateReporterComments", "Questions").Data("sendAntiForgery"))
         .Destroy(d => d.Action("DestroyReporterComments", "Questions").Data("sendAntiForgery"))
         .Update(update => update.Action("UpdateReporterComments", "Questions").Data("sendAntiForgery"))

     )
    )
</div>

<script type="text/javascript">
        function HideGridFields(e) {

            HideControl("QuestionCommentsInfoId", e);
            HideControl("REGION", e);
            HideControl("STATE_CODE", e);
            HideControl("FiscalYear", e);
            HideControl("REPORT_ID", e);
            HideControl("SECTION_ID", e);
            HideControl("SUBSECTION_ID", e);
            HideControl("QUESTION_NUMBER", e);
            HideControl("QUESTION_PART_NUMBER", e);
            HideControl("DISPLAY_NUMBER", e);
            HideControl("RECORD_TYPE", e);
            HideControl("RECORDED_DATE", e);
            HideControl("QuestionDetailId", e);

        }
        function HideControl(fieldName, e) {
            var cont = $(e.container);
            HideFieldLabel(cont.find("label[for='" + fieldName + "']"));
            HideFieldField(cont.find("#" + fieldName));
        }

        function HideFieldLabel(control) {
            control.parent(".editor-label").hide();
        }

        function HideFieldField(control) {
            control.parent(".editor-field").hide();
        }


        function RefreshReporterCommentGrid() {
            var grid = $('#ReporterCommentGrid').data('kendoGrid');
            grid.dataSource.read();
        }

        function onDataBound(e) {
            var grid = $('#ReporterCommentGrid').data('kendoGrid');
            var gridData = grid.dataSource.view();

            for (var i = 0; i < gridData.length; i++) {
                var currentUid = gridData[i].uid;
                if (gridData[i].RECORDED_DATE != null) {
                    var currenRow = grid.table.find("tr[data-uid='" + currentUid + "']");
                    var editButton = $(currenRow).find(".k-grid-edit");
                    var deleteButton = $(currenRow).find(".k-grid-delete");
                    if (('@Model.upacsUserViewModel.HSIPUserType' == 'SuperReporter') || ('@Model.upacsUserViewModel.HSIPUserType' == 'Reporter'))
                    {
                        if ('@Model.FiscalYear' == '@Constants.Year')
                        {

                            if (gridData[i].RECORD_TYPE == 'Reporter Comments')
                            {
                                editButton.show();
                                deleteButton.show();
                            }
                            else if ((gridData[i].RECORD_TYPE == 'Reviewer Approve Comments') || (gridData[i].RECORD_TYPE == 'Reviewer Return Comments'))
                            {
                                editButton.hide();
                                deleteButton.hide();
                            }
                        }
                        else
                        {
                            editButton.hide();
                            deleteButton.hide();
                        }
                    }
                    else
                    {
                        editButton.hide();
                        deleteButton.hide();
                    }
                }
            }

        }

        function sendAntiForgery() {
            return { "__RequestVerificationToken": $('input[name=__RequestVerificationToken]').val() }
        }


        function error_handler(e, status) {
            $('#ReporterCommentGrid').data('kendoGrid').cancelChanges();
            if (e.errors) {
                var message = "\n";
                $.each(e.errors, function (key, value) {
                    if ('errors' in value) {
                        $.each(value.errors, function () {
                            message += this + "\n";
                        });
                    }
                });
                alert(message);
            }
        }

</script>

I  am using a KendoUI treeview. The treeview contain 13 anchor tags . This anchor tags are basically questions. On clicking each Anchor tag, I am making a Ajax call and on Ajax success , I am returning a Partial View as html in the div tag.  The Partial view contains KendoUI grid. 
When the partial view is rendered, it only displays an empty grid without data in it.

How do I get it to work in Partial View 

However the console is showing error "Uncaught ReferenceError: onDataEdit is not defined"

Index.cshtml : (Displaying html)
  <div id="divQuestions">

   </div>

Ajax Call:
if (id != null) {
        $.ajax({
            type: "POST",
            url: Globals.BaseUrl + "Questions/SaveTocAndShowQuestions/?questionNo=" + tocquestionNo + "&displayNumber=" + tocdisplayNo + "&sectionId=" + SectionId + "&subSectionId=" + SubSectionId,
            dataType: "html",
            async: true,
            cache: false,
            data: serializedForm,
            contentType: "application/x-www-form-urlencoded; charset=UTF-8",
            success: function (result, textStatus, jqXHR) {
                // window.location.href = result;
               // console.log(result);

                if ($("#divQuestions").length) {
                    $('#divQuestions').html(result);
                                      
                        }
                                          
                    },
            error: function (xhr, ajaxOptions, thrownError) {
                alert('Error during process: \n' + ajaxOptions + "," + thrownError + "," + xhr.responseText);
            }

        });

Partial View

<div id="pvRHCPGridQuestion7">

    <p><b>Input the number of crossings and program emphasis areas by crossing type.</b></p>

    @Html.AntiForgeryToken()

    @(Html.Kendo().Grid<HSIP.Domain.Grid7DomainModel>()
                  .Name("PerformanceGrid")
                  .Columns(columns =>
                  {
                      columns.Bound(m => m.display_num).Hidden();
                      columns.Bound(m => m.FIXED_ROWS).Hidden();
                      columns.Bound(m => m.MAX_ROW_NUM).Hidden();
                      columns.Command(command => { command.Destroy(); }).Width("20%");
                      //columns.Command(command =>
                      //{
                      //    command.Custom("Delete").Click("onDataRemove").SendDataKeys(true);
                      //}).Width("20%");
                      columns.Bound(m => m.val_description).Title("Crossing Type").HtmlAttributes(new { style = "text-align: left;" }).HeaderHtmlAttributes(new { style = "text-align: center;" });
                      columns.Bound(m => m.col1).EditorTemplateName("IntegerBox").HtmlAttributes(new { style = "text-align: right;" })
                      .Title("Number of Crossings").HeaderHtmlAttributes(new { style = "text-align: center;" });

                  })
    .ToolBar(toolbar => {
        toolbar.Create().Text("Add New Item");
        toolbar.Save().CancelText("Undo");
    })
    .Editable(editable => editable.Mode(GridEditMode.InCell))
    .Resizable(resize => resize.Columns(true))
    .Events(events => events.Edit("onDataEdit").Save("onDataSave").SaveChanges("onSaveChanges"))
    .DataSource(dataSource => dataSource
    .Ajax()
    .Batch(true)
    .ServerOperation(false)
    .Events(events => events.Error("error_handler"))
    .Events(events => events.Sync("RefreshGrid"))
    .Model(model =>
    {
        model.Id(m => m.display_num);
        model.Field(m => m.display_num).Editable(false);
        model.Field(m => m.val_description).Editable(true);
        model.Field(m => m.col1).Editable(true);
        model.Field(m => m.FIXED_ROWS).Editable(false);
        model.Field(m => m.MAX_ROW_NUM).Editable(false);

    })
    .Sort(sort => sort.Add("display_num").Ascending())
    .Create(update => update.Action("Create_Q7_Batch", "Questions").Data("sendAntiForgery"))
    .Read(read => read.Action("Bind_Q7", "Questions").Data("sendAntiForgery"))
    .Update(update => update.Action("Update_Q7_Batch", "Questions").Data("sendAntiForgery"))
    .Destroy(d => d.Action("Destroy_Q7_Batch", "Questions").Data("sendAntiForgery"))
    )

    )

</div>

<script type="text/javascript">

function sendAntiForgery() {
        return { "__RequestVerificationToken": $('input[name=__RequestVerificationToken]').val() }
    }
   
    function onDataRemove(e) {
        e.preventDefault();
        var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
        if (confirm('Are you sure you want to clear the values?')) {
            $.ajax({
                type: 'POST',
                url: '@Url.Action("CustomDelete_Q7", "Questions")',
                data: { display_num: dataItem.display_num },
                dataType: "text",
                traditional: true,
                async: false,
                success: function (s) {
                    if (s.ErrorDetails) {
                        alert(s.ErrorDetails);
                    } else {
                        $('#PerformanceGrid').data("kendoGrid").dataSource.read();
                    }
                },
                error: function (s) {
                    if (s.ErrorDetails) {
                        alert(s.ErrorDetails);
                    }
                }
            });
        }
    };

function onSaveChanges(e) {
        var errors = [];
        var dataSource = $('#PerformanceGrid').data("kendoGrid").dataSource;
        var rows = dataSource.data();
        for (var i = 0; i < rows.length; i++) {
            if (rows[i].dirty) {
                if ((rows[i].FIXED_ROWS == null || (rows[i].id != null && rows[i].id > rows[i].FIXED_ROWS)) && rows[i].val_description != null && rows[i].val_description.length > 100) {
                    alert("Maximum length for Performance Measure is 100!");
                    e.preventDefault();
                    return;
                }
            }
        }

        var validRows = 0;
        for (var i = 0; i < dataSource.data().length; i++) {
            if (rows[i].dirty) {
                if (isNaN(parseInt(rows[i].col1)) == false) {
                    validRows++;
                }
            }
            else {
                validRows++;
            }
        }
        if (validRows < dataSource.data().length) {
            e.preventDefault();
            alert('Please complete "NUMBER OF CROSSING" for all rows.');
        }
    }

    function onDataSave(e) {
    if (e.values.val_description) {
        if ((e.model.isNew() || e.model.id > e.model.FIXED_ROWS) && e.values.val_description.length > 100) {
            alert("Maximum length for Performance Measure is 100!");
        }
    }
    }

    function onDataEdit(e) {
        $(".field-validation-valid").empty();
         if (e.model.isNew()) {

        }
        else {
            if (e.model.id <= e.model.FIXED_ROWS) {
                e.container.find("input[name='val_description']").each(function () { $(this).attr("disabled", "disabled") });
            }
        }

         //$('#col1').kendoNumericTextBox({decimals:0, format: '#', min:0});
    }

    function RefreshGrid() {
        var grid = $('#PerformanceGrid').data('kendoGrid');
        grid.dataSource.read();
    }

    function error_handler(e, status) {
        $('#PerformanceGrid').data('kendoGrid').cancelChanges();
        if (e.errors) {
            var message = "\n";
            $.each(e.errors, function (key, value) {
                if ('errors' in value) {
                    $.each(value.errors, function () {
                        message += this + "\n";
                    });
                }
            });
            alert(message);
        }
    }

</script>

My model like this

My View like this