在 PrimeFaces 向导中禁用/启用 Next 和 Back 按钮答案

【问题标题】：Disable/ Enable for Next and Back button in PrimeFaces Wizard在 PrimeFaces 向导中禁用/启用 Next 和 Back 按钮
【发布时间】：2020-06-21 10:28:11
【问题描述】：

我是 JSF Primefaces 的新手

我正在使用 Primeface 向导，我需要使用 java 禁用/启用向导中的 Next/Back 按钮。我试过下面的代码但失败了

对于下一步按钮禁用：

PrimeFaces.current().executeScript(" PF('" + clientId + "').nextNav.css('disabled', 'true');");

PrimeFaces.current().executeScript(" PF('" + clientId + "').nextNav.css('disabled', 'disabled');");

对于下一个按钮启用：

PrimeFaces.current().executeScript(" PF('" + clientId + "').nextNav.css('disabled', 'false');");

PrimeFaces.current().executeScript(" PF('" + clientId + "').nextNav.css('disabled', 'none');");

但是当我尝试使用可见性时，它正在工作

对于下一步按钮隐藏： PrimeFaces.current().executeScript(" PF('" + clientId + "').nextNav.css('visibility', 'hidden');");

下一个按钮显示： PrimeFaces.current().executeScript(" PF('" + clientId + "').nextNav.css('visibility', 'visible');");

问题：如何使用 Java sn-p 启用/禁用向导中的 Next/Back 按钮？（需要禁用而不是隐藏按钮）

【问题讨论】：

你是否已经看到this问题
这能回答你的问题吗？ Hide back button at last tab in primefaces wizard
disabled 不是 css 的东西，它是一个属性。如果您尝试在纯 html 上设置 disabled: disabled 在应用的 css 选择器中，它不会做任何事情......
@fuggerjaki61：请阅读最后的粗体字...
@Melloware：请阅读最后的粗体行

标签： css jsf primefaces

【解决方案1】：

禁用按钮不是 css 的事情。它是 html 按钮元素的属性，例如 ` 实际值无关紧要，仅存在具有此名称的属性就会使其禁用。因此，您需要通过设置它

PF('" + clientId + "').nextNav.attr('disabled', 'disabled')

但这只会在技术上禁用它。所以你还需要添加适当的外观和感觉：

PF('" + clientId + "').nextNav.toggleClass('ui-state-default')
PF('" + clientId + "').nextNav.toggleClass('ui-state-disabled')

我会亲自将所有这些添加到一个 javascript 函数 (function disableNext(...) {...}) 中，并通过传递 clientId 从 java 中添加这个函数（您甚至可以使其更通用并创建一个 toggleNext )

【讨论】：

按钮的widgetvar不可以吗？会更容易
@BugsForBreakfast：如果这个按钮有一个小部件，它会有。但它不是，因为它是一个按钮，是向导小部件的一部分。您当然可以通过扩展它的 js 并将 disableNext/enableNext/disablePrev/enablePrev 放在那里来向向导添加一个功能。那将是非常通用的。这甚至可以作为 PrimeFaces 的拉取请求发布。随意尝试（这是一个很好且不太复杂的练习）
请注意 PF(Xxx) 采用小部件变量名称，而不是 clientId，请参阅 github.com/primefaces/primefaces/blob/… 。如果您想使用clientId，请使用PrimeFaces.getWidgetById(clientId)。
@JasperdeVries：同意，但我从至少 css 工作的问题中复制了代码，所以我“假设”OP 传递了 widgetvar 而不是完整的客户端 ID（但假设......母亲...)
感谢大家提供宝贵的信息。 @Kukeltje 感谢您的解决方案，我尝试过使用 attr，如前所述，它正在工作。 for disable:PF('" + clientId + "').nextNav.attr('disabled', 'disabled') for enable:PF('" + clientId + "').nextNav.removeAttr('disabled') 同样，也可以在向导中申请返回按钮。