<%@ Page Title="" Language="C#" MasterPageFile="~/Layout.Master" AutoEventWireup="true" CodeBehind="capacitaciones.aspx.cs" Inherits="SCPServicio.capacitacion.capacitaciones" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="SidebarContent" runat="server">
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="MainContent" runat="server">
<script type="text/javascript">
var listInstructores = <%= gridValuesInstructores%>;
</script>
<h1>Capacitaciones</h1>
<h2>Programadas</h2>
<div id="form-container">
<div class="selector">
<select id="cbInstructor" style="width: 400px;"></select>
</div>
</div>
<div id="capacitacionGrid"></div>
<h2>Por programar</h2>
<div id="planificacionGrid"></div>
</asp:Content>
<asp:Content ID="Content4" ContentPlaceHolderID="ScriptsContent" runat="server">
<script type="text/javascript">
"use strict";
var capacitacionCommand = {
field: "",
title: "",
template: '<a class="k-button k-button-icontext k-grid-edit" href="/capacitacion/ver.aspx?id=#= idcapacitacion #"><span class="k-icon k-edit"></span>Ver</a>'
};
var planificacionCommand = {
field: "",
title: "",
template: '<a class="k-button k-button-icontext k-grid-edit" href="/capacitacion/finalizarplanificacion.aspx?id=#= idplanificacion #"><span class="k-icon k-edit"></span>Programar</a>'
};
$(function () {
$("#cbInstructor").kendoDropDownList({
dataTextField: "text",
dataValueField: "value",
dataSource: listInstructores,
optionLabel: "Seleccionar...",
valuePrimitive: "true",
select: onSelect
});
function onSelect(e) {
var dataItem = this.dataItem(e.item.index());
if (dataItem.value === "")
return false;
alert(dataItem.value + ":" + dataItem.text);
var entityGrid = $("#capacitacionGrid").data("kendoGrid");
entityGrid.dataSource.transport.options.read.url = "/Servicio.svc/vistaplacap/idinstructor/" + dataItem.value;
entityGrid.dataSource.page(1); //read implicito
return false;
};
///////////////////////////////////////////////////////////////////////
//datasources y grid de capacitacion
var apiCapacitacionUrl = "/Servicio.svc/vistaplacap/idinstructor/-1",
apiPlanificacionUrl = "/Servicio.svc/planificacion";
var capacitacionDataSource = new kendo.data.DataSource({
transport: {
create: {
url: apiCapacitacionUrl,
type: "POST",
contentType: "application/json; charset=utf-8"
},
read: apiCapacitacionUrl,
update: {
url: apiCapacitacionUrl,
type: "POST",
contentType: "application/json; charset=utf-8"
},
destroy: {
url: apiCapacitacionUrl,
type: "DELETE",
contentType: "application/json; charset=utf-8"
}
},
schema: {
data: "Data",
total: "Count",
model: {
id: "idcapacitacion",
fields: {
idcapacitacion: { editable: false, defaultValue: -1 },
flo_nombre: { editable: false },
cur_nombre: { editable: false },
cap_fecha: { type: "date" },
pla_fecha: { type: "date" }
}
}
},
pageSize: 15,
serverPaging: true
});
$("#capacitacionGrid").kendoGrid({
columns: [
{ field: "flo_descripcion", title: "Flota" },
{ field: "cur_nombre", title: "Curso" },
{ field: "cap_fecha", title: "Fecha", format: "{0:dd-MM-yyyy}" },
capacitacionCommand
],
dataSource: capacitacionDataSource,
pageable: {
refresh: true,
messages: {
display: " {0}-{1} de {2} elementos",
empty: "No hay elementos"
}
},
sortable: true
});
//datasources y grid de planificacion
var planificacionDataSource = new kendo.data.DataSource({
transport: {
create: {
url: apiCapacitacionUrl,
type: "POST",
contentType: "application/json; charset=utf-8"
},
read: apiCapacitacionUrl,
update: {
url: apiCapacitacionUrl,
type: "POST",
contentType: "application/json; charset=utf-8"
},
destroy: {
url: apiCapacitacionUrl,
type: "DELETE",
contentType: "application/json; charset=utf-8"
}
},
schema: {
data: "Data",
total: "Count",
model: {
id: "idplanificacion",
fields: {
idplanificacion: { editable: false, defaultValue: -1 },
flo_descripcion: { editable: false },
cur_nombre: { editable: false },
pla_fecha: { type: "date" }
}
}
},
pageSize: 15,
serverPaging: true
});
$("#planificacionGrid").kendoGrid({
columns: [
{ field: "flo_descripcion", title: "Flota" },
{ field: "cur_nombre", title: "Curso" },
{ field: "pla_fecha", title: "Fecha", format: "{0:dd-MM-yyyy}" },
planificacionCommand
],
dataSource: capacitacionDataSource,
pageable: {
refresh: true,
messages: {
display: " {0}-{1} de {2} elementos",
empty: "No hay elementos"
}
},
sortable: true
});
});
</script>
</asp:Content>
