KoolReport's Forum

Official Support Area, Q&As, Discussions, Suggestions and Bug reports.
Forum's Guidelines

Dashboard loader #3274

Open Komuraiah A opened this topic on on Mar 29 - 3 comments

Komuraiah A commented on Mar 29

hi team,

am trying to add the loader icon in dashboard report and here is the code

<?php


use koolreport\dashboard\inputs\Button; 
use koolreport\dashboard\notifications\Confirm; 
use koolreport\dashboard\notifications\Alert;

class unitgtdataget extends Button
{
    protected function actionSubmit($request, $response) 
    {
		
        $brnch = '$("#unitgtbranchfilter").val()';
        $yearname = '$("#unitgtyearfilter").val()';
        $selectedMonths = '$("#unitgtmonthfilter").val()';
		
		
         //print_r($selectedMonths);
        $jsCode = "
            var brnch = $brnch;
            var yearname = $yearname;
            var selectedMonths = $selectedMonths;
            
            if (selectedMonths.length === 1) {
                var monthid = selectedMonths[0];
                
                $.ajax({
                    type: 'POST',
                    url: 'ajax/gtdataget.php',
                    async: false,
                    data: { brnch: brnch, yearname: yearname, monthid: monthid },
                    success: function(data) {
                        alert('Data Inserted');
                    }
                });
            } else {
                alert('Please select a single month only.');
                return false; // Prevent the confirmation message from showing
            }
        ";
		

        return Confirm::info("Get Data Confirmation")
			->confirmButtonText("I am sure")
                        ->onConfirm($jsCode);
    }
}

and am trying to add the loader after the AJAX call has been initiated but before it completes, to indicate that data is being fetched show loader and hide after load data fetched all

KoolReport commented on Apr 3

Does it work? Do you have any issue when trying to run the jsCode after "I am sure" button is hit.

Komuraiah A commented on Apr 3

after hit the "I am sure" button working fine, but am trying to add a loader gif icon after the AJAX call has been initiated but before it completes, to indicate that data is being fetched, show loader and hide after load data fetched all

KoolReport commented on Apr 3

You can call the "showLoader(bool)" function of dashboard client. Something like this:

        $jsCode = "
            var brnch = $brnch;
            var yearname = $yearname;
            var selectedMonths = $selectedMonths;
            
            if (selectedMonths.length === 1) {
                var monthid = selectedMonths[0];
                
                $.ajax({
                    type: 'POST',
                    url: 'ajax/gtdataget.php',
                    async: false,
                    data: { brnch: brnch, yearname: yearname, monthid: monthid },
                    success: function(data) {
                        showLoader(false); // Turn off loader
                        alert('Data Inserted');
      
                    }
                });
                showLoader(true); // Turn on loader
            } else {
                alert('Please select a single month only.');
                return false; // Prevent the confirmation message from showing
            }
        ";

Build Your Excellent Data Report

Let KoolReport help you to make great reports. It's free & open-source released under MIT license.

Download KoolReport View demo
help needed

Dashboard