#kendo-ui #kendo-grid
#kendo-пользовательский интерфейс #kendo-grid
Вопрос:
Я пытаюсь получить ‘ObjectId’ из выбранной строки в сетке kendo, но в настоящее время это не работает.
<div class="clearfix">
@(Html.Kendo().Grid<M20_AEK.Models.ContractSettlement>()
.Name("ContractSettlementGrid")
.Editable(editable => editable.Mode(GridEditMode.PopUp))
.Pageable(pageable => pageable.Input(true).Numeric(false))
.Scrollable()
.Selectable()
.Sortable()
.Filterable()
.ColumnMenu()
.Groupable()
.Selectable()
.Columns(columns =>
{
columns.Bound(c => c.ObjectID).Title("ID").Hidden();
columns.Bound(c => c.OPERATOR_OBJECTID).Title("Operator").Width("100px");
columns.Bound(c => c.Year).Title("Year").Width("100px");
columns.Bound(c => c.Month).Title("Month").Width("100px");
columns.Bound(c => c.SETTLEMENT_OBJECTID).Title("Settlement").Width("100px");
columns.Bound(c => c.TECHNOLOGY_OBJECTID).Title("Technology").Width("100px");
columns.Bound(c => c.UPLOAD_SPEED_CLASS_OBJECTID).Title("Upload").Width("100px");
columns.Bound(c => c.DOWNLOAD_SPEED_CLASS_OBJECTID).Title("Download").Width("100px");
columns.Bound(c => c.ObjectID)
.Title("Edit")
.Filterable(false)
.ClientTemplate("<a onclick="showDetails(this,'#= ObjectID#')" href='\#'>Edit</a>");
columns.Command(command => { command.Edit(); command.Destroy(); }).Width(172);
})
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Events(events => events.Error("error_handler"))
.Model(model => model.Id(p => p.ObjectID))
.Read(read => read.Action("LoadSettlementContracts_Read", "SettlementContract"))
.Update(update => update.Action("Save", "SettlementContract"))
.Destroy(update => update.Action("Delete", "SettlementContract"))
)
)
</div>
function showDetails(ObjectID) {
alert(ObjectID);
}
Я также попробовал что-то подобное, так как нашел несколько возможных решений на форумах.
function showDetails() {
var grid = $("#ContractSettlementGrid").data("kendoGrid");
var selectedRow = grid.select();
var index = selectedRow();
console.log(index);
//this does not work
}
Есть какие-нибудь идеи о том, как это сделать?
Ответ №1:
Вы близки к тому, чтобы это сработало!
Вам не нужно использовать шаблон клиента для вашей кнопки (если только нет другого кода, которым вы не поделились). Вы можете изменить его на:
columns.Command(command => command.Custom("Edit").Click("showDetails"));
И создаем функцию showDetails:
<script type="text/javascript">
function showDetails(e) {
e.preventDefault();
var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
//do whatever you need with the dataItem here
console.log(dataItem.ObjectID);
}
</script>
Дополнительная информация здесь:https://demos .telerik.com/aspnet-core/grid/custom-command
Комментарии:
1. большое спасибо, это помогло. Я стажируюсь сразу после колледжа в компании, и они используют платную лицензию Telerik / Kendo, и это вызывает больше проблем, чем на самом деле помогает, спасибо вам ооочень большое!
2. Рад, что у вас все получилось. Хотя для ознакомления с ними может потребоваться некоторое время, элементы управления Telerik / Kendo (как и другие подобные библиотеки) могут в конечном итоге сэкономить сотни, если не тысячи часов усилий, когда вам нужен этот тип управления данными или функциональность редактора
Ответ №2:
просто используйте что-то подобное в своей сетке:
столбцы.Команда (command => команда.Пользовательский («Удалить»).Нажмите(«DeleteProduct»));
а затем в вашем jquery:
var grid = $("#Grid").data("kendoGrid");
var selectedItem = grid.dataItem(grid.select());
var Id = selectedItem.Id;