2017-05-29 82 views
0

我正在使用數據表進行列表。現在我想在幾個定義過濾器的基礎上過濾一些記錄。ajax成功響應後數據表重新加載

我已經完成了使用ajax的過濾器我在過濾器的基礎上創建了一個新的響應並替換了數據表的響應表,並且一切工作正常。

但問題是在完成了所有數據表默認搜索框和排序不工作後。見下面的代碼。

jQuery代碼:

//Search data from quarter 
$("body").delegate("#period","change",function(){ 
    var customer_id = $("#customer").val(); 
    var quarter = $("#period").val(); 
    var _token = $('input[name="_token"]').val(); 
    //if(quarter !=''){ 
     $("#ajax_loader_content").text("Please wait..."); 
     $("#ajax_loader").removeClass("hide"); 
     $.ajax({ 
      url: "{{ url('/appraisal-search') }}", // routing 
      type: "POST", 
      data: {_token: _token, customer_id: customer_id, quarter: quarter }, 
      success: function(res) { 
       $("#ajax_loader").addClass("hide"); 
       if(res == 0){ 
        $(".ajax-hide").addClass('hide'); 
        $(".ajax-show").removeClass('hide'); 
       }else{ 
        $(".ajax-hide").removeClass('hide'); 
        $(".ajax-show").addClass('hide'); 
        $("#data_table_tbody").html(res); 
        SITE.TableDropdownMenu(); 
       } 
      }, 
      error: function(res) { 
       console.log('Error:' + res); 
      } 
     }); 
}); 

PHP代碼:

public function searchAppraisal() { 
    if(WebUsers::isBusinessAnalyst()){ 
     try { 
      $customer = $this->_request->customer_id; 
      $quarter = $this->_request->quarter; 
      if (!empty($customer) || !empty($quarter)) { 
       $data['appraisals'] = Appraisal::getSearchedAppraisals($customer, $quarter); 
       if(count($data['appraisals'])>0){ 
        echo view('analyst.appraisal.ajax_search_appraisal', $data); 
       }else{ 
        echo 0; 
       } 
      } 
     } catch (Exception $ex) { 
      $this->_response['error'][] = $ex->getMessage(); 
      return response(Helpers::makeAjaxResponse(false, $this->_response)); 
     } 
    }else{ 
     return response('Unauthorized.', 401); 
    } 
} 

是任何人之前,面對這樣的?如何在成功ajax調用後重新加載網格。

回答

0

更新dataTable的,你success功能結束後,需要用新的信息重新繪製:yourTable.draw();

+0

你的意思是我需要改變一些東西,如:{ $(「AJAX隱藏。」 ).removeClass( '隱藏'); (「.ajax-show」)。addClass('hide'); $(「#data_table_tbody」)。html(res); dataTable.draw(); SITE.TableDropdownMenu(); } –