datatable not working on ajax call

kassa

`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.

kassa

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

colin

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