How do I add button on each row in datatable?

前端 未结 7 1338
醉话见心
醉话见心 2020-11-30 23:54

I am newbie for DataTables. I want to add button on each row for edit and delete(like below image)

\"enter

7条回答
  •  一整个雨季
    2020-12-01 00:07

    I contribute with my settings for buttons: view, edit and delete. The last column has data: null At the end with the property defaultContent is added a string that HTML code. And since it is the last column, it is indicated with index -1 by means of the targets property when indicating the columns.

    //...
    columns: [
        { title: "", "data": null, defaultContent: '' }, //Si pone da error al cambiar de paginas la columna index con numero de fila
        { title: "Id", "data": "id", defaultContent: '', "visible":false },
        { title: "Nombre", "data": "nombre" },
        { title: "Apellido", "data": "apellido" },
        { title: "Documento", "data": "tipo_documento.siglas" },
        { title: "Numero", "data": "numero_documento" },
        { title: "Fec.Nac.", format: 'dd/mm/yyyy', "data": "fecha_nacimiento"}, //formato
        { title: "Teléfono", "data": "telefono1" },
        { title: "Email", "data": "email1" }
        , { title: "", "data": null }
    ],
    columnDefs: [
        {
            "searchable": false,
            "orderable": false,
            "targets": 0
        },
        { 
          width: '3%', 
          targets: 0  //la primer columna tendra una anchura del  20% de la tabla
        },
        {
            targets: -1, //-1 es la ultima columna y 0 la primera
            data: null,
            defaultContent: '
    ' }, { orderable: false, searchable: false, targets: -1 } //Ultima columna no ordenable para botones ], //...

    enter image description here

提交回复
热议问题