在值更改时更改primefaces数据表中可编辑列上输入字段的背景颜色

Question

我在 dataTable 中有一个可编辑的列。代码是：

<p:column id="articleDescription" headerText="Article Description" filterBy="#{article.description}" filterMatchMode="startsWith">
  <p:inputText id="description" value="#{article.description}"style="border:none; box-shadow:none;" />
</p:column>

1. 我想更改 inputText 的背景颜色 - 事件描述 - valueChange。我该如何改变呢？
2. 另外，它的默认背景颜色应该与其父行相同吗？可能吗？怎么做到呢？

谢谢， 希哈

Answer 1

单元格的背景颜色设置为父行的颜色：

.inputTextStyle {
    background-color: transparent !important;
}

<h:inputText id="vendorDiscountPerInputTxt"
    value="#{articlePromo.descPromoPorcentaje}"
    styleClass="inputTextStyle">
</h:inputText>

另外，在值更改事件中将单元格的背景颜色更改为：

$(document.getElementById(str)).css("background-color", "pink !important");

需要将其标记为重要，因为 primefaces 将其标记为重要。所以，要覆盖它。

Answer 2

我想更改 inputText 的背景颜色 - 事件描述 - valueChange。我该如何改变呢？

只需在输入元素的change 事件期间执行一些 JavaScript/jQuery（PrimeFaces 附带 jQuery，您无需自己安装）。

---

另外，它的默认背景颜色应该与其父行相同吗？可能吗？怎么办？

使用 jQuery 可以轻松获取父行并获取其 CSS background-color 属性。

---

假设你要走 jQuery 的方向，它看起来像这样

<p:inputText styleClass="changeable" />

与

$(document).delegate("tr :input.changeable", "change", function() {
    var $this = $(this);
    $this.css('background-color', $this.closest('tr').css('background-color'));
});