Good morning,
I have an issue with TreeList component (in MVC) when I add the Selectable checkbox column (as first column) : in this configuration the drag & drop doesn't work correctly.
When I try to drag a row in another position the "after" behavior would never be applied. Only the "before" and "over" behaviors seems to work correctly. All the "after" are intended always as "before".
If I simply remove the Selectable checkbox column from the configuration, all start to works fine.
Could you kindly check or give me some tips on how to solve it?
Thanks and regards,
Hey,
So i have a grid and within the databound model i return an [Active] variable, based on if this variable is true or false i would like to hide a column within the grid based on this [Active] value.
I have read that if columns need to be hidden / shown dynamically that i should use .Hidden() instead of .Visible() because the .Hidden() will still render the column but just set its display to [None] whereas the .Visible() does not render the column at all.
Based on a value selected from a dropdown a new request is made to the server and the grid is rebound with data,the grid should hide / show the appropriate columns
Html.Kendo().Grid<JobsViewModel>().Name("Grid").Columns(columns =>{ columns.Bound(o => o.Status).Title("Status"); columns.Bound(o => o.Reason).Title("Reason").Hidden(o=>o.Active); <-- How to hide based on [Active]
i need the [Reason] column hidden based on the [Active] variable
.Hidden(o=>o.Active) is not valid, this would be the perfect scenario for me.
I've recently discovered the Form widget, and I like how it simplifies coding/layout of the labels and fields. However, in a form you often want to step through the form, only showing subsequent fields on the basis of answers to previous fields, or just to simplify what is presented in one go.
I have found that hide/show of a Group can be achieved on response to say a switch; eg
function onIsManagerChange(e) {
var form = $("#requestForm").getKendoForm();
var groups = form.wrapper.find(".k-form-fieldset");
$(groups[1]).toggle(!e.checked);
}But what if I just want to show the first group, and then require the user to press a Next button. Is it possible to add a button, say to the end of:
@(Html.Kendo().Form<AccessRequest.Models.Main>()
.Name("requestForm")
.HtmlAttributes(new { action = "Create", method = "POST" })
.Items(items =>
{
items.AddGroup()
.Label("You and your manager's details")
.Items(i =>
{
i.Add()
.Field(f => f.StaffName)
.Label(l => l.Text("My name"));
i.Add()
.Field(f => f.ManagerName)
.Label(l => l.Text("Manager name"));
------ ADD BUTTON HERE
});
items.AddGroup() ...I have implemented the File Manager like in the Demo and I have added the Download in the ContextMenu.
https://demos.telerik.com/aspnet-mvc/filemanager
https://docs.telerik.com/aspnet-mvc/knowledge-base/filemanager-create-download-command
so fare so good.
Now when I double click on a folder I get into the folder, but when I double click on a file nothing happens.
How can I implement that the file is open (downloaded) on double click?
In the Demo (https://demos.telerik.com/aspnet-mvc/filemanager) ist looks like the same behavior.
Hi, I have a kendo grid and need to get a querystring value. See below code.
Browser Url = http://blahblah/blah/36?EvaluationCriteriaGrid-mode=edit&chiefEvalCriteriaId=110
UI.cshtml
@(Html.Kendo().Grid(Model.ChiefEvaluationCriteriaList.AsEnumerable())
.Name("EvaluationCriteriaGrid")
.Columns(columns =>
{
columns.Bound(p => p.EvaluationCriteriaName);
columns.Bound(p => p.MinScore).Width(100).Title("Min Score").Format("{0:0}");
columns.Bound(p => p.MaxScoreDisplay).Width(100).Title("Max Score");
columns.Command(command => { command.Edit(); }).Width(180).Title("Action");
})
.CellAction(cell =>
{
if (cell.Column.Title == "Action")
{
if (cell.DataItem.EvaluationResultID ==
ServiceProxy.Model.DomainConstants.EVALUATION_RESULT_APPROVED)
{
cell.HtmlAttributes["style"] = "display:none;";
}
}
})
.Editable(editing => editing.Mode(GridEditMode.InLine))
.Pageable()
.Sortable()
.Scrollable()
.DataSource(dataSource => dataSource
.Server()
.Model(model => model.Id(c => c.ChiefEvaluationCriteriaID))
.Read("EvaluationQuestionnaire", "EvaluationCriteria", new { area = "Proposal", Id = Model.SolicitationDetails.SolicitationID })
.Update("EditEvaluationCriteria", "EvaluationCriteria", new { area = "Proposal", Id = Model.SolicitationDetails.SolicitationID })
)
)
Controller.cs
[HttpPost]
public ActionResult EditEvaluationCriteria( int Id, int chiefEvalCriteriaId, int maxScoreDisplay, int minScoreDisplay = 0 )
{
return view
}
Thank you for the support

When I paste rows from an excel sheet and try to sync the datasource the submit event doesn't include the pasted rows. This works fine in version 2020.2.513, but doesn't in version 2021.1.224. Any ideas?
@(Html.Kendo().Spreadsheet()
.Name("CommentsSpreadsheet")
.HtmlAttributes(new { style = "width:100%;" })
.Toolbar(false)
.Sheetsbar(false)
.Sheets(sheets =>
{
sheets
.Add()
.Name("Comments")
.DataSource<DocumentCommentSpreadsheetEntry>(ds =>
ds.Custom()
.Batch(true)
.Transport(t => t.Read("onRead").Submit("onSubmit"))
)
.Columns(columns =>
{
columns.Add().Width(100);
columns.Add().Width(100);
columns.Add().Width(100);
columns.Add().Width(200);
columns.Add().Width(200);
columns.Add().Width(200);
columns.Add().Width(200);
columns.Add().Width(300);
columns.Add().Width(300);
})
.Rows(rows =>
{
rows.Add().Height(30).Cells(cells =>
{
cells.Add()
.Bold(true)
.Background("#015991")
.TextAlign(SpreadsheetTextAlign.Center)
.Color("white");
cells.Add()
.Bold(true)
.Background("#015991")
.TextAlign(SpreadsheetTextAlign.Center)
.Color("white");
cells.Add()
.Bold(true)
.Background("#015991")
.TextAlign(SpreadsheetTextAlign.Center)
.Color("white");
cells.Add()
.Bold(true)
.Background("#015991")
.TextAlign(SpreadsheetTextAlign.Center)
.Color("white");
cells.Add()
.Bold(true)
.Background("#015991")
.TextAlign(SpreadsheetTextAlign.Center)
.Color("white");
cells.Add()
.Bold(true)
.Background("#015991")
.TextAlign(SpreadsheetTextAlign.Center)
.Color("white");
cells.Add()
.Bold(true)
.Background("#015991")
.TextAlign(SpreadsheetTextAlign.Center)
.Color("white");
cells.Add()
.Bold(true)
.Background("#015991")
.TextAlign(SpreadsheetTextAlign.Center)
.Color("white");
cells.Add()
.Bold(true)
.Background("#015991")
.TextAlign(SpreadsheetTextAlign.Center)
.Color("white");
});
});
})
)
<script>
function onRead(options) {
var data = [
{
Section: '',
Page: '',
Line: '',
Item: '',
Category: '',
Email: '',
Subject: '',
Comment: '',
ProposedSolution: ''
}
]
options.success(data);
}
function onSubmit(e) {
//No rows included in created or updated
console.log(e.data);
}
</script>
Here is what I tried:
using (FileStream stream = new FileStream(FullFileNameDOC, FileMode.Open))
wordDocument = new DocxFormatProvider().Import(stream);
Header header = wordDocument.Sections.First().Headers.Default;
RadFlowDocumentEditor editor = new RadFlowDocumentEditor(header.Document);
using (Stream stream = new FileStream($@"{TemplatesDirectory}FormHeader.PNG", FileMode.Open))
editor.InsertImageInline(stream, "png");
using (FileStream stream = new FileStream(FullFileNameDOC, FileMode.Open))
wordDocument = new DocxFormatProvider().Import(stream);
Header header = wordDocument.Sections.First().Headers.Default;
RadFlowDocumentEditor editor = new RadFlowDocumentEditor(header.Document);
using (Stream stream = new FileStream($@"{TemplatesDirectory}FormHeader.PNG", FileMode.Open))
editor.InsertImageInline(stream, "png");
... this inserts the image but not in the Word document Header; it inserts the image in the Word document Body.
Thanks.

Good day,
I'm using Server hierarchy Grid which containes a sub grid in DetailTemplate.
But there's no expend icon in the grid which data was loaded successfully. In page HTML codes, there's <td class="k-hierarchy-cell"> but style.display = 'none'
Please help to check.
Code and screenshot as below:
@{ Html.Kendo().Grid(Model)
.Name("grid")
.Columns(columns =>
{
columns.Bound(e => e.BookingNumber).Width(200);
columns.Bound(e => e.QuotationId).Width(120).Title("QT#");
columns.Bound(e => e.ProformaETD).Width(120);
columns.Bound(e => e.BLShipper).Width(400);
columns.Bound(e => e.BLConsignee).Width(400);
columns.Bound(e => e.BLNotify1).Width(400);
columns.Bound(e => e.BLNotify2).Width(400);
columns.Bound(e => e.BLContractHolder).Width(400);
})
.DetailTemplate(item =>
{
Html.Kendo().Grid(item.Containers)
.Name("Ctn_" + item.BookingId)
.Columns(columns =>
{
columns.Bound(o => o.ContainerNumber).Width(150);
columns.Bound(o => o.ContainerType).Width(100);
columns.Bound(o => o.IsSOC);
})
.Pageable()
.Width(500)
.Render();
})
.Pageable()
.Scrollable()
.DataSource(dataSource => dataSource.Server().PageSize(20))
.Sortable()
.Height(650)
.Render();
}
Try to use the Drag and Drop to reorder the rows.
I'm stuck in an error that I'm not figuring out.
The error: Uncaught TypeError: Cannot read property 'insert' of undefined
The line: grid.datasource.insert(newIndex, dataItem );
I'm sure the datasource has data, since the "console.log(dataItem)" returns the object model
var Material = new kendo.data.Model.define({
id: "NR_position",
fields: {
NR_position: { type: "number" },
CD_Material: { type: "number" },
NM_Material: { type: "string" }
}
});
var Controller = {
dataSource: {
ListMat: new kendo.data.DataSource({
transport: { read: { url: matList, type: "POST" } },
model: Material,
dataType: "json",
url: "data/person.json"
})
},
init: function () {
var grid = $("#grdMatOrder").kendoGrid({
dataSource: Controller.dataSource.ListMat,
columns: [
{ field: "NR_position", title: "Order" },
{ field: "CD_Material", title: "Code" },
{ field: "NM_Material", title: "Name" }
]
}).data("kendoGrid");
grid.table.kendoSortable({
filter: ">tbody >tr",
hint: function (element) {
var table = $('<tr colspan=4" class="placeholder></ tr>'), hint;
table.append(element.clone());
table.css("opacity", 0.7)
return table;
},
change: function (e) {
var skip = grid.dataSource.skip(),
oldIndex = e.oldIndex + skip,
newIndex = e.newIndex + skip,
data = grid.dataSource.data(),
dataItem = grid.dataSource.getByUid(e.item.data("uid"));
console.log(dataItem)
grid.dataSource.remove(dataItem);
grid.datasource.insert(newIndex, dataItem );
}
});
}
};
$(document).ready(function () {
Controller.init();
});
I have a kendo grid and in the create action, I want to post back the content of another grid's data source to a razor pages server.
@(Html.Kendo().Grid<EntityModel>() .Name("mainGrid") .DataSource(ds => ds.Ajax() .Read(r => r.Url("/Index?handler=ReadEntity")) .Create(c => c.Url("/Index?handler=CreateEntity").Data("getData")) .Model(m => m.Id(id => id.EntityID)) ) ) function getData() { var otherModels = $("#otherGrid").data("kendoGrid").dataSource.data(); var temp = $.extend(true, {}, kendo.antiForgeryTokens(), { otherModels: otherModels }); return temp; }The result looks like this
temp
The action:
public JsonResult OnPostCreateEntity(List<OtherViewModel> otherModels, [DataSourceRequest] DataSourceRequest request, EntityViewModel entityModel) //otherModels is empty
This works fine for collections of simple objects like integers, but in this case, an exception is thrown:
"Cannot read property 'field' of undefined"
