Error in Uncaught TypeError: Can not read property of undefined

I have a script with jQuery in which performs the 'CRUD' with a form and DataTables .

To load data the table I use the following method:

var cargarDatos = function () {
$("#update_container").slideUp();
$("#add_container").slideUp();
var table = $('#dt_usuarios').DataTable({
    "destroy": true,
    "ajax": {
        url: "php/listar_usuarios.php",
        dataSrc: 'data'
    },
    "columns": [
        { "data" : "nombre" },
        { "data" : "apellido" },
        { "data" : "correo" },
        { "data" : "rol" },
        { "defaultContent" : "<button type='button' class='editar btn btn-sm btn-primary'><i class='fa fa-pencil-square-o'></i>Editar</button> <button type='button' class='eliminar btn btn-sm btn-danger' data-toggle='modal' data-target='#modalEliminar' ><i class='fa fa-trash-o'></i> Borrar</button>" }
    ],
    "language": espaniol
});
cargar_datos_editar("#dt_usuarios tbody", table);
cargar_datos_eliminar("#dt_usuarios tbody", table);
}

In this way everything is loaded in a correct way.
To edit I have to get the data of the row that has been selected and pass it to a form to be able to edit the fields that I need; the following method performs its work equally well:

var cargar_datos_editar = function (tbody, table) {    
$(tbody).on("click", "button.editar", function () {              
    $("#update_container").slideDown();
    var data = table.row( $(this).parents( "tr" ) ).data();
    console.log(data);
    var id_usuario = $("#actualizar #edit_id_usuario").val(data.id_usuario),
        nombre = $("#nombre").val(data.nombre),
        apellido = $("#apellido").val(data.apellido),
        correo = $("#correo").val(data.correo),
        rol = $("#rol").val(data.rol),
        opcion = $("#actualizar #edit_opcion").val("editar");
});
}

Once the data of the table has been loaded in the form, if the user presses the button to update, a request is made by ajax, which edits the record and updates it in a BD. The method is as follows

var editar = function () {
$("#actualizar").on("submit", function (event) {
    event.preventDefault();
    var opcion = $("#actualizar #edit_opcion").val(),
        nombre = $("#actualizar #nombre").val(),
        apellido = $("#actualizar #apellido").val(),
        rol = $("#actualizar #rol").val(),
        correo = $("#actualizar #correo").val(),            
        id_usuario = $("#actualizar #edit_id_usuario").val(),
        vacio = "";
    $.ajax({
        method: "POST",
        url: "php/usuario_funciones.php",
        data: {
            "id_usuario": id_usuario,
            "nombre": nombre,
            "apellido": apellido,
            "rol": rol,
            "correo": correo,
            "contrasenia": vacio,
            "opcion": opcion
        }
    }).done(function (info) {
        var json_info = JSON.parse(info);
        console.log(json_info);
        mostrar_mensaje(json_info);
        limpiar_datos_editar();
        cargarDatos();
    });
});
};

The process is done correctly, until I edit one more record and the error it shows is the following:

Error in the line that assigned data to the variables to pass them to the form:

var cargar_datos_editar = function (tbody, table) {    
$(tbody).on("click", "button.editar", function () {              
    $("#update_container").slideDown();
    var data = table.row( $(this).parents( "tr" ) ).data();
    console.log(data); //Impreme 'undefined cuando se ejecuta por segunda vez'
    var id_usuario = $("#actualizar #edit_id_usuario").val(data.id_usuario), //linea de error
        nombre = $("#nombre").val(data.nombre),
        apellido = $("#apellido").val(data.apellido),
        correo = $("#correo").val(data.correo),
        rol = $("#rol").val(data.rol),
        opcion = $("#actualizar #edit_opcion").val("editar");
});
};

If in the edit method I delete the line that loads the loadloads (); it lets me edit the records without any problem, but obviously it does not load the data from the table.