Questions on Kendo UI for jQuery Forum

3 answers

140 views

Iam using 2015 Kendo version

Tile layout is not supporting in 2015 version. can you pls help to add Function which supports only Kendo Tile layout. when i add 2021 version entire design is getting impacted .so i will add only the supporting version of Tile Layout

TileLayout

answered on 09 Apr 2021

3 answers

229 views

spreadsheet scrolls page on load

Hi,

I'm using Kendo spreadsheet as part of my page and its placed at the bottom of the page. Whenever we load the spreadsheet the page automatically scrolls to bottom. Please find the sample below. Is there a way to disable scroll ?

https://dojo.telerik.com/UCoVIPey

Spreadsheet

answered on 09 Apr 2021

2 answers

1.1K+ views

Kendo grid dataSource, How do I get the corresponding id instead of the default 1

I want to use dataSource.get () to get the corresponding id where the default id number = 1. Everyone help me, please.

<!DOCTYPE html>
<html>
<head>
<base href="https://demos.telerik.com/kendo-ui/grid/editing-inline">
<style>html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }</style>
<title></title>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2021.1.330/styles/kendo.default-v2.min.css" />

<script src="https://kendo.cdn.telerik.com/2021.1.330/js/jquery.min.js"></script>


<script src="https://kendo.cdn.telerik.com/2021.1.330/js/kendo.all.min.js"></script>



</head>
<body>
<div id="example">
<div id="grid"></div>

<script>
$(document).ready(function () {
var crudServiceBaseUrl = "https://demos.telerik.com/kendo-ui/service",
dataSource = new kendo.data.DataSource({
transport: {
read: {
url: crudServiceBaseUrl + "/Products",
dataType: "jsonp"
},
update: {
url: crudServiceBaseUrl + "/Products/Update",
dataType: "jsonp"
},
destroy: {
url: crudServiceBaseUrl + "/Products/Destroy",
dataType: "jsonp"
},
create: {
url: crudServiceBaseUrl + "/Products/Create",
dataType: "jsonp"
},
parameterMap: function(options, operation) {
if (operation !== "read" && options.models) {
return {models: kendo.stringify(options.models)};
}
}
},
batch: true,
pageSize: 20,
schema: {
model: {
id: "ProductID",
fields: {
ProductID: { editable: false, nullable: true },
ProductName: { validation: { required: true } },
UnitPrice: { type: "number", validation: { required: true, min: 1} },
Discontinued: { type: "boolean" },
UnitsInStock: { type: "number", validation: { min: 0, required: true } }
}
}
}
});

$("#grid").kendoGrid({
dataSource: dataSource,
pageable: true,
height: 550,
toolbar: ["create"],
columns: [
"ProductName",
{ field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: "120px" },
{ field: "UnitsInStock", title:"Units In Stock", width: "120px" },
{ field: "Discontinued", width: "120px", editor: customBoolEditor },
{ command: ["edit", "destroy"], title: " ", width: "250px" }],
editable: "inline",

edit: function (e) {
var id = e.sender.dataItem(e.container).ProductID;
var data = dataSource.get(1); //How do I get the corresponding id instead of the default 1
console.log(data.ProductName);
}


});
});

function customBoolEditor(container, options) {
$('<input class="k-checkbox" type="checkbox" name="Discontinued" data-type="boolean" data-bind="checked:Discontinued">').appendTo(container);
}
</script>
</div>



</body>
</html>

Grid

answered on 09 Apr 2021

1 answer

404 views

BUG: Nested panels cause parent panel to collapse / expdn

See the following example: https://dojo.telerik.com/EboZUXif.

Expanding / collapsing a child panel causes the parent panel to expand / collapse as well.

Kind regards,
Ron

ExpansionPanel

answered on 09 Apr 2021

2 answers

135 views

Can't Find Error In Validation

OK SO this is a little hard to actually explain but- I have a multiselect with a datasource and validation rules, not unlike this demo here. For some reason, it's failing validation even though it has a value. What is going wrong/how can I fix it/what further details do I need to provide?

Thank you, I apologize for the poor explanation.

Validation

answered on 08 Apr 2021

1 answer

425 views

File manager mvc custom command is not a constructor

I make custom command for file upload and open model. click cancel and open again its give me error in console.

FileManager

answered on 08 Apr 2021

1 answer

168 views

Sending xlsx to controller

How to use kendo upload file to send xlsx to api?

service is using closedxml to store data to datatable.

Upload

answered on 07 Apr 2021

1 answer

233 views

Using Editor As Grid Column's Custom Editor Not Saving

This dojo accurately reproduces my problem: https://dojo.telerik.com/EKEGAqoq

If you update the ProductName will just plain text (no rich-text editor options), the grid updates fine, but as soon as you use one of the rich-text features (bold, italics, bullet, numbering, etc.), the grid does not update and the model is marked as "dirty".

Editor

answered on 07 Apr 2021

6 answers

631 views

[Solved] Add fonts to fontFamily toolbar menu

The standard fontFamily toolbar menu lists the following fonts: "Arial", "Courier New", "Georgia", "Times New Roman", "Trebuchet MS", "Verdana"

I'd like to add additional ones to the list but haven't been able to figure out how. There appears to be support for customizing the list by setting a fontFamilies property somewhere, but I haven't been able to figure out where to do this or how to get a reference to the drop down list.

Thanks

Spreadsheet

answered on 07 Apr 2021

14 answers

502 views

MVC Treeview with checkboxes on Custom Edit Popup from Grid

I have Index.shtml with Grid control:

@(Html.Kendo()

.Grid<EditingWithServerValidation.Models.Product>()

.Name("Grid")

.Columns(columns =>

{

columns.Bound(p => p.Id);

columns.Bound(p => p.Name);

columns.Command(command => command.Edit()).Width(100);

})

.Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("Details"))

.DataSource(dataSource => dataSource

.Ajax()

.Batch(false)

.ServerOperation(false)

.Model(model => model.Id(p => p.Id))

.Read("_Read", "Home")

.Update("_Update", "Home")

)

Controller have _Read method

public ActionResult _Read([DataSourceRequest] DataSourceRequest request)

{

List<Product> MyProduct = GetProductsList();

return Json(MyProduct.ToDataSourceResult(request));

}

public ActionResult Index([DataSourceRequest] DataSourceRequest request)

{

ViewBag.AreaOfLaw = GetAreaLaw();

return View();

}

private List<Product> GetProductsList()

{

List<Product> MyProd = new List<Product>();

for (int i = 1; i < 10; i++)

{

Product p = new Product();

p.Id = i;

p.Name = "Product #" + i.ToString();

MyProd.Add(p);

}

return MyProd;

}

private List<TreeViewItemModel> GetAreaLaw()

{

List<TreeViewItemModel> TVList = new List<TreeViewItemModel>();

TreeViewItemModel AL = new TreeViewItemModel();

AL.Id = "1";

AL.Text = "ROOT-1";

AL.HasChildren = true;

AL.Expanded = true;

TreeViewItemModel SubAL = new TreeViewItemModel();

SubAL.Id = "3";

SubAL.Text = "Sub-1-1";

AL.Items.Add(SubAL);

TVList.Add(AL);

AL = new TreeViewItemModel();

AL.Id = "2";

AL.Text = "ROOT-2";

AL.HasChildren = true;

AL.Expanded = true;

SubAL = new TreeViewItemModel();

SubAL.Id = "4";

SubAL.Text = "Sub-2-1";

AL.Items.Add(SubAL);

SubAL = new TreeViewItemModel();

SubAL.Id = "5";

SubAL.Text = "Sub-2-2";

AL.Items.Add(SubAL);

TVList.Add(AL);

return TVList;

}

And Model describe Product:

public class Product

{

public int Id { get; set; }

[Required]

public string Name { get; set; }

}

Details.shtml Custom PopUP template as simple as possible (I remove from this template all other markup except treeview )

<div id="tv" style="overflow:scroll; height:200px;">

@(Html.Kendo().TreeView()

.Name("treeview")

.Checkboxes(true)

.BindTo((IEnumerable<TreeViewItemModel>)ViewBag.AreaOfLaw)

)

</div>

When I run it - I got the grid , Edit click Open Popup with Treeview , but Checkboxes behavior is weird - click on any one checkbox Select All or Clead All checkboxes on the screen

When I move Treeview from Popup template on Index.shtml page it's working as expected. Please advise.

TreeView

answered on 06 Apr 2021