1

Buenas, a ver si me pueden ayudar: Tengo una petición ajax tal qué:

function getData(){
            $.ajax({
                url: url_serv,
                type: 'GET',
                dataType: 'json',
                success: function(data){
                    imprimir(data);
                }

.... en imprimir me hace lo siguiente:

function imprimir(datos) {
            $('#miTable').DataTable({
                data: datos,
                columns:[
                    {  "data": "id"     },
                    {  "data": "name"   },
                    {  "data": "publish"},
                    {  "render": 
                        function ( data, type, row ) {
                            Aquí metere el boton para modificar y que invoque a Dialog.
                            ....código faltante....
                        }
                    }
                 ]
            });
        }

Tengo que añadir una sexta columna que sea un botón para modificar cualquiera de las filas, se supone que al pulsar ese botón, sale un dialogo con la api Dialog de JQuery y los datos (El dialog ya lo tengo creado). Pero para modificar la fila o dato, tengo que utilizar "render"... y luego ahí hacer una petición put al servidor para modificarlo, pero estoy perdido en como hacerlo.

¿Alguien me puede ayudar o indicar un poco por donde tirar?

Código HTML:

<body>
    <button id="cargar">Get JSON data</button>

<table id="miTable" width="100%"></table>
    <div id="dialog-form" title="Modificar pelicula">
        <p> Modifique los campos: </p>
        <form>
            <fieldset>
                <label for="id">ID:</label>
                <input type="text" name="id" id="id">
                <label for="name">Nombre:</label>
                <input type="text" name="name" id="name">
                <label for="publish">Publicación:</label>
                <input type="date" name="publicacion" id="publish">

            </fieldset>
        </form>
    </div>
</body>
3
  • ¿puedes añadir la parte html de tú código?
    – nachfren
    Commented el 27 ene. 2017 a las 9:19
  • Añadido en la pregunta.
    – KikeSP
    Commented el 27 ene. 2017 a las 9:46
  • Hola, una consulta para ayudarte: ¿que estas usando en tu back end php? Commented el 4 sept. 2022 a las 16:25

2 respuestas 2

0

esta es la columna o el boton que te falta.

{"defaultContent":'<button type="button" class="editar btn btn-link" data-
toggle="modal" data-target=".bd-example-modal-lg"><i class="md md-edit"></i>
</button>'
},

seria asi

 function imprimir(datos) {
        $('#miTable').DataTable({
            data: datos,
            columns:[
                {  "data": "id"     },
                {  "data": "name"   },
                {  "data": "publish"},
                {"defaultContent":'<button type="button" class="editar btn btn-link" data-
toggle="modal" data-target=".bd-example-modal-lg"><i class="md md-edit"></i>
</button>'
},
                }
             ]
        });
    }

se que quieres agregar el botón. pero no entendí lo demás si te puedes explicar un poquito mas claro de lo que quieres hacer amigo te podría ayudar.

0
var table = $(".datatable").DataTable({
    "ajax": {
        url: "url_archivo",
        "dataSrc": ""
    },
    "columns": [{
        "data": "id"
    }, 
       {  "data": "name"   },
       {  "data": "publish"}, {
        "defaultContent": '<button id="btn_editar" data-toggle="modal" data-target="#formulario" style="display: block;" class="w-100 btn btn-warning btn-sm" ><i class="fa fa-pencil"></i></button>'
    },],
    "language": {
        "url": "' . $this->baseurl . 'includes/datatables/Spanish.json"
    },
    "lengthMenu": [
        [10, 15, 20, -1],
        [10, 15, 20, "All"]
    ]
});
$(".datatable tbody").on("click", "#btn_editar", function () {
    var data = table.row($(this).parents("tr")).data();
    if (data == undefined) {
        var selected_row = $(this).parents("tr");
        if (selected_row.hasClass("child")) {
            selected_row = selected_row.prev();
        }
        var rowData = $(".datatable").DataTable().row(selected_row).data();
        fun_editar(rowData["id"]);
    } else {
        fun_editar(data["id"]);
    }
});

Fíjate en el código que te comparto, en el se añade un boton con id "btn_editar" que al presionarse llama al modal que se llama "formulario", y líneas mas abajo se llama al evento clic en el botón "btn_editar", lo que esta contenido sirve para extraer el "id" del registro.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.