I use a Grid to display back some rows that have an Order{int} field. When I display these items in the grid and elsewhere, they are to be displayed by order.
I would like the user experience to have the 1st column in the grid contain up and down arrows. Then, the user can select up/down on the arrows and the grid will submit a change to the row and the grid will display the row in its new location.
This is similar to how your NumericTextBox (https://demos.telerik.com/aspnet-core/numerictextbox/index) has arrows except this just sets the order in which the records display in the grid.
public partial class Option
{
public int Id { get; set; }
[MaxLength(50)]
public string Name { get; set; }
[MaxLength(128)]
public string Description { get; set; }
public int Order { get; set; }
}
I'm using UI for ASP.NET core 2020.3.1118, and i'm trying to implement a child grid with the ability to add an entry to my child grid
I need to pass the Id value from my Parent Grid to the model of the child when i add a new entry
I've been trying to use the
model.Field(gp => gp.GroupId).DefaultValue(0);
using a kendo template value "#=id#" in the child grid definition, without success as the DefaultValue method only seems to allow to accept actual values.
I'm really looking for advice here,
i've currently resolved the issue by passing an additional parameter in my Create action and updating the model in my controler with the parameter
.Create(create => create.Action(
"Post"
,
"GroupsPermission"
,
new
{ NewGroupId =
"#=Id#"
}))
Thanks in Advance
I have a grid that is loading in a modal popup (a partial view) that requires some information from the parent page being set before calling the datasource on the controller. I have set AutoBind to false and while it does prevent the datasource from calling the controller until I load the partial view, the .Data(javascript function) that builds the dataset needed for the controller is still being hit as soon as the parent page is initialized, but before the values on the page have been set (user input fields).
Is there a way to either prevent this from happening, or is there another technique I should be using?
Thanks for any help in advance
Hi
I have implemented the card UI and have the drag and drop working using the example script
$(document).ready( function () { $("#list").kendoSortable({ filter: ".k-card", cursor: "move", placeholder: function (element) {return element.clone().css("opacity", 0.1);}, hint: function (element) {return element.clone().css("width", element.width()).removeClass("k-state-selected");}});});
I want to be able to save the new order if the user drags and drops and item.
Is there an event to know when a drag and drop action has occurred.
Then I can loop through a class in javascript and grab the order from the ids or a data attribute to re-order the items.
Many thanks
After my page comes back after a post the selected items in the multi select are gone. The datasource http GET returns no items because it filters it base off text...
RAZOR .cshtml
<kendo-multiselect for="SearchCriteria.SiteId" value="@Model.SearchCriteria.SiteId" datatextfield="Name"
datavaluefield="Id" placeholder="Search for a Clinic" filter="FilterType.Contains"
auto-bind="true" deferred="true">
<datasource server-filtering="true">
<transport>
<read url="@Model.SearchProvidersURL">
</transport>
</datasource>
</kendo-multiselect>
RAZOR Model page
public string SearchProvidersURL => $"{Url.Page("ByClinic")}?handler=ProviderSearch";
public async Task<JsonResult> OnGetProviderSearch(string text)
{
var providerSites = await _lookUpService.GetProviderSites(text);
//No Results if text is less than 3 characters because there are too many sites. I would return 40,000 items
return new JsonResult(providerSites);
}
Can I write some javascript that could run after the post happens, I don't know what to do?
I have a column with html code. i.e. <div style='color: green'> Active</div>
and I have the filterable operator set to "Contains" but the filter result is alway not found.
@(Html.Kendo().Grid(Model.Transaction)
.Name("Grid")
.Columns(columns =>
{
columns.Bound(p => p.DisplayLeaseStatus).Title("Transaction
Status").HtmlAttributes(new { style = "text-align:center" }).Filterable(ftb => ftb.Multi(true).BindTo(new[]{
new { DisplayLeaseStatus = Active },
new { DisplayLeaseStatus = Expired },
new { DisplayLeaseStatus = Terminated }
};));
})
.Scrollable(scrollable => scrollable.Height("auto"))
.Filterable(filterable => filterable
.Extra(false)
.Operators(operators => operators
.ForString(str => str.Clear()
.Contains("Contains")
)
)
.Events(e => e.DataBound("dataBoundHandler"))
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(false)
.PageSize(50)
.Events(e => e.Error("onError").RequestEnd("onRequestEnd")))
.Resizable(resize => resize.Columns(true))
.Reorderable(reorder => reorder.Columns(true))
)
and the column data contents i.e. <div style='color : greed'> Active </div>
</
div
>
Any advice how i can filter this?