我对 KENDO UI 真的很陌生,我也有点困惑,因为我正在使用 VB.Net 和 Kendo,翻译有点奇怪,所以说了这么多,让我们来回答这个问题。
我在 ASP.Net MVC 页面中使用 Kendo Grid,如下所示:
@(Html.Kendo().Grid(Of Portal.ProductList).Name("Grid2") _
.DataSource(Function(ds) ds.Ajax() _
.Model(Sub(model) model.Id(Function(p) p.ItemID)) _
.Read(Function(read) read.Action("GetAjaxItems", "ShoppingCartItems").Data("gridParms")) _
.Destroy(Function(destroy) destroy.Action("DeleteAjaxItems", "ShoppingCartItems", New With {.ShoppingCartID = ViewData("ShoppingCartID")})) _
) _
.Columns(Function(modelItem) modelItem.Bound(Function(p) p.ItemCodeOrdering).Title("Item")) _
.Columns(Function(modelItem) modelItem.Bound(Function(p) p.Description)) _
.Columns(Function(modelItem) modelItem.Bound(Function(p) p.Quantity).Title("Quantity").ClientTemplate("<input type='text' style='width:40px;' id='QTY#= ItemID #' value='#= Quantity #' /> <input type='button' id='UPD#= ItemID#' value='Update' onclick='updateItemQty(this)' /> ")) _
.Columns(Function(modelItem) modelItem.Bound(Function(p) p.Price).Title("Unit Price").ClientTemplate("<div id='price#=ItemID#'>$#=Price.toFixed(2)#</div>")) _
.Columns(Function(modelItem) modelItem.Bound(Function(p) p.Quantity).Title("Total Price").ClientTemplate("<div id='total#=ItemID#'>$#= (Price * …Run Code Online (Sandbox Code Playgroud) 我要为Kendo Grid创建一个自定义的"更新"按钮.
基本上,它以编程方式将适当的行放入编辑模式(使用editRow),将某些字段更新为特定值(使用model.set),然后保存行(使用saveRow).
它正在工作,但是一旦editRow调用该方法就会显示弹出编辑窗口,这会减慢进程并且看起来不太好.
有没有办法在以编程方式修改数据时抑制弹出窗口?这就是我正在做的事情(可能有另一种/更好的方法来做到这一点):
columns: [
....
{ command: [{name: 'edit' }, {name: 'approval'}, {name: 'delrow'}] }
],
dataBound: function() {
grid.find('.k-grid-approval').click(function() {
var row = $(this).parents('tr:first');
var g = requisitions.data('kendoGrid');
var data = g.dataItem(row[0]);
var model = g.dataSource.getByUid(data.uid);
g.editRow(row[0]);
model.set('status', 'Pending');
model.set('date_submitted', moment().toDate());
g.saveRow();
});
Run Code Online (Sandbox Code Playgroud)
我怀疑有更好的方法可以做到这一点,但我不知道它是什么.任何建议都非常感谢.
我正在将 Kendo UI Grid 与 MVC 4 一起使用,它运行良好,只有一个例外。
如果我在网格中添加一行,然后更新一行,它最终会添加一行而不是更新它。
我能说的是,如果我按添加,程序会在我的 MVC 控制器中输入Create方法,如果我在添加后的一行上按更新,我将再次进入Create方法。
但是,如果我在启动后直接按下网格中的更新按钮,情况似乎并非如此。我正在使用 Ajax 调用完成所有这些操作,因此它与在调用之间不更新的页面有关。如果我只执行一个命令然后刷新页面,一切都会很好。我也使用实体框架作为 ORM。
这是我的剃刀观点:
@model IEnumerable<Internal.License.Management.Web.UI.Models.PriceListViewModel>
@{
ViewBag.Title = "Price List";
}
@(Html.Kendo().Grid<Internal.License.Management.Web.UI.Models.PriceListViewModel>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(p => p.Name).Width(120);
columns.Bound(p => p.Code).Width(180);
columns.Bound(p => p.Interval).Width(180);
columns.Bound(p => p.PricePerUnit).Width(200);
columns.Bound(p => p.Currency).Width(120);
columns.Command(commands =>
{
commands.Edit();
commands.Destroy();
}).Width(172);
})
.ToolBar(toolbar => toolbar.Create())
.Editable(editable => editable.Mode(GridEditMode.InLine))
.Pageable()
.Sortable()
.Scrollable()
.HtmlAttributes(new { style = "height:430px;" })
.DataSource(dataSource =>
dataSource.Ajax()
.PageSize(20)
.Events(events => events.Error("error_handler")) …Run Code Online (Sandbox Code Playgroud) 我很难找出如何对使用 Template 属性设置的网格中的列进行排序,如下所示:
@(Html.Kendo().Grid(Model.UnitDetails)
.Name("unitGrid")
.DataSource(ds => ds
.Ajax()
.Read(read => read.Action("Units_Read", "Fleet"))
.AutoSync(true)
.ServerOperation(true)
)
.Columns(columns =>
{
columns.Bound(p => p.ViewUnitContract.CurrentRun.Operation.WellContract.Location).Title("Well Site").Sortable(true);
columns.Bound(p => p.ViewUnitContract.Name).Title("Unit Name").Width(200);
columns.Template(p => { }).ClientTemplate(" ").Title("Well");
columns.Template(p => { }).ClientTemplate(" ").Title("Run").Width(75);
columns.Template(p => { }).ClientTemplate(" ").Title("Task").Width(365);
columns.Template(p => { }).ClientTemplate(" ").Title("Activity").Width(200); ;
columns.Template(p => { }).ClientTemplate(" ").Title("Depth (m)").Width(115);
columns.Template(p => { }).ClientTemplate(" ").Title("Speed (m/min)").Width(90);
columns.Template(p => { }).ClientTemplate(" ").Title("Weight (kg)").Width(90);
})
.ClientRowTemplate(Html.Partial("_ClientRowTemplate", Model).ToHtmlString())
.Sortable())
Run Code Online (Sandbox Code Playgroud)
对前两列进行排序工作得很好,但是是否可以对与 ClientTemplates 绑定的那些进行排序?
我有一个带编辑内联的剑道网格。现在,在一列中,我想添加一个剑道颜色选择器。当行未处于编辑模式时,如何添加它并显示所选颜色?
任何人都可以给我举个剑道网格中颜色选择器的例子吗?
谢谢
我一直在寻找这方面的帮助,这应该是非常容易的,但我找不到我需要的东西.这是我的jsFiddle,它包含一个超级基本的Kendo网格.我只想在单击按钮时获取当前所选行的所有数据(使用一列单选按钮).
http://jsfiddle.net/HTXua/412/
我知道当选择一行时,它正在改变css类中的属性.因此,我试图检索的行将具有以下属性:
.detailGridRowSelector:checked
Run Code Online (Sandbox Code Playgroud)
我已经设法使用复选框(而不是单选按钮)实现第一行并计算检查了多少,但由于某种原因我无法访问数据!
var dataSource = {
data: [
{
"first": "Adam",
"last": "Paul"},
{
"first": "Shannon",
"last": "Harris"},
{
"first": "Frank",
"last": "Rolinson"},
]
};
var columns = [
{
template:'<input type="radio" class="detailGridRowSelector" title="Select Lines" name="radioLineSelector" />', width: 20
},
{
field: "first",
title: "First Name",
width: "90px"},
{
field: "last",
title: "Last Name",
width: "90px"},
];
$("#grid1").kendoGrid({
dataSource: dataSource,
columns: columns,
});
$("#getInfoButton").bind("click", function () {
var lineData ="line data would be set here";
//I know …Run Code Online (Sandbox Code Playgroud) 我有一个Kendo UI Grid连接到odata CRUD服务(Web API 2.2 OData V4).dataSource配置如下所示 - baseUrl对所有人来说都是相同的,只是HTTP动词更改.
var dataSource = new kendo.data.DataSource({
type: "odata",
transport: {
read: {
beforeSend: prepareRequest,
url: baseUrl,
type: "GET",
dataType: "json"
},
update: {
beforeSend: prepareRequest,
url: function (data) {
return baseUrl + "(" + data.CategoryId + ")";
},
type: "PUT",
dataType: "json"
},
create: {
beforeSend: prepareRequest,
url: baseUrl,
type: "POST",
dataType: "json"
},
destroy: {
beforeSend: prepareRequest,
url: function (data) {
return baseUrl + "(" + data.CategoryId + ")";
}, …Run Code Online (Sandbox Code Playgroud) 如何启用kendo ui网格行选择.我通过使用html帮助函数创建了一个kendo网格,通过javascript访问它并启用了行选择,但下面没有显示运气代码
@(Html.Kendo().Grid((IEnumerable<Gridkendo.Models.Model>)Model)
.Name("grid")
.Columns(columns =>
{
// Create a column bound to the ProductID property
columns.Bound(product => product.Name);
// Create a column bound to the ProductName property
columns.Bound(product => product.Description);
Run Code Online (Sandbox Code Playgroud)
并在JavaScript中访问它
<script>
$(function () {
// Notice that the Name() of the grid is used to get its client-side instance
var grid = $("#grid").data("kendoGrid");
var selectedItem = grid.dataItem(grid.select());
alert(selectedItem.ShipName);
});
</script>
Run Code Online (Sandbox Code Playgroud) 我正在尝试将kendo网格导出为excel,然后我在控制台中出错.如果有人知道,请帮帮我.谢谢你提前.
angular.js:13920 TypeError: Cannot read property 'length' of undefined
at Function.map (http://lm.stage.cargoclix.net/bower_components/jquery/dist/jquery.js:461:18)
at init.toDataURL (http://lm.stage.cargoclix.net/bower_components/kendo-ui/js/kendo.all.min.js:30:19702)
at init.<anonymous> (http://lm.stage.cargoclix.net/bower_components/kendo-ui/js/kendo.all.min.js:30:27764)
at Object.proxy (http://lm.stage.cargoclix.net/bower_components/jquery/dist/jquery.js:513:14)
at Object.<anonymous> (http://lm.stage.cargoclix.net/bower_components/jquery/dist/jquery.js:3230:33)
at fire (http://lm.stage.cargoclix.net/bower_components/jquery/dist/jquery.js:3073:30)
at Object.fireWith [as resolveWith] (http://lm.stage.cargoclix.net/bower_components/jquery/dist/jquery.js:3185:7)
at Object.deferred.(anonymous function) [as resolve] (http://lm.stage.cargoclix.net/bower_components/jquery/dist/jquery.js:3275:34)
at init.<anonymous> (http://lm.stage.cargoclix.net/bower_components/kendo-ui/js/kendo.all.min.js:30:22489)
at Object.proxy (http://lm.stage.cargoclix.net/bower_components/jquery/dist/jquery.js:513:14)
Run Code Online (Sandbox Code Playgroud)
这是我的Bower.json文件代码:
"dependencies": {
"font-awesome": "4.6.3",
"angular": "1.5.8",
"json-formatter": "0.6.0",
"angular-route": "1.5.8",
"angular-local-storage": "0.5.2",
"angular-cookies": "1.5.8",
"angular-sanitize": "1.5.8",
"angular-animate": "1.5.8",
"bootstrap": "3.3.7",
"angular-bootstrap": "2.2.0",
"toastr": "2.1.3",
"moment": "2.15.1",
"angular-translate": "2.11.0",
"angular-gridster": "0.13.15",
"angular-loading-bar": "0.9.0",
"angular-i18n": "1.5.8",
"angular-translate-loader-static-files": …Run Code Online (Sandbox Code Playgroud) 我有一个允许用户在Kendo Angular 2网格中选择一行并单击删除该行的按钮的应用程序。但是,在删除该行之后,网格选择将保留在刚删除的行的索引上。我想在单击按钮并删除该行后清除网格的选择。对于我的一生,我找不到办法。有任何想法吗?
kendo-grid ×10
kendo-ui ×7
asp.net-mvc ×2
c# ×2
jquery ×2
html ×1
javascript ×1
odata ×1
radio ×1