常见用法

<div id="relationTablesDialog"/>

头行表,在字段中

{
field: "relationTable",
title: '<@spring.message "mtgentype.relationtable"/>',
120,
attributes: {style: "text-align:center"},
headerAttributes: {style: "text-align: center"},
template: function (rowData) {
if(!!rowData.genTypeId){
return '<a href="#" style="100%;height: 100%;display: inline-block;" onclick=""><@spring.message "mtgentype.relationtable"/></a>'
}
return "";
},
editor: function (container, options) {
if (!!options.model.genTypeId) {
relationTablesSelect(options.model.genTypeId,options.model.initialFlag);}
}
},

function relationTablesSelect(genTypeId,initialFlag) {
var roleWin = $("#relationTablesDialog").data("kendoWindow");
roleWin.refresh('mt_gen_type_relation_table.html?genTypeId='+ genTypeId+"&initialFlag="+initialFlag);
if (parent.autoResizeIframe) {
parent.autoResizeIframe('${RequestParameters.functionCode!}', 700, function () {
roleWin.center().open();
});
} else {
roleWin.center().open();
}
}

$("#relationTablesDialog").kendoWindow({
"1000px",
height: "600px",
title: '<@spring.message "mtgentype.relationtable"/>',
modal: true,
resizable: false,
visible: false,
iframe: true,
close: function (e) {
}
});



//第二个页面

<#include "../include/header.html" />
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<script type="text/javascript">
var genTypeId = "${RequestParameters.genTypeId!'0'}";
</script>
<body>

<script type="text/javascript">
var viewModel2 = Hap.createGridViewModel("#tables");
var initialFlag="${RequestParameters.initialFlag}";
viewModel2.createData=function () {
if (initialFlag=="Y"){
return;
}
viewModel2.create();
}
viewModel2.saveData=function () {
if (initialFlag=="Y"){
return;
}
viewModel2.save();
}
viewModel2.removeData=function () {
if (initialFlag=="Y"){
return;
}
viewModel2.remove();
}
</script>

<div id="page-content">
<div class="pull-left" id="toolbar-btn" style="padding-bottom:10px;">
<span class="btn btn-primary" data-bind="click:createData" style="float:left;margin-right:5px;"><@spring.message "hap.new"/></span>
<span class="btn btn-success k-grid-save-changes" data-bind="click:saveData" style="float:left;margin-right:5px;"><@spring.message "hap.save"/></span>
<span class="btn btn-danger" data-bind="click:removeData" style="float:left;"><@spring.message "hap.delete"/></span>
</div>
<script>kendo.bind($('#toolbar-btn'), viewModel2);</script>
<div style="clear:both">
<div id="tables"></div>
</div>
</div>

<script type="text/javascript">
var BaseUrl = _basePath;
var initialFlag="${RequestParameters.initialFlag}";
var dataSource = new kendo.data.DataSource({
transport: {
read: {
url: BaseUrl + '/mt/gen/type/relation/table/query/id/' + genTypeId + '/ui',
dataType: "json"
},
update: {
url: BaseUrl + "/mt/gen/type/relation/table/submit/ui",
type: "POST",
contentType: "application/json"
},
destroy: {
url: BaseUrl + "/mt/gen/type/relation/table/submit/ui",
type: "POST",
contentType: "application/json"
},
create: {
url: BaseUrl + "/mt/gen/type/relation/table/submit/ui",
type: "POST",
contentType: "application/json"
},
parameterMap: function (options, type) {
if (type !== "read" && options.models) {
var datas = Hap.prepareSubmitParameter(options, type)
$.each(datas, function (i, item) {
item.genTypeId = genTypeId;
});
return kendo.stringify(datas);
} else if (type === "read") {
return Hap.prepareQueryParameter(viewModel2.model.toJSON(), options)
}
},
},
batch: true,
schema: {
data: 'rows',
total: 'total',
model: {
id: "genTypeId",
fields: {},
editable: function (e) {
if (this.isNew()) {
return true;
}
if(initialFlag=="Y"){
false;
}
return false;
}
}
}
});


$("#tables").kendoGrid({
dataSource: dataSource,
esizable: true,
scrollable: true,
navigatable: false,
selectable: 'multiple, rowbox',
dataBound: function () {
if (parent.autoResizeIframe) {
parent.autoResizeIframe('${RequestParameters.functionCode!}')
}
},
columns: [
{
field: "relationTable",
title: '<@spring.message "mtgentype.relationtable"/>',
120,
template: function (dataItem) {
return dataItem['relationTable']||''
},
editor: function (container, options) {
$('<input required name="' + options.field + '"/>')
.appendTo(container)
.kendoLov($.extend(<@lov "ALL_MT_TABLES"/>, {
textField: 'tableName',
valueField: 'tableName',
model: options.model,
}));
}
/*editor: function (container, options) {
$('<input name="' + options.field + '" style="100%"/>')
.appendTo(container)
.kendoAutoComplete({
dataSource: allTableDataSource,
dataTextField: "text",
select: function (e) {
options.model.set("relationTable", e.item.text());
}
});
}*/
}
],
editable: true,
change: function (e) {
}
});

/*var allTableDataSource = new kendo.data.DataSource({
transport: {
read: {
url: "${base.contextPath}/generator/alltables",
dataType: "json"
}
},
schema: {
model: {
expanded: true
},
parse: function (response) {
var products = [];
for (var i = 0; i < response.total; i++) {
var le = response.rows[i];
if (le.substring(le.length - 3, le.length) != "_TL"
&& le.substring(le.length - 3, le.length) != "_tl"
&& (le.substring(0, 3) == "mt_" || le.substring(0, 3) == "MT_")) {
var product = {
text: response.rows[i],
value: response.rows[i],
};
products.push(product);
}
}
return products;
}
}
});*/
</script>
</body>
</html>


后台

@RequestMapping(value = "/mt/gen/type/relation/table/query/id/{id:.+}/ui", method = RequestMethod.GET)
@ResponseBody
public ResponseData relationTableQuery(HttpServletRequest request,
@PathVariable(value = "id", required = true) String id) {
IRequest requestContext = createRequestContext(request);
return new ResponseData(service.relationTableQuery(requestContext, id));
}
原文地址:https://www.cnblogs.com/fuqiang-zhou/p/14249356.html