Not reproducible with the UI for ASP.NET Core Grid helper.
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(15)
.Read(read => read.Action("Orders_Read", "Grid"))
.Total(50)
)
The "next page" and "last page" buttons in the Grid's pager are rendered as anchor Html elements, when Total is set in the DataSource. When it is not set, the buttons are rendered as button Html elements.
The rendering of the pager buttons should be consistent and they should render as button Html elements.
This is the same as an existing feature request, which was marked as completed but it doesn't achieve what was originally requested.
Orgchart like the one in Telerik ASP.NET Ajax
The UI for ASP.NET MVC OrgChart component is missing functionality found in the UI for ASP.NET AJAX product.
The demos only show a small organisation dataset. With a large dataset (including up to 5 levels), I found the current MVC solution becomes unusable. For example, the vertical/horizontal scroll bar becomes tiny and navigation becomes difficult.
The extra functionality available in the AJAX works around issues, such as, zooming in/out and solves other basic requirements, such as Export to PDF.
Please make the AJAX Functionality and Application Scenarios available in the MVC product.
Dojo: https://dojo.telerik.com/oQeDIxUv
After the component is enabled, the k-disabled class remains in the tag.
The k-disabled class is removed.
Implement templates and adornments features in the TextBox. Example: https://www.telerik.com/kendo-angular-ui/components/inputs/textbox/adornments/#toc-built-in-adornments
Test the following SplitButton configuration:
@(Html.Kendo().SplitButton()
.Name("splitbutton")
.Text("test2")
.HtmlAttributes(new { @class = "myclass", style = "border:1px solid black;", data_customAttr = "test" })
.Icon("download")
.Items(i =>
{
i.Add().Text("button1");
})
)
The custom class, attribute and styles are not applied to the SplitButton's Html element.
The HtmlAttributes are applied to the SplitButton's element.
The attributes handler overload does not get executed when the column is initially marked as hidden.
hidden
property of the ContactTitle field to true
.The attributes handler is not executed when the column is hidden.
The attributes handler should be executed when the column is hidden.
### Bug report
The built-in search tool does not render when it is defined through the Toolbar() configuration. By default, it renders as expected.
### Reproduction of the problem
@(Html.Kendo().TaskBoard()
.Name("taskBoard")
.Toolbar(t => t.Items(items =>
{
items.Add().Type("TaskBoardSearch").Command("SearchCommand").Name("search").Text("Search").Icon("search");
}))
...
)
REPL sample for reproduction:
https://netcorerepl.telerik.com/QRaTOpbm101bVWAv11
### Expected/desired behavior
The search tool should be rendered when it is set up through the Toolbar() configuration.
A possible workaround:
@(Html.Kendo().TaskBoard()
.Name("taskBoard")
.Toolbar(t => t.Items(items =>
{
items.Add().Name("search");
}))
...
)
### Environment
* **Telerik UI for ASP.NET Core version: 2023.1.117
* **Browser: [all]
### Bug report
The Grid columns do not expose the ClientTemplateHandler() method. It is available in Telerik UI for ASP.NET Core since version 2023.1.314.
### Reproduction of the problem
columns.Bound(p => p.IsAlwaysIncluded).ClientTemplateHandler("myColTemplate");
<script>
function myColTemplate(data) {
return `<div>${data.IsAlwaysIncluded}</div>`
}
</script>
The ClientTemplateHandler() method must be exposed for the Grid columns.
### Environment
Telerik UI for ASP.NET MVC version: 2023.1.425
* **Browser: [all]
When the Grid is set initially with a sort operation, the icon for the column will show twice in a UI for ASP.NET MVC web application.
Using the Kendo UI Grid template, add the sorting configuration to the dataSource:
@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.OrderViewModel>()
.Name("grid")
.Columns(columns => {
columns.Bound(p => p.OrderID).Filterable(false).Width(200);
columns.Bound(p => p.Freight).Width(100);
columns.Bound(p => p.OrderDate).Format("{0:MM/dd/yyyy}").Width(140);
columns.Bound(p => p.ShipName);
columns.Bound(p => p.ShipCity).Width(150);
})
.Pageable()
.Sortable()
.Scrollable()
.Filterable()
.HtmlAttributes(new { style = "height:430px;" })
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Read(read => read.Action("Orders_Read", "Grid"))
.Sort(s => s.Add("OrderID").Descending())) //Added Predefined Sort
)
The icon should only appear once for the sorted column.
Inspect the Grid in the MVC demos.
The Grid renders the k-widget class.
The rendering must be consistent with jQuery and Core and the k-widget class should not be rendered. The issue is specifically in the MVC Grid. The Kendo UI for jQuery and the Core Grid no longer render this class.
Dojo example: https://dojo.telerik.com/uGitesaF
When the DropDownList has an initial value, the floating label overlaps with the text.
The label should be displayed above the DropDownList.
Workaround: refresh the floating label in the dataBound event handler of the component:
e.sender.label.floatingLabel.refresh()
Hello,
We are using 2 list boxes (ASP.NET MVC Kendo ListBox)
Left and Right, and right list box can have duplicate values:
When we
are arranging the items using move up and move down buttons. We are
unable to get the selected items in the order that they appear in the
list box.
<tr>
<td>
@(Html.Kendo().ListBox()
.Name("lstallUsers")
.ConnectWith("assigned")
.DataTextField("NameWithDivision")
.DataValueField("UserId")
.HtmlAttributes(new { style = "height:350px;width:350px" })
.Template(Html.ProfilePic("#: data.FileName #", null, "#: data.NameWithDivision #").ToHtmlString())
//.ValueTemplate(Html.ProfilePic("#: data.FileName #", null, " #: data.Name # ").ToHtmlString())
.DataSource(source =>
{
source.Read(read =>
{
read.Action("GetAllApproverUsers", "Workflow", new { area = "Scms", id = Model.FormMasterId });
});
})
)
</td>
<td valign="top">
<button type="button" class="btn btn-primary black-background white" id="transfer-left" onclick="onRightClick()"><span class="fa-lg"> > </span> </button> <br /><br />
<button type="button" class="btn btn-primary btn-md" id="transfer-right" onclick="onLeftClick()"><span class="fa-lg"> < </span></button>
</td>
<td width="20%">
@(Html.Kendo().ListBox()
.Name("assigned")
.DataTextField("NameWithDivision")
.DataValueField("UserId")
.HtmlAttributes(new { style = "height:350px;width:350px" })
.Template(Html.ProfilePic("#: data.FileName #", null, "#: data.NameWithDivision #").ToHtmlString())
.Toolbar(toolbar =>
{
toolbar.Position(Kendo.Mvc.UI.Fluent.ListBoxToolbarPosition.Right);
toolbar.Tools(tools => tools
.MoveUp()
.MoveDown()
);
})
//.Events(events => events
// .Reorder("onMove")
// )
.DataSource(source =>
{
source.Read(read =>
{
read.Action("GetAssignedUsers", "Workflow", new { @area = "Scms", id = Model.FormMasterId });
});
})
)
</td>
<script>
function onRightClick() {
var listbox1 = $("#lstallUsers").data("kendoListBox");
var listbox2 = $("#assigned").data("kendoListBox");
if (listbox1.select().length > 0) {
listbox2.add(listbox1.dataItem(listbox1.select()));
//listbox1.remove(listbox1.select());
console.log(listbox2.select());
}
else {
// showMessage("Left ListBox should have selected item!");
}
}
function onLeftClick() {
var listbox1 = $("#lstallUsers").data("kendoListBox");
var listbox2 = $("#assigned").data("kendoListBox");
if (listbox2.select().length > 0) {
listbox1.add(listbox2.dataItem(listbox2.select()));
listbox2.remove(listbox2.select());
console.log(listbox2.select());
}
else {
// showMessage("Right ListBox should have selected item!");
}
}
</script>
Here is a possible workaround suggested by Telerik Team:
1. Attach a Reorder event handler to the second ListBox:
.Events(ev => ev.Reorder("onReorder"))
2. In the event handler you can add the following logic:
function onReorder(e) {
e.preventDefault();
var dataSource = e.sender.dataSource;
var dataItem = e.dataItems[0]
var itemElement = e.sender.wrapper.find("[data-uid='" + dataItem.uid + "']");
var index = dataSource.indexOf(dataItem) + e.offset;
e.sender.remove(itemElement);
setTimeout(function () {
dataSource.insert(index, dataItem);
}, 100)
}
The logic removes the item and inserts a dataItem at the respective new index in the dataSource.
However, this workaround is not perfect and will have a side effect: the selection of the item is lost. This means that the user has to re-select the item if they want to re-order it again.
Rather then working around it, it would be better to have this functionality built-in in the ListBox.
Thank you.
Good Day,
We would like to submit a feature request to add a handler method for the `HasChildren` property of a HierarchicalDatasource for the MVC Wrappers. It currently only supports a string field name even though the Javascript api can handle a function. We are currently working around this by using the wrapper to define our widget, and then in a kendo.syncready we are creating a datasource and then using setOptions of the widget to achieve the same effect, which should be in the wrapper already.
Example code snippet:
<script>
kendo.syncReady(function() {
let panelBar = jQuery("#@panelBarId").getKendoPanelBar();
if (!panelBar) {
return;
}
var ds = new kendo.data.HierarchicalDataSource({
transport: {
read: {
url: '@Url.Action("LoadPanelBarResults", "Home")',
data: function (){
return resultsPanelbarData('@Html.Raw(searchTagString)', '@Html.Raw(parentTagString)');
}
}
},
schema: {
model: {
id: 'IdString',
hasChildren: hasChildrenFunction
}
}
});
panelBar.setOptions({dataSource: ds});
});
</script>
We hope this request is clear, let us know if there are any questions of the use of this scenario.
Thankyou for your time,
Regards,
Nathan
It would be nice to have a default option to display all Scheduler events in a heatmap and grid:
1. Events:
2. Grid format (repeatable events should be added multiple times):
3. Heatmap format:
This problem raised in the community and it is challenging for developers to fix. Let say, I define the model for datetime as follow:
[DisplayFormat(DataFormatString = "{0:dd/MM/yyyy}", ApplyFormatInEditMode = true)]
public DateTime CustomDate{ get; set; }
When we call it in the View and add a code for the Html.Kendo().DatePicker() , then it should follow the format of the model. Currently, DateTime will ignore our defined method model and we have to go and change globalization and some additional code for it to work. The expected result is Kendo DatePicker must adapt whatever we define in ASP.net MVC model without need to make any additional change.
In default ASP.net MVC, you have option to generate View from the EF, here is one example:
Tutorial: Generate views for EF Database First with ASP.NET MVC app | Microsoft Learn
I am looking for a similar option like we could right click and open wizard for Telerik ASP.net MVC and then select the EF and follow steps to generate a View such as form or grid. It also should generate required controller and should be smart like based on the data type creates the required field (e.g. date picker when data type is date) and the user could customize it after that.
Similar functionality already exists in the ASP.net MVC and it would be nice to have such a wizard for the Telerik too. I saw a similar one for Telerik for AJAX but it is not advance and I am looking for something simple and quick in Telerik.
.ToolBar(toolbar => toolbar.Create())
.Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("RadioButtonTemplate"))
Add a RadioButton in the RadioButtonTemplate.cshtml template:
@model GridExample.Models.OrderViewModel
@(Html.Kendo().RadioButton().Name("engine1").Checked(true).HtmlAttributes(new { @name = "engine" }).Label("1.4 Petrol, 92kW"))
@(Html.Kendo().RadioButton().Name("engine2").HtmlAttributes(new { @name = "engine" }).Label("1.8 Petrol, 118kW"))
A js exception is thrown and the popup does not open:
Chrome:
Uncaught TypeError: Cannot read properties of undefined (reading 'toString') kendo.all.js:313050
Firefox:
Uncaught TypeError: this.bindings.checked.get() is undefined kendo.all.min.js:10:102181
The issue is reproducible with a RadioButton or a RadioButtonFor helper.
No exception is thrown and the custom popup displays the RadioButton.