行选择器上的 Oracle Apex 字体

Question

我被问到是否可以修改我的 oracle apex 交互式网格以使行选择器列更宽、更粗并且可以添加标题。我知道如何为列执行此操作，但我不确定交互式网格行选择器是否可行。任何帮助或示例都会有所帮助。谢谢

Answer 1

哇，这是一个棘手的问题。我想我已经弄清楚了（非常感谢 John Snyders！）。假设 IG 的 ID 为 'emp'，以下应该有效：

将以下 CSS 添加到页面 Inline 属性下的 CSS。这将处理复选框的样式、复选框中的复选标记，并将显示默认隐藏的列的 header。如果您想定位页面上的所有 IG，您可以删除 #emp 选择器。

/* Style the box */
#emp .u-selector {
  border: 2px solid #000;
  padding: .5px;
}

/* Style the check in the box */
#emp .u-selector:before {
  font-weight: 900;
  color: #000;
}

/* Show the row selector column header */
#emp .a-GV-headerLabel {
  position: relative;
}
#emp .a-GV-table th {
  white-space: normal;
}

接下来，将以下JavaScript代码添加到页面的Execute when Page Loads 属性下JavaScript。

var igRegionId = 'emp';
var widgetInst = apex.region(igRegionId).call('getViews').grid.view$.data('apex-grid');
var orgRefresh = widgetInst.refresh;

widgetInst.refresh = function() {
  orgRefresh.call(widgetInst);
  $('.u-vh.a-GV-headerLabel').text('Hello World!');
};

widgetInst.refresh();

最后，在IG区域>属性>JavaScript初始化代码中添加如下JavaScript。这将根据需要调整列的大小：

function(config) {
  config.defaultGridViewOptions = {
    rowHeaderWidth: 100
  };

  return config;
}

行选择器上的 Oracle Apex 字体

Oracle Apex font on a row selector

oracle-apex

oracle-apex-5.1