Go to specific Page number in DataTable Jquery


You want to go to specific page number using Jquery in DataTable Pagination then you can use below to apply.

1. Go to specific page number

    $(document.getElementById('idofTable').DataTable().table.fnPageChange( pagenumber );

2. Destroy DataTable
 
     var table = $(document.getElementById('idofTable').DataTable();
     table.fnDestroy();


That's all in this post.
Hope this helps..

Happy Coding..!!!!!!

Create CSV file using Jquery/ JavaScript


Below is sample Html and Jquery to create CSV using Jquery or Javascript.

if have issue in generating data containing comma (,) use below code.


<table id="tableId">

    <thead>

        <tr><th>Heading</th><th>Heading</th></tr>

    </thead>

    <tbody>

        <tr><td>cell</td><td>cell2</td></tr>

    </tbody>

</table>

<input type="button" value="select table" onclick="
createCSVFile(document.getElementById('tableId') );">
<script> function createCSVFile(tablehtml) { export_table_to_csv(tablehtml,'report.csv'); } function download_csv(csv, filename) { var csvFile; var downloadLink; // CSV FILE csvFile = new Blob([csv], {type: "text/csv"}); // Download link downloadLink = document.createElement("a"); // File name downloadLink.download = filename; // We have to create a link to the file downloadLink.href = window.URL.createObjectURL(csvFile); // Make sure that the link is not displayed downloadLink.style.display = "none"; // Add the link to your DOM document.body.appendChild(downloadLink); // Lanzamos downloadLink.click(); } function export_table_to_csv(html, filename) { var csv = []; var doc = document.implementation.createHTMLDocument("New Document"); var p = doc.createElement("p"); p.innerHTML = html; doc.body.appendChild(p); var rows = doc.querySelectorAll("table tr"); for (var i = 0; i < rows.length; i++) { var row = [], cols = rows[i].querySelectorAll("td, th"); for (var j = 0; j < cols.length; j++) { //check if data contains comma if(cols[j].innerText.trim().includes(',')){ row.push('"'+cols[j].innerText.trim() +'"'); } else{ row.push(cols[j].innerText.trim()); } } csv.push(row.join(",")); } // Download CSV download_csv(csv.join("\n"), filename); } </script>
Thanks for visiting.

If have any doubt or suggestions please comment.

Have happy coding. :) !!!!!!!

Copy to Clipboard using JavaScript.

Below is the easiest way to use JavaScript to copy element to Clipboard.



<table id="tableId">

    <thead>

        <tr><th>Heading</th><th>Heading</th></tr>

    </thead>

    <tbody>

        <tr><td>cell</td><td>cell2</td></tr>

    </tbody>

</table>



<input type="button" value="select table"

   onclick="copyElementContents( document.getElementById('tableId') );">


<script>

    function copyElementContents() {

            var el = $('*[id*=pbt]')[0]; // element to be copied to clipborad

            var body = document.body, range, sel;

            if (document.createRange && window.getSelection) {

                range = document.createRange();

                sel = window.getSelection();

                sel.removeAllRanges();

                try {

                    range.selectNodeContents(el);

                    sel.addRange(range);

                } catch (e) {

                    range.selectNode(el);

                    sel.addRange(range);

                }

                document.execCommand("copy");

                sel.removeAllRanges();

            } else if (body.createTextRange) {

                range = body.createTextRange();

                range.moveToElementText(el);

                range.select();

                range.execCommand("copy");

               

            }

        }

</script>
Enjoy Coding .

If have any doubt please comment.

Thanks.

Simple Loader image for Visualforce Page.

Hello guys,

I am gonna show you simple way to pop up loader image i.e status image for loading purpose using CSS and javascript function.

Using simple html div and Javascript you can create your status loader.

Below i am gonna show you simple html tag for it. you can call javascript function on onclick method to show loader and hide it on oncomplete.

ADD BELOW STYLE TO YOUR VF PAGE

#filter{ 
      display:none;
      background-image: url({!URLFOR($Resource.Static_Resource_Main,'Static_Resource_Main/loading32.gif')});
      z-index:10000;
      position:fixed;
      top:0%;left:0%;
      width:100%;
      height:100%;
      background-repeat:no-repeat;
      background-position:center;
      background-color: #ffffff;
      opacity:0.6;
      filter:alpha(opacity=50);
} 
Call startProces method when you call action( Controller function or any function after which you want to show loading image).

 

function startProcess()
{
      $('#filter').show();
}

function endProcess ()
{
      $('#filter').hide();
}   
Add below Div tag at the start of body tag or form.

<center>
    <div id="filter"></div>
</center>                        
startProcess will add display: block css to div.
endProcess  will hide the div.

Its just awsomeness of css.

Hope you will like it.
Enjoy coding....

How to know how many records where sucess and failed in batch class?

Lets say you want to send an email to some user on end of batch class that how many records where successfully executed and how many were failed to be executing.

Its very simply to do if you know the Object used to store data related to Async jobs.

There is called Standard object named AsyncApexJob which store information of jobs runs.

You can query on AsyncApexJob object to get record of currently run batch by its Batch id in finish method.

Fields to be Used:

JobItemsProcessed: Number of job items processed. Label is Batches Processed.
NumberOfErrors: Total number of batches with a failure. A batch is considered transactional, so any unhandled exceptions constitute an entire failure of the batch. Label is Failures.


global void finish(Database.BatchableContext BC) {
 
 
//Below code will fetch the job Id

 AsyncApexJob a = [Select a.TotalJobItems, a.Status, a.NumberOfErrors, a.JobType, a.JobItemsProcessed, a.ExtendedStatus, a.CreatedById, a.CompletedDate From AsyncApexJob a WHERE id = :BC.getJobId()];             

}
                            
you can use above code to send mail with details of job.

Hope you will find it useful.

For more details of Object visit:
Here