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.
Best regards,
Mugurel Nechita
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.
There is a possibility to add Minimum/Maximum length validation in Kendo editor , but is is not user friendly. I am referring to method describe on the following website:
ASP.NET MVC Editor Component Add maxlength Validations - Telerik UI for ASP.NET MVC
What I am looking for would be easier way just by adding some attribute so the code should be like the following:
@(Html.Kendo().Editor() .Name("editor") .HtmlAttributes(new { style = "width: 100%; height:840px", aria_label = "editor" })
.MinLenght(10)
.MaxLength(5000) )
In this case, when you add the one which I added as Red it should automatically enforce it and do validation based on number of characters.
There are cases where we observe JavaScript errors, and the experience is like opening the Developer Tool in the browser and check the log in the Console. When the problem resides on the user, it is not easy to guide them to perform this action. To overcome this problem, there is a need for JavaScript error collector function. When we call this function, it should collect all JavaScript error log files and send them as a list. Then the developer would be able to use it to troubleshoot issues and also could implement interface like collect and store JavaScript error log files. It is recommended the error collector support the following data:
Location: the page leads to error.
Date and Time: with ability to customize it like set a time zone or default to match server.
Error message: Complete error message in the client
User: In case user login to the page
Browser-Agent Data: information about user's browser, operating system ...
Hi Team,
I would like to suggest that Progress/DevTools creates a SSO authentication service. I'll elaborate further with more details.
Thank you!
Currently, the autoFitColumn() method shouldn't be used to resize all columns in a large grid, as noted here: https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/methods/autofitcolumn
Could this performance be improved by deferring the width calculation? So a 10 column grid could be completely autoFit with 1 calculation instead of 10.
Could an .AutoFit(true) method be added to the GridColumnBuilder's Fluent Api?
This would allow me to build columns such as:
.Columns(column => column.Bound(model => model.Value).AutoFit())
This should defer the autofit calculations so that they can be run once for all auto-fitted columns, rather than re-calculating for every column.
In other words, this should NOT simply call autoFitColumn() as it is currently implemented.
The Grid should allow switching between case sensitive and case insensitive filtering.
Hi Team,
When I use the Upgrade Wizard, it missed updating the Kendo CDN links in my "_HeadPartial.cshtml" file.
This feature request is to ask for a feature in the Upgrade Wizard that allows us to scan additional locations.
Thanks!
Alberto
In case it helps, here's a screenshot:
Currently, the groupPaging is not supported and is missing in WebApiDataSourceRequestModelBinder, thus enabling groupPaging leads to undesired behavior with the following Grid configuration:
$("#grid").kendoGrid({
dataSource: {
type: "webapi",
pageSize: 50,
page: 1,
groupPaging: true,
total: 0,
serverPaging: true,
serverSorting: true,
serverFiltering: true,
serverGrouping: true,
serverAggregates: true,
group: {
field: "SomeText",
dir: "desc"
},
transport: {
read: "Url..."
},
schema: {
data: "Data",
total: "Total",
errors: "Errors",
model: {
id: "SomeId",
fields: {
SomeId: { type: "number" },
SomeText: {type: "string" },
SomeDate: { type: "date" } } } } },
sortable: true,
filterable: true,
pageable: true,
columns: [ { field: "SomeId"}, { field: "SomeText"}, { field: "SomeDate"} ]
});
Hi Team,
I would like to request a way to set all UI for ASP.NET MVC components to deferred without using the deferred() method for each individual component.
Thank you!
Hi Team,
We need a solution for the below issue
On Telerik grid when we do filter options (server side) on multiple columns the grid adding the
SQL keywords in filter logic like “and, or, where “like…
Our WAF (web application firewall) is stopping these keyworks as part of the application security.
We have created a ticket on this issue (Support ID:1584292) , support team has provided some custom solutions but
Those are not working.
Can we have any feature in the grid which can do encryption of SQL keywords while passing it
To the server.
Thank you.