我有一个网格,我想添加一些客户端验证,但我无法弄清楚如何做到这一点。剑道网站上的例子还不够。我错过了一些东西。
这是我的网格代码:
$(document).ready(function () {
var datasource = new kendo.data.DataSource({
transport: {
read: {
url: '/DiscountPromotion/Get',
dataType: "json",
},
update: {
url: '/DiscountPromotion/Update',
dataType: "json",
type: "POST",
contentType: "application/json"
},
destroy: {
url: '/DiscountPromotion/Delete',
dataType: "json",
type: "POST",
contentType: "application/json"
},
create: {
url: '/DiscountPromotion/Add',
dataType: "json",
type: "POST",
contentType: "application/json"
},
parameterMap: function(options, operation) {
if (operation !== "read") {
return JSON.stringify({ discountPromotionViewModel: options });
}
},
},
pageSize: 10,
schema: {
model: {
id: "Id",
fields: {
Id: { type: "number" },
Code: {
validation: {
required: true,
codevalidation: function (input) {
console.log("HÄÄR");
if (input.is("[name='Code']") && input.val() != "") {
console.log("INTE HÄR");
input.attr("data-codevalidation-msg", "Product Name should start with capital letter");
return /^[A-Z]/.test(input.val());
}
return true;
}
}
},
StartDate: { type: "date" },
EndDate: { type: "date" },
MinimumCost: {
type: "number",
validation: {
required: true,
mincostvalidation: function(input) {
if (input.val() == 0) {
console.log(input);
return false;
}
return true;
}
}
},
MaximumCost: { type: "number", validation: { min: 0 } },
Quantity: { type: "number", validation: { min: 0 } },
Customer: { defaultValue: { CustomerId: 0, CustomerName: "Select customer..." } },
CountryCode: { type: "string" },
Discount: { type: "number" },
ModelName: { type: "string" }
}
}
},
errors: function(e) {
console.log(e.errors);
}
});
$("#discountpromotiongrid").kendoGrid({
dataSource: datasource,
batch: true,
toolbar: ["create", "save", "cancel", { name: "genCode", text: "Generate Code", click: function(e) {
return false;
}}],
height: 400,
navigatable: true,
selectable: true,
pageable: {
refresh: true,
pageSizes: true,
buttonCount: 5
},
columns: [
{
field: "ModelName",
title: "ModelName",
editor: modelNameDropDown,
template: "#=ModelName#",
width: 150
},
{
field: "Code",
title: "Code",
width: 150
},
{
field: "StartDate",
title: "StartDate",
template: '#= kendo.toString(StartDate,"yyyy-MM-dd") #',
format: "{0:yyyy-MM-dd}",
parseFormats: ["yyyy-MM-dd"],
width: 120
},
{
field: "EndDate",
title: "EndDate",
template: '#= kendo.toString(EndDate,"yyyy-MM-dd") #',
format: "{0:yyyy-MM-dd}",
parseFormats: ["yyyy-MM-dd"],
width: 120
},
{
field: "MinimumCost",
title: "MinCost",
width: 100,
format: "{0:n0}"
},
{
field: "MaximumCost",
title: "MaxCost",
width: 100,
format: "{0:n0}"
},
{
field: "Quantity",
title: "Quantity",
width: 80,
format: "{0:n0}"
},
{
field: "Customer",
title: "Customer",
editor: customerDropDown,
template: "#=Customer.CustomerName#",
width: 150
},
{
field: "CountryCode",
title: "CountryCode",
editor: countryCodeDropDown,
template: "#=CountryCode#",
width: 120
},
{
field: "Discount",
format: "{0:p0}",
editor: function (container, options) {
$("<input name='Discount'>")
.appendTo(container)
.kendoNumericTextBox(
{
min: 0,
max: 1.0,
step: 0.01
});
},
width: 100
},
{
command: "destroy",
title: " ",
width: 120
}],
editable: true
});
function modelNameDropDown(container, options) {
$('<input required data-text-field="ModelName" data-value-field="ModelName" data-bind="value:' + options.field + '"/>')
.appendTo(container)
.kendoDropDownList({
autoBind: true,
optionLabel: "Select model...",
dataSource: {
serverFiltering: true,
transport: {
read: {
url: '/DiscountPromotion/GetModelNamesByCustomerId',
dataType: "json",
type: "POST",
contentType: "application/json"
}
}
}
});
}
function customerDropDown(container, options) {
$('<input required data-text-field="CustomerName" data-value-field="CustomerId" data-bind="value:' + options.field + '"/>')
.appendTo(container)
.kendoDropDownList({
autoBind: true,
optionLabel: "Select customer...",
dataSource: {
serverFiltering: true,
transport: {
read: {
url: '/DiscountPromotion/GetSuppliersCustomersByCustomerId',
dataType: "json",
type: "POST",
contentType: "application/json"
}
}
}
});
}
function countryCodeDropDown(container, options) {
$('<input required data-text-field="CountryCode" data-value-field="CountryCode" data-bind="value:' + options.field + '"/>')
.appendTo(container)
.kendoDropDownList({
autoBind: true,
optionLabel: "Select model...",
dataSource: {
serverFiltering: true,
transport: {
read: {
url: '/DiscountPromotion/GetCountryCodesBySuppliersCustomers',
dataType: "json",
type: "POST",
contentType: "application/json"
}
}
}
});
}
$(".k-grid-genCode", "#discountpromotiongrid").bind("click", function (ev) {
var text = generateCode();
var grid = $("#discountpromotiongrid").data("kendoGrid");
var row = grid.select();
var data = grid.dataItem(row);
data.dirty = true;
data.Code = text;
$('#discountpromotiongrid').data('kendoGrid').refresh();
//$(".k-grid-edit-row").find("input[name='Code']").val(text);
});
function generateCode() {
var n = 8;
var text = '';
var possible = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
for (var i = 0; i < n; i++) {
text += possible.charAt(Math.floor(Math.random() * possible.length));
}
return text;
}
});
console.log
没有一个在控制台中注册任何内容,因此我的验证没有实际被解雇。