2

在我的主页（.xhtml）中，JSF 页面中有 4 个 h:inputText 框和一个 serach 按钮（h:commandButton）

<h:inputText id="stlID"    value="#{searchSettlementTransRequest.stlmtTransId}" name='stlmt'> 
<h:inputText id="pmtID"    value="#{searchSettlementTransRequest.pmtTransId}"   name='pmt'>
<h:inputText id="AgentID"  value="#{searchSettlementTransRequest.AgentId}"      name='agnt'>
<h:inputText id="AgencyID" value="#{searchSettlementTransRequest.AgencyId}"     name='agncy'>

<h:commandButton id="tranSearchBtn" styleClass="valign first button-search sSearch" action="stlmtSubmit"/>

我的要求是：

  1. 在第一个输入字段中输入的数据上，应禁用其他输入字段（即 2、3、4）。
  2. 在第二个输入字段中输入的数据上，应禁用其他输入字段（即 1、3、4）。等等.. 注意：同时，如果用户在第 1 或第 2 或第 3 或第 4（用户动态）字段中输入数据并在删除输入字段之前删除相同的数据，在这种情况下应启用所有字段。当我在单击“搜索”按钮后得到响应（空或非空数据响应）时，所有输入字段都应启用以进行另一个搜索（现在用户可以在 4 个字段中的任何一个中输入数据）
4

2 回答 2

1

如果您只想在 jsf 中执行此操作，只需添加一些 AJAX 调用。下面的一些建议：

将值添加到您的所有<h:inputText属性disabled中#{searchSettlementTransRequest.getDisabled('this_component_id')"。所以整个事情看起来像这样：

<h:inputText id="someId1" value="#{searchSettlementTransRequest.someValue}" name="stlmt" disabled="#{searchSettlementTransRequest.getDisabled('someId1')}"/>

接下来在您的 bean 处理此请求更改设置为 `stlmTransId, pmtTransId, AgentId, AgencyId' 他们将标记此值正在设置：

public void setXXX(XXX xxx) {

  // your actual code comes here and at the end set that this component was changed
  actuallyChanged = id_of_input_text_component_corresponding_to_this_value_as_string;

}

当然，您必须向String actuallyChangedbean 添加字段。方法getDisabled(String compId)会知道长相：

public String getDisabled(String compId) {
  if (actuallyChanged.equals(compId)) {
    return "";
  else {
    return "disabled";
  }
}

对于您的所有组件，您还添加了这样的 AJAX 调用：

<f:ajax event="change" execute="@this" render="stlID pmtID AgentID AgencyID"/>

所以知道一个组件的值何时会改变，所有其他组件都将被禁用。但是在调用后使它们启用是不可能的，因为如果没有客户端脚本，您就不能轻易地使它们在选择或获得焦点或任何东西时可用。

如果您想暂时禁用组件，例如，当用户键入一个组件时，其他所有组件都已禁用，但是当他选择其中一些组件时，将启用该组件，而所有其他组件（包括他首先编写文本的组件）将被禁用。在这种情况下，更好的方法是为此使用客户端脚本，例如 JavaScript。

更新以完全匹配您在 JavaScript (jQuery) 中的问题

向所有组件添加这样的事件：

onkeyup="$('#thisComponentId').attr('disabled', false); $('#otherComponentId').attr('disabled', true); $('#otherComponentId').attr('disabled', true); "

发表评论后，您可以将其更改为：

onkeyup="if ($('#thisComponentId').val() && $('#thisComponentId').val() == '') { // here set enable for all components } else { // here set disable for all other components }

这不是很复杂的方法，但它应该可以工作。知道当您开始输入一个组件时，其他组件将被禁用，但当您发送请求时，所有组件都将再次启用。

于 2013-01-24T07:30:04.317 回答
1

如果您希望在每次页面加载后启用输入，您可以有一个表示页面已加载的标志，并在通过侦听器的每个 ajax 请求后将该标志设置为 false。并且为了确保在完成页面加载后标志设置为 true，您可以使用preRenderViewevent. preRenderView如果页面是通过完整请求而不是 ajax 请求加载的，您只需要为将标志设置为 true 的事件执行一个方法。如果页面加载了ajax请求，faces-request参数将设置为“partial/ajax”。

public static final String INITIAL_VALUE = ""; // I assume your fields are integer and they are initialized to INITIAL_VALUE in the first place    

public Boolean pageIsLoadedWithFullRequest = true;

public void preRenderView()
{
   //check whether the request is an ajax request or not  

Map<String, String> requestHeaderMap = FacesContext.getCurrentInstance().getExternalContext().getRequestHeaderMap();
if(!"partial/ajax".equals(requestHeaderMap.get("faces-request")))
{
    pageIsLoadedWithFullRequest = true;
}

如果您想在用户写入其中一个字段时禁用其他输入，您可以在 blur 事件之后进行 ajax 调用以更改其他输入字段的状态并pageIsLoadedWithFullRequest在侦听器中将标志设置为 false。

public void madeAjaxRequest()
{
     pageIsLoadedWithFullRequest = false;
}

public Boolean getStlIDEnabled()
{
return pageIsLoadedWithFullRequest || !stlmtTransId.equals(INITIAL_VALUE) && pmtTransId.equals(INITIAL_VALUE) && AgentId.equals(INITIAL_VALUE) && AgencyId.equals(INITIAL_VALUE);
}

public Boolean getPmtTransIdEnabled()
{
return pageIsLoadedWithFullRequest || stlmtTransId.equals(INITIAL_VALUE) && !pmtTransId.equals(INITIAL_VALUE) && AgentId.equals(INITIAL_VALUE) && AgencyId.equals(INITIAL_VALUE);
}

public Boolean getAgentIdEnabled()
{
return pageIsLoadedWithFullRequest || stlmtTransId.equals(INITIAL_VALUE) && pmtTransId.equals(INITIAL_VALUE) && !AgentId.equals(INITIAL_VALUE) && AgencyId.equals(INITIAL_VALUE);
}

public Boolean getAgencyIdEnabled()
{
return pageIsLoadedWithFullRequest || stlmtTransId.equals(INITIAL_VALUE) && pmtTransId.equals(INITIAL_VALUE) && AgentId.equals(INITIAL_VALUE) && !AgencyId.equals(INITIAL_VALUE);
}


<f:event type="preRenderView" listener="#{searchSettlementTransRequest.preRenderView()}"/> <!--This will ensure that preRenderView method will be called right before rendering of the view ends -->
<h:inputText  id="stlID"  value="#{searchSettlementTransRequest.stlmtTransId}" name='stlmt' disabled="#{not searchSettlementTransRequest.stlIDEnabled}"/> 
<h:inputText  id="pmtID"  value="#{searchSettlementTransRequest.pmtTransId}" name='pmt' disabled="#{not searchSettlementTransRequest.pmtTransIdEnabled}"/>
<h:inputText  id="AgentID"  value="#{searchSettlementTransRequest.AgentId}" name='agnt' disabled="#{not searchSettlementTransRequest.AgentIdEnabled}"/>
<h:inputText  id="AgencyID"  value="#{searchSettlementTransRequest.AgencyId}" name='agncy' disabled="#{not searchSettlementTransRequest.AgencyIdEnabled}"/>

如果你想通过 ajax 禁用它们，你应该添加 f:ajax 命令并渲染所有这四个 inputTexts。例子：

<h:inputText  id="stlID"  value="#{searchSettlementTransRequest.stlmtTransId}" name='stlmt' disabled="#{not searchSettlementTransRequest.stlIDEnabled}"> 
<f:ajax event="blur" 
 listener=#{searchSettlementTransRequest.madeAjaxRequest()}
 execute="stlID pmtID AgentID AgencyID"
 execute="stlID pmtID AgentID AgencyID"/>
</h:inputText>

不相关 AgentId、AgencyID 等变量的首字母大写并不是一个好习惯，如果将它们改为 agentId 和 AgencyID 应该会更好。

干杯

于 2013-01-24T07:38:57.157 回答