2016-03-10 64 views
0

我想根據td值(「認證類型」)更改行的顏色。假設如果認證類型A,那麼黑,若B,則red..but當我把{{details[0].gen_certification_type.certification_type_name}},而不是直接的文本它不工作..根據值改變表格文本的顏色,同時json編碼

<script type="text/javascript" 
     src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.js"></script> 
<script type="text/javascript"> 

    $(document).ready(function(){ 
     $('#table_id td.y_n').each(function(){ 
      if ($(this).text() == 'Mandatory') { 
       $(this).css('color', 'red'); 
      } 
      else if ($(this).text() == 'Voluntary') { 
       $(this).css('color','green'); 
      } 
      else if ($(this).text() == 'Accreditation') { 
       $(this).css('color','blue'); 
      } 
     }); 
    }); 

</script> 

下面是表代碼

<table id="table_id" class="table table-bordered"> 
    <tr> 
     <th>Product Standard</th> 
     <td>{{details[0].gen_product_name.product_standard}}</td> 
    </tr> 
    <tr> 
     <th><mark style="font-weight: bold;">Certification Type</mark></th> 
     <td class="y_n">{{details[0].gen_certification_type.certification_type_name}}</td> 
    </tr> 
</table> 

這是我的控制器功能代碼

public function ajax_list_of_application_details_by_id() { 
    $this->autoRender = FALSE; 
    $data = json_decode(file_get_contents("php://input")); 
    $params = array(); 
    $params[] = $data->id; 
    $result = $this->OnlineApplication->callProcedure('OnlineApplicationListDetailsById', $params); 
    echo json_encode($result); 
} 

這是我的角js代碼:

$scope.app_details_id = function (id) { 
    $scope.app_id = id; 
    $scope.app_production_details_id(id); 
    $scope.app_attachments_details_id(id); 
    $http.post('ajax_list_of_application_details_by_id', {'id': id}) 
      .success(function (data) { 
       $scope.details = data; 
       // $scope.certificate_type=details[0].gen_certification_type.certification_type_name; 
       //console.out($scope.details); 
       return false; 
      }) 
} 
+0

你不應該這樣做的jQuery,使用angularjs。甚至在生成表格行之前着色。 – dipesh

回答

1

使用ngStyle

<tr ng-style="{'color': getColor(details[0].gen_certification_type.certification_type_name)}"></tr> 

控制器:

$scope.getColor = function(type_name) { 
    switch(type_name) { 
     case 'a': return 'red' 
        break; 
     case 'b': return 'black' //and so on... 
        break; 
    } 
} 
+0

非常感謝..他的工作.. –

+0

樂於幫助。你能接受答案嗎? :) –

+0

沒問題......... –