您的位置:首页 > 其它

增加元数据的未完成页面

2015-06-07 22:06 274 查看
<!DOCTYPE html>

<html>

<head>

<title>Customizing actions</title>

<link href="content/shared/styles/examples-offline.css" rel="stylesheet">

<link href="styles/kendo.common.min.css" rel="stylesheet">

<link href="styles/kendo.default.min.css" rel="stylesheet">

<script src="js/jquery.min.js"></script>

<script src="js/kendo.web.min.js"></script>

<script src="content/shared/js/console.js"></script>

<script>

</script>

</head>

<body>

<a class="offline-button" href="../index.html">Back</a>

<div id="example" class="k-content">

<div id="window" style="display:none">

<div >

<!--

<div id="gridTitle"></div>

<div id="gridContent"></div>

-->

<button id="addTitle" onclick="addTitle()">addTitle</button>

<button id="addContent" onclick="addContent()">addContent</button><br/>

<div style="float:left; width:100px; height:100px; background:#333" id="Title">

</div>

<div style="float:left; width:100px; height:100px; background:#333" id="Content">

</div>

</div>

</div>

<span id="undo" style="display:true" class="k-button">Click here to open the window.</span>

<script>

//设置弹出框

function addTitle(){

//alert($("#aTitle").html());

$("#Title").append("<input class='titles' id='aaa' value='xxxxx'/>");

$("#Content").append("<inputclass='contents' id='aaa' value='bbbbbb'/><br/>");

}

function addContent(){

//alert("addContent");

var width=$("#aaa").width();

width=width+5;

//alert(width);

//$("#Content").append("<input id='aaa' value='bbbbbb' style='margin-left:"+width+"'/><br/>");

$("#Content").append("<input id='aaa' value='bbbbbb'/><br/>");

}

function onOpen(e) {

kendoConsole.log("event :: open");

}

function onClose(e) {

$("#undo").show();

kendoConsole.log("event :: close");

}

function onActivate(e) {

kendoConsole.log("event :: activate");

}

function onDeactivate(e) {

kendoConsole.log("event :: deactivate");

}

function onRefresh(e) {

kendoConsole.log("event :: refresh");

}

function onResize(e) {

kendoConsole.log("event :: resize");

}

function onDragStart(e) {

kendoConsole.log("event :: dragstart");

}

function onDragEnd(e) {

kendoConsole.log("event :: dragend");

}

function openDialog(){

if (!$("#window").data("kendoWindow")) {

$("#window").kendoWindow({

width: "630px",

height: "315px",

title: "增加元数据",

actions: ["Refresh", "Close"],

content: "../../content/web/window/ajax/ajaxContent1.html",

visible: false,

open: onOpen,

activate: onActivate,

close: onClose,

deactivate: onDeactivate,

refresh: onRefresh,

resize: onResize,

dragstart: onDragStart,

dragend: onDragEnd

}).data("kendoWindow").open();

}

}

$("#undo")

.bind("click", function() {

openDialog();

$("#window").data("kendoWindow").open().center();;

// $("#undo").open();

});

//给弹出框中增加列

/*

var crudServiceBaseUrl = "http://demos.kendoui.com/service",

dataSource = new kendo.data.DataSource({

transport: {

read: {

url: crudServiceBaseUrl + "/Products",

dataType: "jsonp"

},

update: {

url: crudServiceBaseUrl + "/Products/Update",

dataType: "jsonp"

},

destroy: {

url: crudServiceBaseUrl + "/Products/Destroy",

dataType: "jsonp"

},

create: {

url: crudServiceBaseUrl + "/Products/Create",

dataType: "jsonp"

},

parameterMap: function(options, operation) {

if (operation !== "read" && options.models) {

return {models: kendo.stringify(options.models)};

}

}

},

batch: true,

pageSize: 20,

schema: {

model: {

id: "ProductID",

fields: {

ProductID: { editable: false, nullable: true },

ProductName: { validation: { required: false } },

UnitsInStock: { type: "number", validation: { min: 0, required: true } }

}

}

}

});

$("#addContent")

.bind("click", function() {

alert("addContent");

});

$("#gridTitle").kendoGrid({

dataSource: dataSource,

navigatable: true,

pageable: true,

height: 430,

toolbar: ["add", "save", "cancel","addContent"],

columns: [

{ field: "ProductName", title: "Product Name", width: 110 },

{ command: "destroy", title: " ", width: 90 }],

editable: true

});

*/

</script>

<style scoped>

#example {

min-height:400px;

}

#undo {

text-align: center;

position: absolute;

white-space: nowrap;

border-width: 1px;

border-style: solid;

padding: 2em;

cursor: pointer;

}

/**

$(document).ready(function() {

var element = $("#grid").kendoGrid({

dataSource: {

type: "odata",

transport: {

read: "http://demos.kendoui.com/service/Northwind.svc/Employees"

},

pageSize: 6,

serverPaging: true,

serverSorting: true

},

height: 430,

sortable: true,

pageable: true,

detailInit: detailInit,

dataBound: function() {

this.expandRow(this.tbody.find("tr.k-master-row").first());

},

columns: [

{

field: "FirstName",

title: "First Name",

width: "110px"

},

{

field: "LastName",

title: "Last Name",

width: "110px"

},

{

field: "Country",

width: "110px"

},

{

field: "City",

width: "110px"

},

{

field: "Title"

}

]

});

});

function detailInit(e) {

$("<div/>").appendTo(e.detailCell).kendoGrid({

dataSource: {

type: "odata",

transport: {

read: "http://demos.kendoui.com/service/Northwind.svc/Orders"

},

serverPaging: false,

serverSorting: false,

serverFiltering: false,

pageSize: 5,

filter: { field: "EmployeeID", operator: "eq", value: e.data.EmployeeID }

},

columns: [

{ field: "OrderID", width: "70px" },

{ field: "ShipCountry", title:"Ship Country", width: "110px" },

{ field: "ShipAddress", title:"Ship Address" },

{ field: "ShipName", title: "Ship Name", width: "200px" }

]

});

}

*/

</style>

</div>

<br/>

<div class="console"></div>

</body>

</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: