How to customize Data Tables

-
Customizing Data Tables - 

In the below scenario i have changed data table button names, customize paginate, customize search, customize infoFiltered etc. You just need to get your data from a data source and apply the below code.

Code - 

$("#tbl").DataTable({
        dom: 'Bfrtip',
        buttons: [{
          extend: 'pdf',
          text: 'Pdf'
        }, {
          extend: 'excel',
          text: 'Excel'
        }],
        language: {
          paginate: {
            next: '→', // or '→'
            previous: '←' // or '←' 
          },
          search: '🔎',
          info: "Resultados _START_ a _END_ de _TOTAL_ entradas",
          infoEmpty: "Resultados 0 a 0 de 0 entries",
          emptyTable: "No hay datos disponibles en la tabla",
          infoFiltered: "(filtrado de _MAX_ entradas totales)",
          zeroRecords: "No se encontraron registros coincidentes"
        }
 }); 





Comments

Post a Comment

Popular posts from this blog

How to Customize exported excel's cell background color in Datatables

-
Image
Customize exported excel's cell background color in Datatables In this post i will walk you through how we can customize exported excel's cell background color in datatables. For this we need make changes in the buttons.html5.js file. you may refer below links for more info.  excelHtml5  and  how can i change the background color Follow below steps and make changes in buttons.html5.js file 1. Create your own fills.  '<fills count="11">'+ '<fill>'+ '<patternFill patternType="none" />'+ '</fill>'+ '<fill>'+ // Excel appears to use this as a dotted background regardless of values but '<patternFill patternType="none" />'+ // to be valid to the schema, use a patternFill '</fill>'+ '<fill>'+ '<patternFill patternType="solid">'+ '<fgColor rgb="FFD9D9D9" /...
Read more

Clear DataTable on button click

-
Image
How to clear DataTable on button click In this post we will learn how we can clear a datatable on a jQuery event. By click on "btnReset" we have to call datatable's destroy method to completely clear a datatable. We may need to clear a datatable on an event. Please follow the below code to achieve the same. HTML - <table id="tblResourcesData" class="display" width="100%" cellspacing="0">           <thead>               <tr>                   <th>Title</th>                   <th>Region</th>                 <th>Country</th>                <th>Email</th>             </tr>           </thead>  </table...
Read more

Upload multiple attachments to SharePoint List Item using REST API jQuery, along with People Picker Column

-
Image
How to Upload multiple attachments to SharePoint List Item using REST API jQuery, along with People Picker Column In this post I will show you how we can upload multiple attachments on a SharePoint List item, I am taking a People Picker field here where you can store multiple SharePoint users along with other columns. Please refer the below code, It would be very helpful for you to implement the same in your projects. In the below code you will find how you can clear a input type file and people picker field.  JS Files need to be used -   <!-- SharePoint Specific Javascript Start -->       <!--script type="text/javascript" src="/_layouts/15/sp.runtime.js"></script-->         <script type="text/javascript" src="/_layouts/15/sp.js"></script>         <script type="text/javascript" src="/_layouts/15/1033/strings.js"></script>         <scr...
Read more