kendo grid In asp.net core project
how to Hide column DateResult
i have
columns.ForeignKey(p => p.result, (System.Collections.IEnumerable)ViewData["Result"], "id", "Name").Title("Result");
columns.bound(c =>c.DateResult) in my Grid
and there is three type of result ViewData(agree - disagree -Inprogress)
If the user select disagree I want to hide the DateResult
Note
popup editor
thanks
This is driving me nuts. I have a drop-down that onChange sends a query for the grid's data. I can see in my debugger that it is hitting my method in my controller and can see that the query actually returns rows but I get nothing showing up in the grid.
And before you ask, I did the camel-case serializer fix that is described many times over in these threads
.AddJsonOptions(options => {
options.SerializerSettings.ContractResolver = new DefaultContractResolver();
});
but it didn't help. I verified that the json looks correct by hitting the controller method directly and the fields are in PascalCase. I dumbed the grid down as much as possible to try to troubleshoot but no luck and I get no errors in my js console. Help! Here's my code
@(Html.Kendo().Grid<Data.Model.Client>()
.Name("grid")
.Columns(columns => {
columns.Bound(e => e.ClientID);
columns.Bound(e => e.ClientName);
columns.Bound(e => e.ClientStatus);
})
.Sortable()
.Pageable()
.Scrollable()
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(10)
.Read(read => read.Action("GetClients", "Home")
.Data("filterGrid"))
)
)
<script>
function filterGrid() {
return {
stateId: $("#ddlStates").val()
};
}
</script>
Hi,
I am using a custom popup template to add and edit rows on the grid. I can add and modify rows just fine and everything stores to the db the way it's supposed to.
However, I am finding that if I:
1: add a new row via the template
2. hit save,
3. come back to the main grid from the popup template.
4. immediately hit the EDIT button and go back to the template and correct a mistake.
5. hit the save button on the template.
when this sequence is followed the OnPostCreate gets called intead of OnPostUpdate.
It's like it never got out of edit mode.
If I refresh the grid by navigating someplace else and coming back all the data is correct. It's only in this rare instance.
Any ideas?
Thanks … Ed
Is there a way to catch the click event for this and the cancel button?
Thanks … Ed
Hi,
I have a class with more than 60 fields. Our quality gate doesn't allow more than 20 fields. So I factorized my code and have some class with one to one relations.
Is there something that I can use to have only one grid with all my fields?
I tried something like this, and got an error data.AppFacts is undefined :
@(Html.Kendo().Grid<App>()
.Name(
"grid"
)
.Columns(columns =>
{
columns.Bound(a => a.Name);
columns.Bound(a => a.AppData.DatabaseInstances);
columns.Bound(a => a.AppFacts.ApplicationType);
}
)
I tried with columns.ForeignKey, but I don't think I have understand how it work.
I'm a new developer, so it might be obvious but I tried.
Hello,
I'm trying to built a reusable grid component with Kendo Grid (ASP.NET Core) but I'm finding some problems with its configuration.
Taking the example, https://demos.telerik.com/aspnet-core/grid/editing-custom, if we configure edition mode as PopUp, the result form doesn't show the custom field.
Same happens if we change the grid type Grid<Kendo.Mvc.Examples.Models.ProductViewModel>() -> Grid<dynamic>(). In this case to configure fields I use the overload with (Type memberType, string memberName) params.
Do I need to configure something else?
One solution is to use the Foreign configuration, like this https://demos.telerik.com/aspnet-core/grid/foreignkeycolumn, but with grid type dynamic (Grid<dynamic>()) grid disappears and no errors are shown.
What I need would be the edition mode to be PopUp and the grid type dynamic. How can I do that?
Thank you.
Best Regards,
Ivan
I have a grid I've created using the tag helper. Hovering over the column lines does not show the resize pointer. How do I enable column resizing for the grid? I tried removing the set widths for the columns but that doesn't seem to make a difference.
<
kendo-grid
name
=
"grid"
>
<
datasource
type
=
"DataSourceTagHelperType.Ajax"
server-operation
=
"false"
in-place-sort
=
"true"
page-size
=
"10"
>
<
transport
>
<
read
url
=
"/admin/logs/app?handler=Read"
type
=
"Get"
/>
</
transport
>
<
sorts
>
<
sort
field
=
"TimeStamp"
direction
=
"desc"
/>
</
sorts
>
</
datasource
>
<
toolbar
>
<
toolbar-button
name
=
"search"
></
toolbar-button
>
<
toolbar-button
name
=
"excel"
></
toolbar-button
>
</
toolbar
>
<
sortable
enabled
=
"true"
initial-direction
=
"ascending"
/>
<
filterable
enabled
=
"true"
/>
<
pageable
button-count
=
"5"
refresh
=
"true"
page-sizes
=
"new int[] { 5, 10, 20 }"
>
</
pageable
>
<
scrollable
enabled
=
"true"
/>
<
excel
file-name
=
"appliationlog.xls"
/>
<
columns
>
<
column
field
=
"TimeStamp"
template
=
"#=template(data)#"
title
=
"Time"
width
=
"120"
/>
<
column
field
=
"UserName"
title
=
"User"
width
=
"180"
/>
<
column
field
=
"Level"
title
=
"Level"
width
=
"60"
/>
<
column
field
=
"RequestUri"
title
=
"URL"
width
=
"200"
/>
<
column
field
=
"Message"
title
=
"Message"
width
=
"300"
/>
</
columns
>
</
kendo-grid
>
I am trying to get the category axis values to be sorted in descending order based on the number of items they have. Also, I am using a Bar Chart not a Grid. I have tried this group compare:
group: { field: "category", dir: "desc",
compare: function(a, b) {if (a.items.length === b.items.length) {return 0;} else if (a.items.length > b.items.length) {return 1;} else {return -1;}}}
as stated in this documentation and advised by Admin Alex https://docs.telerik.com/kendo-ui/api/javascript/data/datasource/configuration/group#groupcompare
I'll attach an image of what it looks like with that function in use. As you can see on the image, although one of my categoriy values has an item count of 24 which is the second highest, it is still near the bottom because it does not contain any items from the first Environment which is in the legend as "QA FT".
The only function that has managed to overwite this is one that sorts them but based on alphabetical order and it is a databound event. Here is the function:
function sortLabels(e) {
var axis = e.sender.options.categoryAxis;
axis.categories = axis.categories.sort();
}
Another thing I have tried has been:
function sortLabels(e) {
var axis = e.sender.options.categoryAxis;
axis.categories = axis.categories.sort(function (a, b) {
if (a.items.length === b.items.length) {
return 0;
} else if (a.items.length > b.items.length) {
return 1;
} else {
return -1;
}
});
}
Thank you,
DC
I am trying to select checkboxes in Treeview on load using javascript or jquery. I have tried the following dojo code, but I am getting .dataitems() undefined in console.
Does anyone know why?
Hi
My grid table need to include dropdownlist in one of the cell, and i need to allow user to Add new item to the dropdownlist.
But i not sure how to select and display the New Item after i added the value to database.
Please help.
function
addNewServiceProviderRole(widgetId, value) {
if
(confirm(
"Are you sure?"
)) {
var
formData =
new
FormData();
formData.append(
"role"
, value);
$.ajax({
type:
'POST'
,
url:
'/ServiceProviderRole/AddServiceProviderRole'
,
beforeSend:
function
(xhr) {
xhr.setRequestHeader(
"XSRF-TOKEN"
,
$(
'input:hidden[name="__RequestVerificationToken"]'
).val());
},
contentType:
false
,
processData:
false
,
data: formData,
success:
function
(result) {
if
(result.Errors !=
null
&& result.Errors.length > 0) {
}
else
{
}
}
});
}
}
This is my template.
@using Kendo.Mvc.UI
@(Html.Kendo().DropDownListFor(m => m)
.DataValueField("IServiceProviderRoleId")
.DataTextField("URole")
//.BindTo((System.Collections.IEnumerable)ViewData["roles"])
.Filter(FilterType.Contains)
.NoDataTemplateId("noDataTemplate")
.DataSource(dataSource => dataSource
.Ajax()
.Read(r => r.Url("/ServiceProviderRole/GetAllServiceProviderRole").Data("forgeryToken")))
)
<
script
id
=
"noDataTemplate"
type
=
"text/x-kendo-tmpl"
>
<
div
>
No data found. Do you want to add new item - '#: instance.filterInput.val() #' ?
</
div
>
<
br
/>
<
button
class
=
"k-button"
onclick
=
"addNewServiceProviderRole('#: instance.element[0].id #', '#: instance.filterInput.val() #')"
>Add new item</
button
>
</
script
>