0

I'm filling my table using ajax and customizing the return. On column status (0 or 1) I used the "fnRender" to return a label with Active and Inactive, but I need to use this same validation to show the button "Activate" or "Deactivate", when the script pass on the second validation the "fnRender" the status real value was overridden to "<span class='label label-success'>Ativo</span>" (or Inactive) and my validation for "mData" : "id" that is (if(parseInt(oObj.aData['status']) == 1)) doesn't work.

Possible Solution

if(oObj.aData['status'] == "<span class='label label-success'>Active</span>")

The problem is that i don't wanna realize this validation with string, it seems like this is not right.

Javascript:

var tabela = $('#dynamic-table');

    tabela.dataTable( {
        "aaSorting": [[ 0, "asc" ]],
        "bProcessing": true,
        "bServerSide": true,
        "sAjaxSource": "minhaURL",
        "aoColumns": [{
            "mData":"nome"
          },
          {
            "mData":"status",
            "bSortable": false,
            "fnRender": function (oObj)                              
            {
                var status;
                if(parseInt(oObj.aData['status']) == 1){
                    status = "<span class='label label-success'>Active</span>"; 
                }else{
                    status = "<span class='label label-danger'>Inactive</span>";
                }
                return status;
            }
          },
          { 
            "mData":"id",    
            "bSearchable": false,
            "bSortable": false,
            "fnRender": function (oObj)                              
            {
                var btAtivaDesativa;
                btEditar = "<a href='" + oObj.aData['id'] + "' class='btn btn-primary'>Edit</a>";
                if(parseInt(oObj.aData['status']) == 1){
                    btAtivaDesativa = "<a href='" + oObj.aData['id'] + "' class='btn btn-danger'>Deactivate</a>"; 
                }else{
                    btAtivaDesativa = "<a href='" + oObj.aData['id'] + "' class='btn btn-success'>Activate</a>";
                }
                return btEditar + " " + btAtivaDesativa;
            }
           }
        ] 
    } );

1 Answer 1

1

UPDATE: You should use mRender instead of fnRender.

    "aoColumns": [{
      "mData": 0,
      "mRender": function(data, type, full) {
        if (data.status == '1') {
          return '<span class="label label-success">Active</span>';
        } else {
          return '<span class="label label-warning">Inactive</span>';
        }
      }
    }, {
      "mData": 1,
      "bSortable": false,
      "mRender": function(data, type, full) {
        if (full[0].status == '1') {
          return '<a class="btn btn-info btn-sm" onclick=edit(' + data.ID + ')>' + 'Edit' + '</a>';
        }
        return '';
      }
    }]
    });

mRender has three parameters, in this case I use:

data - for the cell data

type - for nothing

full for the full row array

Look at this Plunker to see how it works

3
  • Thanks for your answer, but the same problem is happening, when I check full[5] it return the new value for status is "<span class='label label-success'>Active</span>". Apr 11, 2014 at 14:20
  • Of course you shouldn't use the indexes from my Plunker example. This was just some code I had lying around to show you the principle. I tried to change the answer to match your (guessed) data structure more closely. Look at the updated Plunker too.
    – mainguy
    Apr 11, 2014 at 14:59
  • That's perfect!Thank you! Apr 11, 2014 at 15:13

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.