or
$J("#chart").kendoChart({
dataSource: {
data:source,
group: {
field: "MDetail",
dir: "asc"
},
sort: {
field: "Month",
dir: "asc"
}
},
theme: "blueOpal",
title: {
text: "Total Cost of Workforce for " + year
},
legend: {
position: "bottom"
},
seriesDefaults: {
type: "area",
format: "${0:0,000}"
},
series: [{
field: "Amount",
groupNameTemplate: "#= group.value # "
}],
valueAxis: {
labels: {
template: "#= kendo.format('$ {0:N0}', value / 1000000) # M"
},
majorUnit: 100000000,
line: {
visible: false
},
axisCrossingValue: -10
},
categoryAxis: {
field: "Month",
majorGridLines: {
visible: false
}
},
tooltip: {
visible: true,
format: "$ {0:0,000}"
}
});
<
div
id
=
"divEleWrapper"
>
@(Html.Kendo().Grid<
ElementViewModel
>()
.Name("gridEle")
.Columns(cols =>
{
cols.Bound(e => e.EleNum)
.ClientTemplate("<
span
id
=
'btn_#=EleID#'
onClick
=
'showDetail(#:EleID#)'
>#:EleNum#</
span
>");
cols.Bound(e => e.EleNum)
.ClientTemplate("<
span
id
=
'btn2_#=EleID#'
onClick
=
'showDetail2(#:EleID#)'
>#:EleNum#</
span
>");
})
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("GetElements", "Rating", pi).Type(System.Web.Mvc.HttpVerbs.Get))
)
)
</
div
>
<
div
>
@{Html.Kendo().Window()
.Name("winStandard")
.Title("Detail")
.Visible(false)
.Modal(true)
.Width(600)
.Height(400)
.Draggable()
.Scrollable(true)
.Render();
}
@{Html.Kendo().Window()
.Name("winStandard2")
.Title("Detail")
.Visible(false)
.Modal(true)
.Width(600)
.Height(400)
.Draggable()
.Content(@<
text
>
@{Html.RenderAction("GetStandard", "Standard", new { eID = 54805 });}
</
text
>).Render();
}
</
div
>
<
script
>
function showDetail(eID) {
var dialog = $("#winStandard").data("kendoWindow");
dialog.refresh({
url: "./Standard/GetStandard",
data: { eID: eID }
});
dialog.center().open();
}
function showDetail2(eID) {
$("#winStandard2").data("kendoWindow").center().open();
}
</
script
>
$(function() {
$("#grid_cate").kendoGrid({
dataSource: {
transport: {
read: "cate_lista.php",
update: {
url: "cate_lista.php",
type: "POST"
},
create: {
url: "cate_update.php",
dataType: 'jsonp',
type: "POST"
},
destroy: {
url: "cate_delete.php",
dataType: 'jsonp',
type: "POST"
},
},
schema: {
data: "data",
model: {
id: "recid",
fields: {
catego: { validation: { required: true} },
estatus: { validation: { required: true} },
foto: { validation: { required: true} }
}
}
}
},
columns: [
{ field: "catego",title: "CATEGORIA" },
{ field: "estatus",title: "ESTATUS", width: "100px" },
{ field: "foto",title: "FOTO", width: "160px" },
{ command: ["edit" , "destroy"], title: "OPCIONES", width: "200px" }],
editable: {
mode: "popup",
template: $("#popup_editor").html()
},
save: function(e,c){
e.model.set("foto",$("#uploadedFile").val());
},
scrollable: true,
navigable: true,
pageable: true,
selectable: true,
sortable: true,
toolbar: [ "create"]
});
});
function onSuccess(e){
$("#uploadedFile").val(e.files[0].name);
}
</
script
>
<
script
id
=
"popup_editor"
type
=
"text/x-kendo-template"
>
<
div
class
=
"customClass"
>ESPAÑOL</
div
>
<
div
class
=
"k-edit-label"
>
<
label
for
=
"Estatus"
>Estatus:</
label
>
</
div
>
<
select
option
name
=
'estatus'
>
<
option
value
=
'Activo'
>Activo</
option
>
<
option
value
=
'Pendiente'
>Pendiente</
option
>
</
select
>
<
br
>
<
div
class
=
"k-edit-label"
>
<
label
for
=
"Categoria"
>Categoria:</
label
>
</
div
>
<
input
type
=
"text"
class
=
"k-input k-textbox"
name
=
"catego"
data-bind
=
"value:catego"
>
<
div
class
=
"k-edit-label"
>
<
label
for
=
"Descripcion"
>Descripcion:</
label
>
</
div
>
<
textarea
cols
=
"47"
rows
=
"6"
name
=
"descripcion"
></
textarea
>
<
div
class
=
"customClass"
>INGLES</
div
>
<
div
class
=
"k-edit-label"
>
<
label
for
=
"Categoria_ing"
>Categoria:</
label
>
</
div
>
<
input
type
=
"text"
class
=
"k-input k-textbox"
name
=
"catego_ing"
data-bind
=
"value:catego_ing"
>
<
div
class
=
"k-edit-label"
>
<
label
for
=
"Descripcion_ing"
>Descripcion:</
label
>
</
div
>
<
textarea
cols
=
"47"
rows
=
"6"
name
=
"desc_ing"
></
textarea
>
<
div
class
=
"customClass"
>SELECCIONAR IMAGEN:</
div
>
<
image
src
=
"test/${foto}"
width
=
"100"
></
image
>
<
input
name
=
"foto"
type
=
"hidden"
id
=
'uploadedFile'
data-bind
=
"value: foto"
/>
<
input
type
=
"file"
id
=
"files"
data-role
=
"upload"
data-async
=
'{"saveUrl": "save.php","autoUpload": "true"}'
data-success
=
"onSuccess"
name
=
"files"
/>
</
script
>
<div data-role=
"view"
id=
"foo"
data-title=
"trest1"
>
<ul data-role=
"listview"
>
<li>
<span>test</span>
<input id=
"slider"
class=
"balSlider"
value=
"0"
/>
<a data-role=
"button"
>Foo</a>
<input type=
"checkbox"
data-role=
"switch"
/>
<a data-role=
"button"
>Foo</a>
<input type=
"checkbox"
data-role=
"switch"
/>
<li>
<a data-role=
"button"
>Foo</a>
<a data-role=
"button"
>Foo</a>
<input type=
"checkbox"
data-role=
"switch"
/>
<a data-role=
"button"
>Foo</a>
<input type=
"checkbox"
data-role=
"switch"
/>
</li>
</ul>
public ActionResult Meeting_Read([DataSourceRequest]DataSourceRequest request)
{
using (var ola = new OnlineActionsEntities())
{
IQueryable<
Meeting
> meetings = ola.Meetings;
DataSourceResult result = meetings.ToDataSourceResult(request);
return Json(result);
}
}
@(Html.Kendo().Grid<
AdventureWorks.Models.Meeting
>()
.Name("grid")
.DataSource(dataSource => dataSource // Configure the grid data source
.Ajax() // Specify that ajax binding is used
.Read(read => read.Action("Meetings_Read", "Home")) // Set the action method which will return the data in JSON format
)
.Columns(columns =>
{
// Create a column bound to the ProductID property
columns.Bound(meeting => meeting.ID);
// Create a column bound to the ProductName property
columns.Bound(meeting => meeting.Title);
})
.Pageable() // Enable paging
.Sortable() // Enable sorting
)