javascript - हालत के आधार पर एक स्तंभ के jQuery Datatables परिवर्तन मान




php (2)

आप अपने डेटा को संशोधित करने के लिए fnCreateCell का उपयोग कर सकते हैं।

    $(document).ready(function(){
    $('#LeaveList').DataTable({
        processing: true,
        serverSide: true,
        ajax: 'leave-list',
        columns: [
            {data: 'id', name: 'id'},
            {data: 'employee_name', name: 'employee_name'},
            {data: 'employee_id', name: 'employee_id'},
            {data: 'from_date', name: 'from_date'},
            {data: 'to_date', name: 'to_date'},
            {data: 'leave_type', name: 'leave_type'},
           // {data: 'department', name: 'department'},
            {data: 'status', name: 'status',
            "fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {

                   if (sData) {
                         $(nTd).addClass('text-success');
                   }else{
                         $(nTd).addClass('text-danger'); 
                   }
                }               
            },
            {data: 'created_at', name: 'created_at'},
            {data: 'action', name: 'action', orderable: true, searchable: true}
        ]
    });

}); 

मेरे पास दैटैटबल हैं जो ठीक काम कर रहे हैं। हालांकि मैं इसे थोड़ा सा tweak करना चाहते हैं जैसा कि आप देख सकते हैं कि मुझे यह शर्त है:

if ( data.status == 0 )

इसका अर्थ है कि यदि status शून्य के बराबर है, तो मैं टेक्स्ट का रंग लाल और हरा दूंगा। हालांकि मैं data.status के टेक्स्ट को भी बदलना चाहता हूं। यह data.status 0 या 1 । अगर मैं शून्य और 1 अगर Approved होने पर पाठ Pending दिखाई दे सकता हूं।

<script>
    $(document).ready(function(){
        $('#LeaveList').DataTable({
            processing: true,
            serverSide: true,
            ajax: 'leave-list',
             "createdRow": function ( row, data, index ) {
                if ( data.status == 0 ) {
                    $('td', row).eq(6).addClass('text-danger');
                }
                else
                {
                    $('td', row).eq(6).addClass('text-success');
                }
            },
            columns: [
                {data: 'id', name: 'id'},
                {data: 'employee_name', name: 'employee_name'},
                {data: 'employee_id', name: 'employee_id'},
                {data: 'from_date', name: 'from_date'},
                {data: 'to_date', name: 'to_date'},
                {data: 'leave_type', name: 'leave_type'},
               // {data: 'department', name: 'department'},
                {data: 'status', name: 'status'},
                {data: 'created_at', name: 'created_at'},
                {data: 'action', name: 'action', orderable: true, searchable: true}
            ]
        });

    }); 
    </script>   

मैं इसे इस jquery भाग में डेटा की क्वेरी में नहीं चाहता


मान लें कि आपका वर्तमान कोड ठीक से काम कर रहा है। तो आपको केवल इतना बनाया createdRow हिस्सा इस तरह संशोधित करने की आवश्यकता है:

...
createdRow: function ( row, data, index ) {
  if ( data.status == 0 ) {
    $('td', row).eq(6).addClass('text-danger').text('Pending');
  } else {
    $('td', row).eq(6).addClass('text-success').text('Approved');
  }
},
...

हालांकि, जैसा कि मार्कस्मिथ द्वारा बताया गया है, क्लीनर render विकल्पों का उपयोग करना है। आप यहां columns.render बारे में पढ़ सकते हैं।





datatables