Disable a custom check cell based on value from another cell

[dhtran]

Hello,

I have a table (simple XML) with a custom column to add a check button to select the rows and do some action on them.

Basically, the custom render looks like this

var CustomRangeRenderer = TableView.BaseCellRenderer.extend({
          canRender: function(cell) {
              // Enable this custom cell renderer for Actions field
              return _(["Actions"]).contains(cell.field);
          },
          render: function($td, cell) {
              if (cell.field === "Actions") {
				$td.html('<label class="checkbox"><a href="#" class="btn customcheck"><i id="btnRadio" class="icon-check" style="display: none;"></i></a></label>');
              }
          }
		 
      });

Then of course I have the button on change listener, the action function etc. It works fine.

Once the action is applied, it changes a value of another field, let's say the Status field, from "Open" to "Close", something like this : 

Actions------IdCol------Status

chkbox---------AAA--------Open

chkbox--------BBB---------Close

chkbox--------CCC--------Open

This also works.

Now, I'd like to disable the checkbox on the rows having status=Close.

I've tried to access the rows and columns of the table through javascript using for exemple document.getElementById("#myTable"), looping on the cells value and adding "disabled" attribut, like this 

$(document).ready(function() {
var table = document.getElementById("myTable");
		for (var row = 0, n = table.rows.length; row < n; r++) {
			for (var col = 0, m = table.rows[row].cells.length; col < m; col++) {
				if(table.rows[row].cells[col].innerHTML == "Close") {
					table.rows[row].cells[0].setAttribute("disabled", true);
				}
			}
});

But since the table is rendered with Splunk component TableView, the document.getElementById() returned "undefined".

What is the correct way to achieve this ?