domingo, 26 de octubre de 2014

spinner

http://www.telerik.com/forums/how-to-manually-show-and-hide-loading-or-spinning-image
http://stackoverflow.com/questions/21114819/kendo-ui-grid-not-showing-pinner-load-icon-on-initial-read
http://docs.telerik.com/kendo-ui/api/javascript/ui/ui#methods-progress
http://stackoverflow.com/questions/25082584/loading-icon-for-kendo-ui-grid
_______________
http://stackoverflow.com/questions/17793335/kendoui-chart-how-do-i-show-loading-animation
http://jsfiddle.net/OnaBai/kcptr/3/
***********
http://stackoverflow.com/questions/21114819/kendo-ui-grid-not-showing-pinner-load-icon-on-initial-read
***************
http://jsbin.com/uqOdehig/2/edit?html,output

solo enteros

Here is the function I use:
// Numeric only control handler
jQuery.fn.ForceNumericOnly =
function()
{
    return this.each(function()
    {
        $(this).keydown(function(e)
        {
            var key = e.charCode || e.keyCode || 0;
            // allow backspace, tab, delete, enter, arrows, numbers and keypad numbers ONLY
            // home, end, period, and numpad decimal
            return (
                key == 8 || 
                key == 9 ||
                key == 13 ||
                key == 46 ||
                key == 110 ||
                key == 190 ||
                (key >= 35 && key <= 40) ||
                (key >= 48 && key <= 57) ||
                (key >= 96 && key <= 105));
        });
    });
};
You can then attach it to your control by doing:
$("#yourTextBoxName").ForceNumericOnly();

http://stackoverflow.com/questions/995183/how-to-allow-only-numeric-0-9-in-html-inputbox-using-jquery

sábado, 25 de octubre de 2014

fechas en jquery

http://rawgit.com/milichev/FastDateFormat/master/fastDateFormat.js

Herramientas para identificar software en web

Les recomiendo esta extensión para su navegador. Les detecta todas las tecnologías que se emplean para las webs que están navegando: ejemplo, si está hecha con algún CMS, si tiene algún framework de Javascript, si usa algún plugin para tienda virtual, herramientas de análisis, etc.
https://wappalyzer.com/
http://builtwith.com/

viernes, 24 de octubre de 2014

url

http://stackoverflow.com/questions/13177426/how-to-destroy-bootstrap-modal-window-completely

JavaScript provides you many methods to retrieve and change the current URL which is displayed in browser's address bar. All these methods uses the Location object, which is a property of the Window object. You can create a new Location object that has the current URL as follows..
var currentLocation = window.location;
Basic Structure of a URL
<protocol>//<hostname>:<port>/<pathname><search><hash>
enter image description here
  1. Protocol -- Specifies the protocol name be used to access the resource on the Internet. (HTTP (without SSL) or HTTPS (with SSL))
  2. hostname -- Host name specifies the host that owns the resource. For example, www.stackoverflow.com. A server provides services using the name of the host.
  3. port -- A port number used to recognize a specific process to which an Internet or other network message is to be forwarded when it arrives at a server.
  4. pathname -- The path gives info about the specific resource within the host that the Web client wants to access. For example, stackoverflow.com/index.html.
  5. query -- A query string follows the path component, and provides a string of information that the resource can utilize for some purpose (for example, as parameters for a search or as data to be processed).
  6. hash -- The anchor portion of a URL, includes the hash sign (#).
With these Location object properties you can access all of these URL components
  1. hash -Sets or returns the anchor portion of a URL.
  2. host -Sets or returns the hostname and port of a URL.
  3. hostname -Sets or returns the hostname of a URL.
  4. href -Sets or returns the entire URL.
  5. pathname -Sets or returns the path name of a URL.
  6. port -Sets or returns the port number the server uses for a URL.
  7. protocol -Sets or returns the protocol of a URL.
  8. search -Sets or returns the query portion of a URL
Now If you want to change a page or redirect the user to some other page you can use the href property of the Location object like this
You can use the href property of the Location object.
window.location.href = "http://www.stackoverflow.com";
Demo Fiddle
Location Object also have these three methods
  1. assign() -- Loads a new document.
  2. reload() -- Reloads the current document.
  3. replace() -- Replaces the current document with a new one
You can use assign() and replace methods also to redirect to other pages like these
location.assign("http://www.stackoverflow.com");

location.replace("http://www.stackoverflow.com");
How assign() and replace() differs -- The difference between replace() method and assign() method(), is that replace() removes the URL of the current document from the document history, means it is not possible to use the "back" button to navigate back to the original document. So Use the assign() method if you want to load a new document, andwant to give the option to navigate back to the original document.
You can change the location object href property using jQuery also like this
$(location).attr('href',url);
And hence you can redirect the user to some other url.

miércoles, 22 de octubre de 2014

column ckeckbox

http://www.codeproject.com/Articles/606682/Kendo-Grid-In-Action

objetos en javascript son arreglos

http://librosweb.es/ajax/capitulo_3.html
http://chuwiki.chuidiang.org/index.php?title=Arrays_y_Objetos_en_JavaScript

arreglo de enlaces

http://blog.falafel.com/kendo-ui-grid-custom-columns-show-list-links/

Kendo Grid Conditional Column Templates - JSFiddle

http://jsfiddle.net/miguelerm/H6m7M/
http://blog.falafel.com/kendo-ui-grid-custom-columns-data-dependent-command-buttons/
http://jsfiddle.net/falafelsoftware/B8ynX/

busqueda

http://jsbin.com/iJunOsa/8/edit?html,js,output

modal y grid

http://refork.com/xeac
http://onabai.wordpress.com/2012/12/30/kendoui-grid-row-details/

sábado, 18 de octubre de 2014

viernes, 17 de octubre de 2014

servicios jquery y asp

http://www.mikesdotnetting.com/Article/96/Handling-JSON-Arrays-returned-from-ASP.NET-Web-Services-with-jQuery

KENDO UPLOAD FINAL WEB CONFIG

intro
http://docs.telerik.com/kendo-ui/web/upload/modes#asynchronous-mode
--------------------------------------------------------
http://stackoverflow.com/questions/24105556/large-file-in-kendo-ui-uploader
http://stackoverflow.com/questions/19421829/how-to-upload-a-file-with-kendo-uploader-and-using-ajax-request
http://blogs.visoftinc.com/2013/02/25/kendo-ui-upload-control-with-existing-files/
http://www.strathweb.com/2012/09/dealing-with-large-files-in-asp-net-web-api/
**********************************************************
http://www.codeproject.com/Articles/46745/Upload-files-using-an-HttpHandler
You can increase the file size being uploaded by adding the following to your web.config. TheexecutionTimeout is in seconds, and maxRequestLength is in bytes.
***************************************************

CONFIGURACION DE TELERIK
http://www.telerik.com/help/aspnet-ajax/upload-uploading-large-files.html


http://stackoverflow.com/questions/1690337/what-is-the-best-practice-for-storing-a-file-upload-to-a-memorystream-c
-------------------------------------------------------------------------------------------------------------------------
http://stackoverflow.com/questions/288612/how-to-increase-the-max-upload-file-size-in-asp-net
This setting goes in your web.config file. It affects the entire application, though... I don't think you can set it per page.
<configuration>
  <system.web>
    <httpRuntime maxRequestLength="xxx" />
  </system.web>
</configuration>
"xxx" is in KB. The default is 4096 (= 4 MB).
*****************
Upload.aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.IO;
using System.Web.Script.Serialization;

namespace SCPServicio.admin
{
    public partial class Upload : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            ProcessRequest();
        }

        public void ProcessRequest()
        {
            Response.Expires = -1;
            try
            {
                string formatdate = "yyyy_MM_dd";
                HttpPostedFile postedFile = Request.Files["files"];
                string savepath = Server.MapPath("fileupload/");
                string filename = DateTime.Now.ToString(formatdate) + "_" + Path.GetFileName(postedFile.FileName);
                if (!Directory.Exists(savepath))
                    Directory.CreateDirectory(savepath);
                postedFile.SaveAs(savepath + filename);

                Response.Clear();
                HttpContext.Current.Response.Flush(); // Sends all currently buffered output to the client.
                HttpContext.Current.Response.SuppressContent = true;  // Gets or sets a value indicating whether to send HTTP content to the client.
                HttpContext.Current.ApplicationInstance.CompleteRequest(); // Causes ASP.NET to bypass all events and filtering in the HTTP pipeline chain of execution and directly execute the EndRequest event.
              
                //arreglo parcial de System.Threading.ThreadAbortException: Thread was being aborted.
                //http://stackoverflow.com/questions/20988445/how-to-avoid-response-end-thread-was-being-aborted-exception-during-the-exce
                //http://stackoverflow.com/questions/62154/response-clear-in-asp-net-3-5
               //upload              
               //http://stackoverflow.com/questions/19254998/clearing-a-response-in-postback-to-download-text-file-from-button-click

            }
            catch (Exception ex)
            {
                Response.Write(ex.ToString());

            }
        }
    }
}
*************************
SubirArchivo.aspx
<%@ Page Title="" Language="C#" MasterPageFile="~/Layout.Master" AutoEventWireup="true" CodeBehind="SubirArchivo.aspx.cs" Inherits="SCPServicio.admin.SubirArchivo" %>
<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">
<div class="container-fluid">
    <div class="row-fluid">
        <div class=" offset6 span6">
            <div class="form-horizontal labels-forms">
                <div class="control-group">                            
                    <div class="controls">
                        <input name="files" id="archivoUploader"  type="file" />
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="row-fluid">
    <div id="gridListaItems">
    </div>
</div>
</asp:Content>
<asp:Content ID="Content4" ContentPlaceHolderID="ScriptsContent" runat="server">
<script>
    $("#archivoUploader").kendoUpload({
        async: {
            saveUrl: "Upload.aspx",
            autoUpload: true
        },
        success: function (e) {
            var filename = e.files[0].name;
            alert("archivo subido correctamente");
        },
        error: function (e) {
            alert("archivo subido correctamente");
        }
    });
</script>
</asp:Content>
****************
web.config
...
    <sessionState timeout="40"></sessionState>
    <httpRuntime maxRequestLength="702400" executionTimeout="3600" />
    
    <!--<httpRuntime maxRequestLength="102400" executionTimeout="3600" />-->
    



  </system.web>
...

javaserializar y subir archivos html y asp funciona

http://www.neuronasoft.net/2011/07/aspnet-subir-archivos-al-servidor-desde.html
http://panicoenlaxbox.blogspot.com/2010_11_01_archive.html

jueves, 16 de octubre de 2014

Prueba de form horizontal

       <div class="well panel">
            <div class="row-fluid">
                <div class="span6">
                    <div class="form-horizontal labels-forms">
                        <div class="control-group">
                            <label class="control-label" for="UsuarioId">Solicitado Por</label>
                            <div class="controls">
                                <input type="text" name="UsuarioId" id="UsuarioId" style="width:100%" readonly="readonly" />
                            </div>
                        </div>
                        <div class="control-group">
                            <label class="control-label" for="codigoId">C&oacute;digo</label>
                            <div class="controls">
                                <input type="text" name="codigoId" id="codigoId" value="" style="width:100%" readonly="readonly" />
                            </div>
                        </div>
                    </div>
                </div>
                <div class="span6">
                    <div class="form-horizontal labels-forms">
                        <div class="control-group">
                            <label class="control-label" for="plantaId">Fecha Solicitud:</label>
                            <div class="controls">
                                <input type="text" name="fechaSolicitud" id="fechaSolicitud" value="" style="width:100%" readonly="readonly" />
                            </div>
                        </div>
                        <div class="control-group">
                            <label class="control-label" for="estadoSolicitud">Estatus de Solicitud:</label>
                            <div class="controls">
                                <input type="text" name="estadoSolicitud" id="estadoSolicitud" value="" style="width:100%" readonly="readonly" />
                            </div>
                        </div>
                    </div>
                </div>
            </div><!-- End Row -->
        </div>

codigo fuente subir archivos GITHUB Y UPLOAD

https://github.com/tankovski/TelerikAcademy/tree/master/Asp.NetWebForms

kendo upload ppt

https://www.google.com.pe/url?sa=t&rct=j&q=&esrc=s&source=web&cd=3&cad=rja&uact=8&ved=0CCsQFjAC&url=http%3A%2F%2Fdownloads.academy.telerik.com%2Fsvn%2Fasp-net%2F2013%2FLectures%2F14.%2520File%2520Upload%2FFile-Upload-ASP.NET-Web-Forms.pptx&ei=t6o_VLTMFo7zgwTXroLoAQ&usg=AFQjCNFg3iLVZAYZe9vqeXtHZ9UG_HQJ-Q&sig2=MywnIIq1rNvClq3kI4MuBQ

viernes, 10 de octubre de 2014

jueves, 9 de octubre de 2014

Ordenacion local kendo grid

http://stackoverflow.com/questions/24507931/kendo-ui-grid-local-data-source-column-sort-by-default
http://stackoverflow.com/questions/24507931/kendo-ui-grid-local-data-source-column-sort-by-default

miércoles, 8 de octubre de 2014

TEXTO TODO EN MAYUSCULA LADO DEL CLIENTE CS JQUERY

MI SOLUCION: OJO QUE MEJOR NO HAY QUE GENERALIZAR MUCHO EN EL INPUT  DE TIPO TEXT YA QUE POR EJEMPLO EL LOGIN NECESITA DIFERENCIAR MAYUSCULAS Y  MINUSCULAS MEJOR SERIA CON UNA CLASE  por ejemplo una clase .uppercase

CSS
<style type="text/css">
input[type=text] {
    text-transform:uppercase;
}
</style>

JQUERY
<script type="text/javascript">
    $(function () {
        $("input[type=text]").keyup(function () {
            $(this).val($(this).val().toUpperCase());
        });

        $("#Button1").click(function () {
            alert($("#Text1").val());
        }
        );
       
    });
</script>

//PRUEBA
<body>
    <input id="Text1" type="text" />
    <input id="Button1" type="button" value="button" />
</body>

REFERENCIAS
http://stackoverflow.com/questions/9587542/how-to-control-or-change-all-the-text-to-upper-case
http://devhints.wordpress.com/2006/11/01/css-make-it-all-uppercaselowercase/

kendo blog lado del servidor

http://blogs.telerik.com/kendoui/posts/13-08-29/handling-server-side-validation-errors-in-your-kendo-ui-grid

jquery ready

http://learn.jquery.com/using-jquery-core/document-ready/

martes, 7 de octubre de 2014

Importante kendo grid eliminacion y closest

http://stackoverflow.com/questions/14524600/how-capture-destroy-event-in-kendo-ui-grids-when-click-is-done

Conversion C#

http://msdn.microsoft.com/en-us/library/1k20k614(v=vs.110).aspx

Validador date kendo fecha

http://stackoverflow.com/questions/24133819/default-date-format-of-javascript-jquery

Grid diversos estilos

Grid con plantilla diferente
http://demos.telerik.com/kendo-ui/datasource/index
filtro autocompletado
http://demos.telerik.com/kendo-ui/datasource/shared-datasource

Filtro fechas
http://jsfiddle.net/OnaBai/5bchz/81/
Filtro dropdownlist
http://jsfiddle.net/hd4Pq/6/


viernes, 3 de octubre de 2014

Container bootstrap

Containers

Bootstrap requires a containing element to wrap site contents and house our grid system. You may choose one of two containers to use in your projects. Note that, due to padding and more, neither container is nestable.
Use .container for a responsive fixed width container.
Copy
<div class="container">
  ...
</div>
Use .container-fluid for a full width container, spanning the entire width of your viewport.
Copy

<div class="container-fluid">
  ...
</div>
http://getbootstrap.com/css/
***************************************************************************************
http://www.tutosytips.com/4-complementando-el-grid-de-bootstrap-3/

jueves, 2 de octubre de 2014

QUERYSTRING PARAMETROS JAVASCRIPT Y C#

JAVASCRIPT
http://stackoverflow.com/questions/19491336/get-url-parameter-jquery
http://www.jquerybyexample.net/2012/06/get-url-parameters-using-jquery.html
http://www.w3schools.com/jsref/prop_loc_search.asp
http://w3lessons.info/2013/02/25/how-to-get-url-parameters-values-using-jquery/
C#
http://msdn.microsoft.com/es-es/library/system.web.httprequest.querystring%28v=vs.110%29.aspx
____

cap 01

<%@ 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>

Capacitaciones Version 1

<%@ 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>