User fill out some search criteria to populate an in-cell batch editable grid.  After making all of their changes they click a save button.  This triggers the grid update which in turn calls a controller that updates the data.  On request call the read action passing in the search criteria(to refresh the grid).

The update SQL updates the current task to complete, and if it meets certain criteria, inserts new child records.

What I am seeing in the database is that the same records are being updated many times.  That isn't great but what is worse is that new child records are being created.

What do I have wired incorrectly?  Is update being called multiple times?  Are records not getting their modified flag cleared?

Here is my view and controller.  They are stripped down but should have adequate info.

public class ViewPage1Controller : Controller
    {

        private readonly RmsContext2 _context;
        RmsContext2 context = new RmsContext2(null);
        FieldManagementContext contextFM = new FieldManagementContext(null);

        public ViewPage1Controller(RmsContext2 context)//IMediator mediator)
        {
            _context = context;
        }

        public ActionResult Search([DataSourceRequest] DataSourceRequest request, SearchCriteria criteria)
        {
            var param13 = new SqlParameter { ParameterName = "DateType", Value = criteria.DateType };
            var result = context.Database.SqlQuery<SearchResult>("PR_Review_Results @ToPortalId, @ProjectIds, @StoreId, @StatusId, @TypeId, @FromPortalId, @DistrictId, @DateFrom, @DateTo, @IncludeOutstanding, @ReportTag, @IncludeUnsubmit, @DateType",
                    param, param2, param3, param4, param5, param6, param7, param8, param9, param10, param11, param12, param13);
            return Json(result.ToList().ToDataSourceResult(request), "application/json", System.Text.Encoding.UTF8, JsonRequestBehavior.AllowGet);
        }

        public ActionResult Update([DataSourceRequest] DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable<SearchResult> results, SearchCriteria criteria)
        {
            if (ModelState.IsValid)
            {
                //for each updated record
                //update image status, description and date
                //update task status and date
                //create any new tasks as children for rejected
                using (var db = new RmsContext2(null))
                {
                    foreach (var result in results)
                    {
                        db.Database.ExecuteSqlCommand("PR_Review_Update @PortalAccountId, @ActivityId, @ImageId, @ImageStatus, @Description, @Comment, @FollowUpDate, @FeedbackId, @TemplateId, @FollowUpActivityTypeId, @RefImageId, @IncludeMaster",
                            param, param2, param4, param5, param6, param7, param8, param3, param9, param10, param11, param12);

                    }
                }

            }
            return Json(results.ToDataSourceResult(request, ModelState));
        }
    }

 

@model IEnumerable<PortalApp.Areas.TaskManagement.Features.AdvPhotoReview.Index.SearchResult>
@(Html.Kendo().Grid(Model)
    .Name("Grid")
    .Deferred(true)
    .Events(events => events.DataBound("databound"))
    .Columns(columns =>
    {
        columns.Bound(p => p.SmallImage64)
            .ClientTemplate("<a href='../TaskManagement/AdvPhotoReview/Compare?imageId=#=ImageId#' target='blank'><img src='data:image/png;base64,#=SmallImage64#' onmouseover='showCompare(event)'  onmouseout='hideCompare(event)' /></a><br /><img src='../Images/SmallIcons/Flip.png' onclick='flipImage(event)' /><img src='../Images/SmallIcons/RotateLeft.png' onclick='rotateleftImage(event)' /><img src='../Images/SmallIcons/RotateRight.png' onclick='rotaterightImage(event)' />")
            .Title("Photo").Width(100).Filterable(false).Editable("imageEditable").Sortable(false).HtmlAttributes(new { style = "text-align: center;" });
        columns.Template(@<text></text>)
            .ClientTemplate(
                            "# var temp = AllComments; if (temp.length > 0) { #" +
                                "<img src='../Images/48X48/comments.png' onclick='showComments(event)' />" +
                            "# } else { #" +
                                "<img src='' />" +
                            "# } #"
            ).Title("Messages")
            .HeaderTemplate("").Width(70).HtmlAttributes(new { style = "text-align: center;" });
        columns.Template(@<text></text>)
            .ClientTemplate(@"<input name='name#=ActivityId#' type='radio' value='5' #= ImageStatusId==5 ? checked='checked':'' # /> Received
                    </br><input name='name#=ActivityId#' type='radio' value='2' #= ImageStatusId==2 ? checked='checked':'' # /> Reviewed - Release to Vendor
                    </br><input name='name#=ActivityId#' type='radio' value='1' #= ImageStatusId==1 ? checked='checked':'' # /> Reviewed - Do not release to Vendor
                    </br><input name='name#=ActivityId#' type='radio' value='3' #= ImageStatusId==3 ? checked='checked':'' # /> Rejected")
            .HeaderTemplate("Photo Status").Width(240).HeaderHtmlAttributes(new { style = "background-color:white;" }); ;
        columns.Bound(p => p.ActivityId).Title("ActivityId").Hidden();
        columns.Bound(p => p.ImageId).Title("ImageId").Hidden();
        columns.Bound(p => p.ActivityType).Title("ActivityType").Hidden();
        columns.Bound(p => p.ReportTag).Title("Report Tag").Width(100).Filterable(false);
        columns.Bound(p => p.Question).Title("Store Report Question").Width(200).Filterable(false);
        columns.Bound(p => p.Description).Title("Photo Description").Width(200).Filterable(false).HeaderHtmlAttributes(new { style = "background-color:white;" });
        columns.Bound(p => p.ReportComments).Title("Report Comments").Width(200).Filterable(false);
        columns.Bound(p => p.Answer).Title("Answer").Hidden();
        columns.Bound(p => p.SubmissionDate).Title("Submission Date").Format("{0:MM/dd/yyyy hh:mm tt}").Width(140).Filterable(false);
        columns.Bound(p => p.Confirmation).ClientTemplate("<a href='../Servicing/ViewServiceReport.aspx?Id=#=Confirmation#' target='_blank'>#=Confirmation#</a>").Title("Confirmation")
            .HeaderTemplate("Confirmation").Width(90).Filterable(false);
        columns.Bound(p => p.ProjectId).ClientTemplate("<a href='../Servicing/ViewProject.aspx?Id=#=ProjectId#' target='_blank'>#=ProjectNumber#</a>").Title("View Project")
            .HeaderTemplate("Project").Width(70).Filterable(false);
        columns.Bound(p => p.RmsDistrictId).Title("RmsDistrictId").Hidden();
        columns.Bound(p => p.StoreId).ClientTemplate("<a href='../Servicing/ViewStore.aspx?Id=#=StoreId#' target='_blank'>#=StoreDisplay#</a>").Title("View Store")
            .HeaderTemplate("Store").Width(70).Filterable(false);
        columns.Bound(p => p.ToPortalId).Title("ReviewerId").Hidden();
        columns.Bound(p => p.FromPortalId).ClientTemplate("<a href='../Servicing/ViewEmployee.aspx?Id=#=FromRecordId#' target='_blank'>#=FromDisplayName#</a>").Title("View Rep")
            .HeaderTemplate("Rep").Width(70).Filterable(false);
        columns.Bound(p => p.ColorBox).Title("ColorBox").Hidden();
        columns.Template(@<text></text>).ClientTemplate(GetActions().ToString()).HtmlAttributes(new { @class = "menuCell", @style = "width:95px;" }).Width(90);

        })
    .ToolBar(toolbar =>
    {
    toolbar.Template(@<text>
                <a href="javascript:void(0)" class="k-button k-primary k-button-icontext k-grid-save-changes" title="Save"><span class="k-icon k-i-check"></span>Save</a>
                <a href="javascript:void(0)" class="k-button k-button-icontext k-grid-cancel-changes" title="Cancel"><span class="k-icon k-i-cancel"></span>Cancel</a>
                <span style="float:right">
                    Default Photo Status:
                    @(Html.Kendo().ComboBox()
                    .Name("defaultStatus")
                    .BindTo(new List<string>() {
                        "",
                        "Reviewed - Release to Vendor"
                    })
                    .Events(events => events.Close("onDefaultSelect"))
                    .SelectedIndex(0)
                    .Suggest(true)
                    .AutoWidth(true)
                    .Deferred(true)
                .HtmlAttributes(new { @class = "k-content", style = "width:250px;" })
                    )
                </span></text>);
    })
    .HtmlAttributes(new { style = "height: 730px;" })
    .NoRecords()
    .Pageable(pageable => pageable
        .Input(true)
        .Numeric(false)
        .PageSizes(new List<object> { 5, 10, 20, 30, 40, 50 })
        )
    .Sortable()
    .Filterable()
    .Scrollable()
    .DataSource(dataSource => dataSource
        .Ajax()
        .Events(events => events.Error("error_handler"))
        .Events(events =>
        {
            events.RequestEnd("onRequestEnd");
        })
        .Batch(true)
        .Model(model =>
        {
            model.Id(i => i.ActivityId); // Specify the property which is the unique identifier of the model.
            model.Field(i => i.ImageId).Editable(false);
            model.Field(i => i.Thumbnail).Editable(false);
            model.Field(i => i.Question).Editable(false);
            model.Field(i => i.Answer).Editable(false);
            model.Field(i => i.ActivityType).Editable(false);
            model.Field(i => i.SubmissionDate).Editable(false);
            model.Field(i => i.ProjectId).Editable(false);
            model.Field(i => i.ReportComments).Editable(false);
            model.Field(i => i.Confirmation).Editable(false);
            model.Field(i => i.RmsDistrictId).Editable(false);
            model.Field(i => i.StoreId).Editable(false);
            model.Field(i => i.FromPortalId).Editable(false);
            model.Field(i => i.ToPortalId).Editable(false);
            model.Field(i => i.ProjMgrPortalId).Editable(false);
            model.Field(i => i.FromRecordId).Editable(false);
            model.Field(i => i.SmallImage64);//.Editable(false);
            model.Field(i => i.ToDisplayName).Editable(false);
            model.Field(i => i.FromDisplayName).Editable(false);
            model.Field(i => i.ProjMgrDisplayName).Editable(false);
            model.Field(i => i.ReportTag).Editable(false);
        })
        .PageSize(20)
        .Sort(s =>
        {
            s.Add("ProjectId").Ascending();
            s.Add("SubmissionDate").Ascending();

        })
        .ServerOperation(false)
        .Update(update => update.Action("Update", "AdvPhotoReview").Data("additionalData"))
        .Read(read => read.Action("Search", "AdvPhotoReview"))
    )
    .Editable(editable => editable.Mode(GridEditMode.InCell))
)
@helper  GetActions()
{
    @(Html.Kendo()
        .Menu()
        .Name("HoverMenu_#=ActivityId#")
        //.Deferred(true)
        .Direction(MenuDirection.Right)
        .Orientation(MenuOrientation.Vertical)
        .Animation(false)
        .Items(
            items => items.Add().Text("Contact").HtmlAttributes(new { @class = "k-menu-actions" }).Items(
                innerItems =>
                {
                    innerItems.Add().Text("Rep").HtmlAttributes(new { onclick = "showContact(event)" });
                    innerItems.Add().Text("Account Manager").HtmlAttributes(new { onclick = "showUnsubmit(event)" });
                }
            )
        ).ToClientTemplate())
}

<script>
    function onRequestEnd(e) {
        if (e.type == "update") {
            var grid = $('#Grid').data('kendoGrid');
            var strProjects = getProjects();
            grid.dataSource.read({
                Store: $('#stores').data('kendoComboBox').value(),
                Type: $('#type').data('kendoComboBox').value(),
                Rep: $('#rep').data('kendoComboBox').value(),
                District: $('#district').data('kendoComboBox').value(),
                DateFrom: $('#datefrom').data('kendoDatePicker').value(),
                DateTo: $('#dateto').data('kendoDatePicker').value(),
                Project: strProjects,
                IncludeOutstanding: $('#includeoutstanding').is(':checked'),
                ReportTag: $('#reporttag').data('kendoComboBox').value(),
                IncludeUnsubmit: $('#includeunsubmit').is(':checked'),
                DateType: $('#datetype').data('kendoDropDownList').text()
            });
            var grid = $("#Grid").data("kendoGrid");
            if (grid.dataSource.page() > 1) {
                grid.dataSource.page(1);
            }
        }
    }
    function additionalData() {
        var strProjects = getProjects();
        return {
            Store: $('#stores').data('kendoComboBox').value(),
            Type: $('#type').data('kendoComboBox').value(),
            Rep: $('#rep').data('kendoComboBox').value(),
            District: $('#district').data('kendoComboBox').value(),
            DateFrom: $('#datefrom').data('kendoDatePicker').value(),
            DateTo: $('#dateto').data('kendoDatePicker').value(),
            Project: strProjects,
            IncludeOutstanding: $('#includeoutstanding').is(':checked'),
            ReportTag: $('#reporttag').data('kendoComboBox').value(),
            IncludeUnsubmit: $('#includeunsubmit').is(':checked'),
            DateType: $('#datetype').data('kendoDropDownList').text()
        };
    }
    function error_handler(e) {
        if (e.errors) {
            var message = "Errors:\n";
            $.each(e.errors, function (key, value) {
                if ('errors' in value) {
                    $.each(value.errors, function () {
                        message += this + "\n";
                    });
                }
            });
            alert(message);
        }
    }
function onRejectClick(id) {
                var comment = document.getElementById("reject.usertext").value;
                var includeMaster = 0;
                var followupdate = document.getElementById("reject.duedate").value;
                var feedbackId = document.getElementById("reject.feedbackId").value;
                var templateId = document.getElementById("reject_template").value;
                var upload = $("#files").data("kendoUpload"), files = upload.getFiles();
                if (files === undefined || files.length == 0) {
                    var file = "";
                }
                else {
                    var file = files[0].name;
                }
                if (document.getElementById("reject.masterimage").checked) {
                    includeMaster = 1;
                }

                if (comment == "") {
                    document.getElementById('reject.message').innerHTML = "Comment is required";
                    document.getElementById('reject.messagediv').style.display = 'block';
                }
                else {
                    document.getElementById('reject.messagediv').style.display = 'none';
                    var grid = $("#Grid").data("kendoGrid");
                    var dataItem = grid.dataSource.get(id);
                    dataItem.set("Comment", comment);
                    dataItem.set("FollowUpDate", followupdate);
                    dataItem.set("FeedbackId", feedbackId);
                    dataItem.set("TemplateId", templateId);
                    dataItem.set("RefCompareFile", file);
                    dataItem.set("IncludeMaster", includeMaster);
                    var dialog = $("#Main").data("kendoWindow");
                    dialog.close();
                }
}
    </script>

Hi,

Is it possible to programmatically set a column's filter whose "multi" flag is set to true on grid load?

The code I have here:

... doesn't seem to filter properly or show the checkbox for the selected filter.  It filters out everything and no checkboxes in the filter menu are selected.

Thanks!

Hello, in example https://dojo.telerik.com/ahepILiP, if field is nullable: true, then default value not used.

In version 2019.2.619 of kendo ui mvc wrappers for all srting values initialize "nullabe: true"

changes: Kendo.Mvc/UI/DataSource/ModelDescriptor.cs

+                    IsNullable = p.ModelType.Name == "String" ? true : p.IsNullableValueType

And all my default values for string fields is null, if remove this changes then work fine.

Hello,

I'm working on a project where I'm trying to use the Listbox. My end goal is to have the items in the 'selected' listbox passed to a POST controller.

Controller.cs

 

Create.cshtml

 

I am using Visual Studio 2015 and the project is ASP.NET MVC. Any insight is appreciated!

I have a grid nested within a tab control, with quite a few initially hidden columns.

This looks fine, until some of the hidden columns are shown, when most of the grid expands along with a horizontal scrollbar being shown. However, the toolbar which has the Export To Excel button in it, remains the original width, giving a messy unprofessional look to the screen.

How can I get the toolbar to expand along with the rest of the grid?

I've attached two screenshots, and the Grid code is:-

 

Thanks

I have read all (most of) the entries in this forum regarding this matter and cannot seem to find my error. I want to upload a single file that I then pass onto another system. As multiple users could upload at the same time I use a GUID as a message ID and create a folder per user. Here I get the document (from a backend system where I would then like to upload the file to) and create the GUID:

       public IActionResult Open()

        {
            ViewBag.MessageId = Guid.NewGuid().ToString();
            return View("DocumentOpen", new List<string> { "in open event" });
        }

Here is part of my View - I have many fields but I have created a view with only the upload widget:

@using Kendo.Mvc.UI

<form method="post" enctype="multipart/form-data">
    <div class="k-content">
        @(Html.Kendo().Upload()
              .Name("attachments")
              .Multiple(false)
              .Async(async => async
                  .Save("UploadFileAsync", "Document", new { messageId = ViewBag.MessageId })
                  .Remove("RemoveFileAsync", "Document")
                  .AutoUpload(true)
              )
        )
    </div>
</form>

Here the processing of the upload - as you can see the name and the parameter coincide (attachments) and the messageId has the GUID

        [HttpPost]
        public ActionResult UploadFileAsync(IEnumerable<HttpPostedFileBase> attachments, string messageId)
        {
            if (attachments == null) return Content("");

            HttpPostedFileBase fileBase = attachments.FirstOrDefault();
            var fileName = Path.GetFileName(fileBase?.FileName);
            if (fileName != null)
            {
                var serverDirectory = System.Web.HttpContext.Current.Server.MapPath("~/" + messageId);
                var serverPath = Path.Combine(serverDirectory, fileName);
                fileBase.SaveAs(serverPath);
            }


            return Content("");
        }

When running the code I get a GUID in the messageId field, the attachments field has a count of 0 i.e. It is *not* null. I have tried multiple examples here but am always getting the same error. 

 

Any ideas?

 

PS: I cannot upload the project as it needs a backend document management system :(

MVC 5; .Net Core; Visual Studio 2017; Telerik 2019.2.514

I have a grid that uses SetOptions to load the users saved state.  I am using incell editing.  After using setOptions my events for Editable no longer get hit.  Is there something I have to set manually after this like with the command buttons?

--Below I reassign the btnEdit event to the command button

var options = JSON.parse(response.myOptions);
options.columns[0].command[0].click = btnEdit;
grid.setOptions(options);

 

--My cell from grid

columns.Bound(p => p.ClearedBy).Title(text: "Cleared by").Editable("ClearedByEditable").Lockable(true);

 

--My Editable Event

function ClearedByEditable(e) {

Alert("I am here");

return false;

}

     Hello,

In my current project we are facing some issues regarding XSS using the Editor in MVC. We already use the AntiXss library to "clean" the html posted to the server but we are facing the following difficulty.

In the editor "Insert Hyperlink" functionality, we have been warned that a possible script can be run by inserting malicious content to the Tooltip field.

For example look at "Hyperlink xss example.png".

I have already reviewed the documentation Telerik provides regarding this XSS but didn't find anything related to this particular issue.

Is there a way to remove the Tooltip field from the Insert Hyperlink form? (Using MVC, not Jquery). Or any other possible solution for this problem.

 

Thanks

 

 

Hi,

For a project I'm required to use Bootstrap 4, which in turn requires jQuery 3.+ (currently using 3.4.1).

While Kendo UI officially only supports jQuery 1.12.4, I've been using jQuery 3.+ without any problems, until now.

 

I'm exporting HTML into PDF using the Kendo UI Drawing functionality (snippet below). This snippet generates the PDF document with content without problems when using jQuery 1.12.4 or 2.2, but fails to add content when using jQuery 3.+. I've tried versions 3.0.0, 3.3.1 and 3.4.1 without success. Browsers I've tested: Firefox 67/68, Internet Explorer 11 and Chrome 75.

Unfortunately I'm unable to downgrade jQuery version due to Bootstrap 4 requirement, and would like to ask how I can solve this issue using jQuery 3.4.1 (using Kendo UI for MVC version 2019.2.619).

 

Thanks, Matthijs

 

 

 

Hi ..
I have Master details datageid, in the row details i have tabstrip as partial view i'm loading each tabitem data with 
.LoadContentFrom("Action", "controller", new { Action parameters  });
i have listbox with the tabs names and in  the Change event i select the tabitem

everything work fine and the data loaded well, the problem is if i update the data and trying  to load the data in the details
can not  see the changes , looks like the data is in the cash
here is the details  code  : 

   @(Html.Kendo().DropDownList()
                  .Name("cmbCaseDetails_" + Model.CaseID)
                  .DataTextField("Text")
                  .DataValueField("Value")
                  .BindTo(new List<SelectListItem>() {
                          new SelectListItem() {
                            Text = "Fields", Value = "0" 
                          },
                          new SelectListItem() {
                            Text = "Descriptions", Value = "1"
                          },
                         new SelectListItem() {
                            Text = Relations", Value = "2"
                          }
                 })
                 .SelectedIndex(0)
                 .Events(e => e.Change("onDetailsListChanged"))
        )
       


 @(Html.Kendo().TabStrip()

                    .Name("tabDetails_" + Model.CaseID)
                  .HtmlAttributes(new { style = "background-color:#FFFFFF;border-style:none;" })
                  .Animation(animation => { animation.Enable(false); })
                  .Items(tabCaseDetails =>
                  {
                        tabCaseDetails.Add().Text("Fields")
                          .LoadContentFrom("CaseFields", "CaseDetails", new { CaseID = Model.CaseID });

                      tabCaseDetails.Add().Text("Descriptions")
                        .LoadContentFrom("CaseDescriptions", "CaseDetails", new { CaseID = Model.CaseID });

                      tabCaseDetails.Add().Text("Relations")
                        .LoadContentFrom("CaseRelations", "CaseDetails", new { CaseID = Model.CaseID });


                  })


<script type="text/javascript">
function onDetailsListChanged() {
      
        var val1 = "cmbDetails_" + "@Model.CaseID";
        var value = $("#" + val1).val();
        var id = "tabDetails_" + "@Model.CaseID";
        $("#" + id).kendoTabStrip().data("kendoTabStrip").select(value);  //set the selected tab page
     $("#" + id).kendoTabStrip().reload(value); // try to reload the data  not work

    }
</script>