datatable not working on ajax call

datatable not working on ajax call

kassakassa Posts: 2Questions: 0Answers: 0
edited December 2021 in DataTables

`I have created three files. one is for AJAX, another one is for JS and last one is for PHP

-- JS FILE --


function viewBranchDetails(){ var budjectNameID = document.getElementById('budjectNameIDB').value; var budjectHolder = document.getElementById('budjectHolder').value; var cboBranch = document.getElementById('cboBranch').value; var cboDuration = document.getElementById('cboDuration').value; var assignFrom = document.getElementById('assignFrom').value; var url = 'ajax/budjectAdmin.ajax.php?action=viewBranchDetails'; url +="&budjectNameID="+budjectNameID; url +="&budjectHolder="+budjectHolder; url +="&cboBranch="+cboBranch; url +="&cboDuration="+cboDuration; url +="&assignFrom="+assignFrom; var result = $.ajax({url:url,async:false}); document.getElementById('showBudgetDetails').innerHTML = result.responseText; } THIS IS MY JS. THROUGH THIS I WANT TO CREATE A DATA TABLE. BUT I COULDN'T DO THIS. HOW CAN I INCLUDE BELOW MENTION FUNCTION TO ABOVE viewBranchDetails() FUNCTION. $('#tblBudject').DataTable({ "paging": true, "lengthChange": false, "searching": false, "ordering": true, "info": true, "autoWidth": false, "responsive": true, }); });

-- AJAX FILE --

/* VIEW BRANCH WISE BUDGET DETAILS */
if($ResponceType=="viewBranchDetails"){
    try
    {
        $budjectNameID  = $_GET['budjectNameID'];
        $budjectHolder  = $_GET['budjectHolder'];
        $cboBranch      = $_GET['cboBranch'];
        $cboDuration    = $_GET['cboDuration'];
        $assignFrom     = $_GET['assignFrom'];
        $response = '';
        $response .= '<section class="content">
          <div class="container-fluid">
            <div class="row">
              <div class="col-sm-12">
                <div class="card card-primary">
                  <div class="card-body table-responsive p-0" id="tblBudjectHeadReset">
                  <div class="card-header">
                    <h3 class="card-title">Branch wise Budget Details</h3>
                  </div>
                  <div class="card-body">
                    <table id="tblBudject" class="table table-bordered table-hover">
                      <thead>
                      <tr>
                        <th style="text-align:center;">#</th>
                        <th style="text-align:center;">Company</th>
                        <th style="text-align:center;">Branch</th>
                        <th style="text-align:center;">Budject</th>
                        <th style="text-align:center;">BudjectHolder</th>
                        <th style="text-align:center;">Currency</th>
                        <th style="text-align:center;">Amount</th>
                        <th style="text-align:center;">Date From</th>
                        <th style="text-align:center;">Date To</th>
                        <th style="text-align:center;">Duration</th>
                        <th></th>
                      </tr>
                      </thead>
                      <tbody>';
                        $count = 1;
                        $sqlBudjectDetails = "SELECT finance_budget_accounts_info.strFinanceBudgetName AS budjectName,admin_branchinfo.strBranch AS branchName, finance_budget_accounts_header.dblBudgetAccountAmount AS budjectAmount,admin_users.strEmployee AS budjectHolder,finance_budget_accounts_header.intBudgetDuration, DATE(finance_budget_accounts_header.dtmBudgetAccountFrom) AS assignDateFrom, admin_currency.strCurrency,admin_companyinfo.strCompany,admin_companyinfo.strCompanyDisplayCode AS companyAccount,finance_budget_accounts_header.intFinanceBudgetHeaderId,DATE(finance_budget_accounts_header.dtmBudgetAccountTo) AS assignDateTo FROM finance_budget_accounts_header
                        INNER JOIN finance_budget_accounts_info ON finance_budget_accounts_header.intFinanceBudgetInfoId = finance_budget_accounts_info.intFinanceBudgetAccountId
                        INNER JOIN admin_branchinfo ON finance_budget_accounts_header.intFinanceBudgetBranchId = admin_branchinfo.intId
                        INNER JOIN admin_users ON finance_budget_accounts_header.intFinanceBudgetAccountHolder = admin_users.intId
                        INNER JOIN admin_currency ON finance_budget_accounts_info.intCurrency = admin_currency.intId
                        INNER JOIN admin_companyinfo ON admin_branchinfo.intCompanyId = admin_companyinfo.intId
                        WHERE finance_budget_accounts_header.intFinanceBudgetHeaderId IS NOT NULL ";
                        
                        if($budjectNameID!=''){ $sqlBudjectDetails .= " AND finance_budget_accounts_header.intFinanceBudgetInfoId = '$budjectNameID'"; }
                        
                        if($budjectHolder!=''){ $sqlBudjectDetails .= " AND finance_budget_accounts_header.intFinanceBudgetAccountHolder = '$budjectHolder'"; }
                        
                        if($cboBranch!=''){ $sqlBudjectDetails .= " AND finance_budget_accounts_header.intFinanceBudgetBranchId = '$cboBranch'"; }
                        
                        if($cboDuration!=''){ $sqlBudjectDetails .= " AND finance_budget_accounts_header.intBudgetDuration = '$cboDuration'"; }
                        
                        if($assignFrom!=''){ $sqlBudjectDetails .= " AND DATE(finance_budget_accounts_header.dtmBudgetAccountFrom) >= '$assignFrom'"; }
                        
                        $sqlBudjectDetails .= " ORDER BY finance_budget_accounts_header.intFinanceBudgetHeaderId DESC";
                        $resultBudjectDetails = $db->executeQuery($sqlBudjectDetails);
                        while($rowBudjectDetails = mysqli_fetch_array($resultBudjectDetails)){
                          $response .= '<tr>
                            <td style="text-align:center;">'.$count.'</td>
                            <td style="text-align:right;">'.$rowBudjectDetails['companyAccount'].'</td>
                            <td style="text-align:right;">'.$rowBudjectDetails['branchName'].'</td>
                            <td style="text-align:right;">'.$rowBudjectDetails['budjectName'].'</td>
                            <td style="text-align:right;">'.$rowBudjectDetails['budjectHolder'].'</td>
                            <td style="text-align:right;">'.$rowBudjectDetails['strCurrency'].'</td>
                            <td style="text-align:right;">'.number_format($rowBudjectDetails['budjectAmount'],2).'</td>
                            <td style="text-align:right;">'.$rowBudjectDetails['assignDateFrom'].'</td>
                            <td style="text-align:right;">'.$rowBudjectDetails['assignDateTo'].'</td>
                            <td style="text-align:right;">'.$rowBudjectDetails['intBudgetDuration'].' Months</td>
                            <td style="text-align:center;"><button type="button" class="btn btn-warning btn-sm" data-toggle="modal" data-target="#modal-lg-update-item" onclick="updateBranchBudject('.$rowBudjectDetails['intFinanceBudgetHeaderId'].');" style="font-size:10px; margin: 0 auto; display: block;">UPDATE</button></td>
                          </tr>';
                        $count ++; 
                        }
                        $response .= '
                      </tbody>
                    </table>
                  </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </section>';    
    }
    catch (Exception $e){}
    echo $response;
}

-- SEPARATE PHP FILE DISPLAY THE TABLE --

Please help me to finalize this. only showing records. but not showing the table as a data table.

Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

Replies

  • kassakassa Posts: 2Questions: 0Answers: 0

    Please help me to solve this. because this is top urgent for me

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    When you say it's not working, what isn't working? And what have you tried?

    We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

    Cheers,

    Colin

Sign In or Register to comment.