title: How to get the selected Table cell value in datatable
body: <p>I am using  jquery-2.0.3.min.js, bootstrap.min.js, jquery-ui-1.10.3.min.js,           DataTables-1.9.4 with tabletools, datatables.net/blog/Twitter_Bootstrap_2</p>
  
  <p>My View</p>
  
  <pre><code>  &lt;div id="windowDepartment" title="Departments"&gt;&lt;/div&gt;
  
  
   &lt;table cellpadding="0" cellspacing="0" border="0" class="table table-striped table-bordered table-hover table-condensed" id="DepartmentTable"&gt;
          &lt;thead&gt;
              &lt;tr&gt;
                  &lt;th&gt;departmentID&lt;/th&gt;
                  &lt;th&gt;departmentName&lt;/th&gt;
                  &lt;th&gt;description&lt;/th&gt;
                  &lt;th&gt;Action&lt;/th&gt;
              &lt;/tr&gt;
          &lt;/thead&gt;
          &lt;tbody&gt;
          &lt;/tbody&gt;
      &lt;/table&gt;
  </code></pre>
  
  <p>Datatable initialisation Script</p>
  
  <pre><code>    $(document).ready(function () {
      oDepartmentTable = $('#DepartmentTable').dataTable(
              {
  
                  "sDom": "T&lt;'clear'&gt;lfrtip",
                  "bJQueryUI": true,
                  "sPaginationType": "full_numbers",
                  "bServerSide": true,
                  "sAjaxSource": "Department/AjaxList",
                  "aaSorting": [[2, 'asc'], [3, 'asc']],
                  "aoColumns": [
                                  { "mDataProp": "departmentID", "sType": "string", "bVisible": false, "bSearchable": false },
                                  { "mDataProp": "departmentName", "sType": "string", "bVisible": true, "bSearchable": true },
                                  { "mDataProp": "description", "sType": "string", "bVisible": true, "bSearchable": true },
                                  { "mDataProp": null,"bSearchable": false,
                                   "sDefaultContent": '&lt;div class="btn-group"&gt;&lt;a class="btn btn-mini dropdown-toggle" data-toggle="dropdown" href="#"&gt;&lt;span class="icon-circle-arrow-down"&gt;&lt;/span&gt;&lt;/a&gt;&lt;ul class="dropdown-menu"&gt;&lt;li&gt;&lt;a class="editDepartment"&gt; &lt;i class="icon-pencil"&gt;&lt;/i&gt; Edit&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a class="deleteDepartment"&gt; &lt;i class="icon-trash"&gt;&lt;/i&gt; Delete&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;/div&gt;'
                                  }
                              ],
  
                  "oTableTools": {
                      "sSwfPath": "/Content/DataTables-1.9.4/extras/TableTools/media/swf/copy_csv_xls_pdf.swf"
                  }
  
              });
  
          });
  </code></pre>
  
  <p>EDIT FORM SCRIPT</p>
  
  <pre><code>       $(document).ready(function () {
              $('#DepartmentTable tbody').on('click', 'a.editDepartment', function (e) {
                  e.preventDefault();
  
                  //1. Dose not work shows "not available"
                  var aData = oDepartmentTable.fnGetData(this)
  
                  //2. Gets the correct ID if "bVisilble=true"
                  var departmentid = $(this).parent().parent().parent().parent().parent().children()[0].innerHTML ;
  
                  //goto Edit Controller. DepartmentID is required here  
                  $.get('Department/Edit/' + departmentid , function (data) {
                      $('div#windowDepartment').html(data);
  
                      //Open Dialog box 
                      $("#windowDepartment").dialog().dialog({
                          resizable: true,
                          height: 500,
                          width: 500,
                          modal: true,
                          buttons:
                      {
                          Edit: function () {
                              editDepartment();   //Saves the data. Works fine
                          }, // end ok button
  
                          Cancel: function () {
                              $(this).dialog("close");
                          }
                      },  //end buttons
                          close: function () {
                              $(this).dialog("close");
                          }
                      }); //end modal edit
                  });
              });
          });
  </code></pre>
  
  <p>My Problem. (in EDIT FORM SCRIPT)</p>
  
  <p>I need the DepartmentID to pass to my controller ('Department/Edit/' + departmentid)</p>
  
  <p>My observations
  1) <code>var aData = oDepartmentTable.fnGetData(this)</code>  always shows  "not available" in chrome console. </p>
  
  <p>2) var departmentid = <code>$(this).parent().parent().parent().parent().parent().children()[0].innerHTML</code>  gets the correct departmentID if i use "bVisible": true in datatable initialisation.</p>
  
  <p>(3) I dont want to show departmentID to the end user. if i make "bVisible": false in datatable initialisation then </p>
  
  <p><code>var departmentid = $(this).parent().parent().parent().parent().parent().children()[0].innerHTML</code>  returns the departmentName</p>
  
  <p>Thanks </p>