重新排序 Primefaces DataTable onclick

Question

我想在点击时执行行切换，如下例所示。 primefaces 允许交换行的唯一方法是使它们可拖动，这对我来说不是一个选项。戳了一天左右，没有运气。我将不胜感激任何帮助，谢谢！ PF 版本 6.1.

function moveUp(id){
    let element = $("tr").find(`[data-ri='${id}']`);
    element.prev().before(element);
}
function moveDown(id){
        let element = $("tr").find(`[data-ri='${id}']`);
        element.next().after(element);
}
<p:dataTable id="prices-table" var="price" value="#{Bean.prices}">
    <p:ajax event="rowReorder" listener="#{Bean.onPriceReorder}"
            update="prices-table" />
    <p:column style="width:16px">
        <p:commandButton update="prices-table" onclick="moveUp()">up</p:commandButton>
        <p:commandButton update="prices-table" onclick="moveDown()">down</p:commandButton>
    </p:column>
    <p:column headerText="Title">
        <h:outputText value="#{price.title}" />
    </p:column>
</p:dataTable>

Answer 1

谢谢，我设法在没有任何 JS 的情况下做到这一点，为可能偶然发现此问题的任何人发布代码。 JSF:

<p:dataTable id="prices-table" var="price" value="#{Bean.prices}">
  <p:column style="width:16px">
    <p:commandButton update="@form" actionListener="#{Bean.movePrice(price, 'up')}">up</p:commandButton>
    <p:commandButton update="@form" actionListener="#{Bean.movePrice(price, 'down')}">down</p:commandButton>
  </p:column>
  <p:column headerText="Title">
    <h:outputText value="#{price.title}" />
  </p:column>
  <p:column headerText="Amount">
    <h:outputText value="#{price.amount}">
      <f:convertNumber minFractionDigits="2" type="currency" currencySymbol="$" />
    </h:outputText>
  </p:column>

豆子：

public void movePrice(Price price, String direction) {
    int orderPosition = price.getOrderPosition();
    boolean isPricesSwapped = false;
    if (direction.equals("up") && orderPosition != 0) {
        Collections.swap(prices, orderPosition - 1, orderPosition);
        isPricesSwapped = true;
    }
    if (direction.equals("down") && orderPosition != prices.size()) {
        Collections.swap(prices, orderPosition, orderPosition + 1);
        isPricesSwapped = true;
    }
    if (isPricesSwapped) {
        for (int i = 0; i < prices.size(); i++) {
            price = prices.get(i);
            price.setOrderPosition(i);
        }
    }
}

重新排序 Primefaces DataTable onclick

Reorder Primefaces DataTable onclick

jsf

primefaces

primefaces-datatable