anchor.diff:      <portlet:param name="target" value="TARGET"/>
       <portlet:param name="permissionType" value="PERMISSIONTYPE"/>
   </portlet:actionURL>
  -
  +<style>
  +#${n}permissionBrowser .dataTables_filter, #${n}permissionBrowser .first.paginate_button, #${n}permissionBrowser .last.paginate_button{
  +    display: none;
  +}
  +#${n}permissionBrowser .dataTables-inline, #${n}permissionBrowser .column-filter-widget, #${n}permissionBrowser .column-filter-widget {
  +    display: inline-block;
  +}
  +#${n}permissionBrowser .dataTables_wrapper {
  +    width: 100%;
  +}
  +#${n}permissionBrowser .dataTables_paginate .paginate_button {
  +    margin: 2px;
  +    cursor: pointer;
  +    *cursor: hand;
  +}
  +#${n}permissionBrowser .dataTables_paginate .paginate_active {
  +    margin: 2px;
  +    color:#000;
  +}
  +#${n}permissionBrowser .dataTables-right {
  +    float:right;
  +}
  +</style>
   <!--
   PORTLET DEVELOPMENT STANDARDS AND GUIDELINES
   | For the standards and guidelines that govern
  
positive.code:     </div> <!-- end: portlet-titlebar -->
  
      <!-- Portlet Content -->
      <div class="fl-widget-content portlet-content" role="main">
  
          <!-- Portlet Section -->
          <div id="${n}permissionAddingTabs" class="portlet-section view-permissions" role="region">
  
negative.code:                     </li>
                  </ul>
  
              <c:forTokens items="principal,target" delims="," var="token">
                  <div id="${n}${fn:escapeXml(token)}Tab">
                      <div class="content">
                          <table class="portlet-table table table-bordered table-hover" id="${n}${fn:escapeXml(token)}permissionsTable">
                              <thead>
                              <tr>
                                  <th><spring:message code="owner"/></th>
                                  <th><spring:message code="principal"/></th>
                                  <th><spring:message code="activity"/></th>
                                  <th><spring:message code="target"/></th>
                                  <th><spring:message code="edit"/></th>
                              </tr>
                              </thead>
                          </table>
                      </div>
                  </div>
              </c:forTokens>
              </div>
          </div> 
      </div>
  </div>
  
  <script type="text/javascript">
  up.jQuery(function() {
      var $ = up.jQuery;
  
      var principalList_configuration = {
          column: {
              owner: 0,
              principal: 1,
              activity: 2,
              target: 3,
              placeHolderForEditLink: 4
          },
          main: {
              table : null,
              pageSize: 10
          },
          url: "<c:url value="/api/assignments/principal/${ personEntity.principalString }.json?includeInherited=true"/>",
          searchExclude: 1, //Exclude principal
          showPrincipal: false,
          showTarget: true
      };
      var targetList_configuration = {
          column: {
              owner: 0,
              principal: 1,
              activity: 2,
              target: 3,
              placeHolderForEditLink: 4
          },
          main: {
              table : null,
              pageSize: 10
          },
          url: "<c:url value="/api/assignments/target/${ personEntity.principalString }.json?includeInherited=true"/>",
          searchExclude: 3, //Exclude target
          showPrincipal: true,
          showTarget: false
      };
  
      // Url generating helper function
      var getEditURL = function(owner, activity, target) {
          var url = "${editUrl}".replace("OWNER", owner).
                                        replace("ACTIVITY", activity).
                                        replace("TARGET", target);
          return '<a href="' + url + '"><spring:message code="edit" htmlEscape="false" javaScriptEscape="true"/></a>';
      };
      // Get activity value
      var getActivityValue = function(activity, inherited) {
          // Add Inherited if applicable
          var markup = '<span>${"' + activity + '"}</span>';
          if (inherited) {
              markup += ' <span class="inherited-permission">Inherited</span>';
          }
          return markup;
      }
  
      // Created as its own 
      var initializeTable = function(tableName) {
          var config = null;
          if (tableName == "principal") {
              config = principalList_configuration;
          } else {
              config = targetList_configuration;
          }
          config.main.table = $("#${n}" + tableName + "permissionsTable").dataTable({
              iDisplayLength: config.main.pageSize,
              aLengthMenu: [5, 10, 20, 50],
              bServerSide: false,
              sAjaxSource: config.url,
              sAjaxDataProp: "assignments",
              bDeferRender: false,
              bProcessing: true,
              bAutoWidth:false,
              sPaginationType: 'full_numbers',
              oLanguage: {
                  sLengthMenu: '<spring:message code="datatables.length-menu.message" htmlEscape="false" javaScriptEscape="true"/>',
                  oPaginate: {
                      sPrevious: '<spring:message code="datatables.paginate.previous" htmlEscape="false" javaScriptEscape="true"/>',
                      sNext: '<spring:message code="datatables.paginate.next" htmlEscape="false" javaScriptEscape="true"/>'
                  }
              },
              aoColumns: [
                  { mData: 'ownerName', sType: 'html', sWidth: '25%' },  // Owner
                  { mData: 'principalName', sType: 'html', sWidth: '25%', bVisible: config.showPrincipal },  // Principal 
                  { mData: 'activityName', sType: 'html', sWidth: '25%' },  // Activity
                  { mData: 'targetName', sType: 'html', bSearchable: false, sWidth: '25%', bVisible: config.showTarget },  // Target
                  { mData: 'targetName', sType: 'html', bSearchable: false, sWidth: '25%' }  // Edit Link
              ],
              fnInitComplete: function (oSettings) {
                  config.main.table.fnDraw();
              },
              fnServerData: function (sUrl, aoData, fnCallback, oSettings) {
                  oSettings.jqXHR = $.ajax({
                      url: sUrl,
                      data: aoData,
                      dataType: "json",
                      cache: false,
                      type: oSettings.sServerMethod,
                      success: function (json) {
                          if (json.sError) {
                              oSettings.oApi._fnLog(oSettings, 0, json.sError);
                          }
  
                          $(oSettings.oInstance).trigger('xhr', [oSettings, json]);
                          fnCallback(json);
                      },
                      error: function (xhr, error, thrown) {
                          lib.handleError(xhr, error, thrown);
                      }
                  });
              },
              fnInfoCallback: function( oSettings, iStart, iEnd, iMax, iTotal, sPre ) {
                  var infoMessage = '<spring:message code="datatables.info.message" htmlEscape="false" javaScriptEscape="true"/>';
                  var iCurrentPage = Math.ceil(oSettings._iDisplayStart / oSettings._iDisplayLength) + 1;
                  infoMessage = infoMessage.replace(/_START_/g, iStart).
                                        replace(/_END_/g, iEnd).
                                        replace(/_TOTAL_/g, iTotal).
                                        replace(/_CURRENT_PAGE_/g, iCurrentPage);
                  return infoMessage;
              },
              // Add links to the proper columns after we get the data
              fnRowCallback: function (nRow, aData, iDisplayIndex, iDisplayIndexFull) {
                  // Create edit link
                  $('td:eq(3)', nRow).html( getEditURL(aData.ownerKey, aData.activityKey, aData.targetKey) );
                  // Set activity inherited markup
                  if (config.showPrincipal) {
                      $('td:eq(2)', nRow).html( getActivityValue(aData.activityName, aData.inherited) );
                  } else {
                      $('td:eq(1)', nRow).html( getActivityValue(aData.activityName, aData.inherited) );
                  }
              },
              // Setting the top and bottom controls
              sDom: 'r<"row alert alert-info view-filter"<"dataTables-inline"W><"dataTables-inline dataTables-right"l><"dataTables-inline dataTables-right"i><"dataTables-inline dataTables-right"p>><"row"<"span12"t>>>',
              // Filtering
              oColumnFilterWidgets: {
                  sSeparator: ',', // Used for multivalue column Categories
                  aiExclude: [config.column.placeHolderForEditLink,
                              config.searchExclude]
              }
          });
      };
  
      initializeTable('principal');
      initializeTable('target');
  
  });
  </script>
  
  