var pedido = {

    cliente: null,

    fechaEntrega: null,

    entregas: new Array(),

};

​

function agregarMaterial (e){

    var entrega = e.data;

    var material = {

        id: entrega.form.id.val(),  

        codigo: entrega.form.codigo.val(),  

        nombre: entrega.form.nombre.val(),  

        cantidad: entrega.form.cantidad.val(),

        peso: entrega.form.peso.val(),

        acc: " ",

        sel: ""

    };

    entrega.materiales

        .row.add(material)

        .draw(false);

}

​

function tablaMaterialesSelectHandler (e, dt, type, indexes){

    var btnEliminar = e.data.form.btnEliminar;

    var sel = e.data.materiales.rows('.selected').data().length;

    if (sel > 0){

        btnEliminar.find('span').html(' (' + sel + ')');

        if (!btnEliminar.is(':visible'))

            btnEliminar.show();

    } else {

        btnEliminar.hide();

    }

}

​

function tablaMaterialesSelectHandler2 (e, dt, type, indexes){

    var btnEliminar = $('#btn-eliminar-material');

    var sel = dt.rows('.selected').data().length;

    if (sel > 0){

        btnEliminar.find('span').html(' (' + sel + ')');

        if (!btnEliminar.is(':visible'))

            btnEliminar.show();

    } else {

        btnEliminar.hide();

    }

}

​

function addEntrega(){

​

    var pedido = window.pedido;

    var i = pedido.entregas.length + 1;

    var entrega = {

        dom: $('#entrega-x').clone(true,true),

        origen: null,

        destino: null,

        materiales: null,

        form: {

            id: null,

            codigo: null,

            nombre: null,

            cantidad: null,

            peso: null,

            btnAgregar: null,

            btnEliminar: null

        },

        bultos: 0,

        peso: 0

    };

    // Nombrado de elementos

    entrega.dom.attr('id', 'entrega-' + i);

    // Contenedor de todo el detalle

    entrega.origen = entrega.dom.find('#entrega-x-detalle').attr('id', 'entrega-' + i + '-detalle');

    // Datos de origen y destino

    entrega.origen = entrega.dom.find('#entrega-x-origen')

        .attr('id', 'entrega-' + i + '-origen')

        .attr('data-parsley-errors-container', 'entrega-' + i + '-origenErrorContainer');

    entrega.dom.find('#entrega-x-origenErrorContainer').attr('id', 'entrega-' + i + '-origenErrorContainer');

    entrega.destino = entrega.dom.find('#entrega-x-destino')

        .attr('id', 'entrega-' + i + '-destino')

        .attr('data-parsley-errors-container', 'entrega-' + i + '-destinoErrorContainer');

    entrega.dom.find('#entrega-x-destinoErrorContainer').attr('id', 'entrega-' + i + '-destinoErrorContainer');

    // Contenedor de los materiales

    entrega.dom.find('#entrega-x-materiales').attr('id', 'entrega-' + i + '-materiales');

    // DataTable de los materiales para la entrega-i

    entrega.materiales = entrega.dom.find('#entrega-x-materiales-tabla').attr('id', 'entrega-' + i + '-materiales-tabla');

    // Inputs y controles del fomulario de carga de materiales a la tabla

    entrega.form.id = entrega.dom.find('#material-id').attr('id', 'material-' + i + '-id');

    entrega.form.codigo = entrega.dom.find('#material-codigo').attr('id', 'material-' + i + '-codigo');

    entrega.form.nombre = entrega.dom.find('#material-nombre').attr('id', 'material-' + i + '-nombre');

    entrega.form.cantidad = entrega.dom.find('#material-cantidad').attr('id', 'material-' + i + '-cantidad');

    entrega.form.peso = entrega.dom.find('#material-peso').attr('id', 'material-' + i + '-peso');

    entrega.form.btnAgregar = entrega.dom.find('#btn-agregar-material').attr('id', 'btn-agregar-material-' + i);

    entrega.form.btnEliminar = entrega.dom.find('#btn-eliminar-material').attr('id', 'btn-eliminar-material-' + i);

    entrega.form.btnEliminar.hide();

    // Agrego la entrega a la vista y la hago visible

    $('#entregas-list').prepend(entrega.dom);

    // Inicialización de la tabla de carga de materiales

    entrega.materiales = entrega.materiales.DataTable({

        dom:

            "<'row'<'col-sm-12'tr>>" +

            "<'row'<'col-sm-12 col-md-5'i><'col-sm-12 col-md-7'p>>",

        pageLength: 25,

        lengthMenu: [[10, 25, 50, 100, 200, -1], [10, 25, 50, 100, 200, "Todo"]],

        fixedHeader: true,

        orderCellsTop: true,

        processing: true,

        retrieve: true,

        select: {

            style: 'multi'//,

            //selector: 'td:first-child'

        },

        autoWidth: true,

        order: [[ 0, 'desc' ]],

        language: {

            searchPlaceholder: 'Buscar...',

            sProcessing:     "<span style='color: white;font-size: 20px;'>CARGANDO...</span>",

            sLengthMenu:     "_MENU_ registros por pag.",

            sZeroRecords:    "No se encontraron resultados",

            sEmptyTable:     "No hay datos disponibles en la tabla",

            sInfo:           "Items del _START_ al _END_ de _TOTAL_ items",

            sInfoEmpty:      "",

            sInfoFiltered:   "",

            sInfoPostFix:    "",

            sSearch:         "",

            sUrl:            "",

            sInfoThousands:  ",",

            sLoadingRecords: "Cargando...",

            oPaginate: {

                sFirst:    "Primero",

                sLast:     "Último",

                sNext:     "Siguiente",

                sPrevious: "Anterior"

            },

            oAria: {

                sSortAscending:  ": Activar para ordenar la columna de manera ascendente",

                sSortDescending: ": Activar para ordenar la columna de manera descendente"

            },

            buttons: {

                copy: "Copiar",

                colvis: "Visibilidad"

            },

            select: {

                rows: {

                    _: "%d items seleccionados",

                    0: "",

                    1: "1 item seleccionado"

                }

            }

        },

        columns: [

            { data: 'id' },

            { data: 'sel' },

            { data: 'codigo' },

            { data: 'nombre' },

            { data: 'cantidad' },

            { data: 'peso' },

            { data: 'acc' }      

        ],

        columnDefs: [

            {

                "targets": [1],

                "orderable": false,

                "searchable": false//,

                //"className": 'select-checkbox'

            },

            {

                "targets": [0],

                "visible": false,

                "searchable": false

            },          

            {

                "targets": [6],

                "searchable": false,

                "orderable": false

            }

        ]

    });

    // Evento en boton para agregar materiales

    entrega.form.btnAgregar.on('click', entrega, agregarMaterial);

    // Agrego la entrega al pedido (variable global)

    pedido.entregas.push(entrega);

    // Eventos de selección materiales en el DataTable

    entrega.materiales.on('select.dt', entrega, tablaMaterialesSelectHandler);

    entrega.materiales.on('deselect.dt', entrega, tablaMaterialesSelectHandler);

    entrega.dom.show();

}

​

function initTablaEjemplo(){

    var tablaMateriales = $("#entrega-x-materiales-tabla");

    tablaMateriales.DataTable({

        dom:

            "<'row'<'col-sm-12'tr>>" +

            "<'row'<'col-sm-12 col-md-5'i><'col-sm-12 col-md-7'p>>",

        pageLength: 50,

        lengthMenu: [[10, 25, 50, 100, 200, -1], [10, 25, 50, 100, 200, "Todo"]],

        fixedHeader: true,

        orderCellsTop: true,

        processing: true,

        retrieve: true,

        select: {

            style: 'multi'//,

            //selector: 'td:first-child'

        },

        autoWidth: true,

        order: [[ 0, 'desc' ]],

        language: {

            searchPlaceholder: 'Buscar...',

            sProcessing:     "<span style='color: white;font-size: 20px;'>CARGANDO...</span>",

            sLengthMenu:     "_MENU_ registros por pag.",

            sZeroRecords:    "No se encontraron resultados",

            sEmptyTable:     "No hay datos disponibles en la tabla",

            sInfo:           "Items del _START_ al _END_ de _TOTAL_ items",

            sInfoEmpty:      "",

            sInfoFiltered:   "",

            sInfoPostFix:    "",

            sSearch:         "",

            sUrl:            "",

            sInfoThousands:  ",",

            sLoadingRecords: "Cargando...",

            oPaginate: {

                sFirst:    "Primero",

                sLast:     "Último",

                sNext:     "Siguiente",

                sPrevious: "Anterior"

            },

            oAria: {

                sSortAscending:  ": Activar para ordenar la columna de manera ascendente",

                sSortDescending: ": Activar para ordenar la columna de manera descendente"

            },

            buttons: {

                copy: "Copiar",

                colvis: "Visibilidad"

            },

            select: {

                rows: {

                    _: "%d items seleccionados",

                    0: "",

                    1: "1 item seleccionado"

                }

            }

        },

        columns: [

            { data: 'id' },

            { data: 'sel' },

            { data: 'codigo' },

            { data: 'nombre' },

            { data: 'cantidad' },

            { data: 'peso' },

            { data: 'acc' }    

        ],

        columnDefs: [

            {

                "targets": [1],

                "orderable": false,

                "searchable": false,

                "className": 'select-checkbox'

            },

            {

                "targets": [0],

                "visible": false,

                "searchable": false

            },          

            {

                "targets": [6],

                "searchable": false,

                "orderable": false

            }

        ]

    });

    tablaMateriales.on('select', tablaMaterialesSelectHandler2);

    tablaMateriales.on('deselect', tablaMaterialesSelectHandler2);

    // Boton de agregar materiales

    $("#btn-agregar-material").on('click', function (){

        var tablaMateriales = $("#entrega-x-materiales-tabla").DataTable();

        var material = {

            id: $("#material-id").val(),    

            codigo: $("#material-codigo").val(),    

            nombre: $("#material-nombre").val(),    

            cantidad: $("#material-cantidad").val(),

            peso: $("#material-peso").val(),

            acc: " ",

            sel: ""

        };

        tablaMateriales

            .row.add(material)

            .draw(false);

    });

    // Boton eliminar materiales seleccionados

    $('#btn-eliminar-material').on('click', function (){

        var tablaMateriales = $("#entrega-x-materiales-tabla").DataTable();

​

        tablaMateriales.rows('.selected')

          .remove()

          .draw(false);

    });

    //$('#btn-eliminar-material').hide();

}

​

$(document).ready( function () {

  //initTablaEjemplo();

} );

/*

(function() {

    var url = 'https://debug.datatables.net/bookmarklet/DT_Debug.js';

    if (typeof DT_Debug != 'undefined') {

        if (DT_Debug.instance !== null) {

            DT_Debug.close();

        } else {

            new DT_Debug();

        }

    } else {

        var n = document.createElement('script');

        n.setAttribute('language', 'JavaScript');

        n.setAttribute('src', url + '?rand=' + new Date().getTime());

        document.body.appendChild(n);

    }

})();

*/