0

Web ページに次のコードがあります。メソッドのaction実行後、プロセスが成功したか失敗したかを示すラベルが表示されます。

私が欲しいのは、ボタンがクリックされた直後にラベルが非表示になることです。どうすればこれを達成できますか?

使用することを考えてactionListenerいましたが、次のように機能するかどうかはわかりません。

  1. actionListener のメソッドを呼び出す
  2. myView を再レンダリング (ラベルをクリア)
  3. アクションのメソッドを呼び出す
  4. myView を再レンダリングします (プロセスが成功したかどうかのラベルを表示します)

それとも何かonclick="getElementById().hide"

何か案は?

乾杯、

   ...
   ...
   <a4j:commandButton id="btnActualizaCubo"
                       value="Actualizar Cubo"
                       render="messageDependenciaCubo actualizacionCuboLabels @this"
                       onclick="return confirm('Las fechas seleccionadas son correctas?');"
                       onbegin="this.disabled=true;
                       document.getElementById('formActualizacionCubo:imgProcesandoCubo').style.display='block'"
                       oncomplete="this.disabled=false;
                       document.getElementById('formActualizacionCubo:imgProcesandoCubo').style.display='none'"
                       action="#{administrationBean.doActualizaCubo}"/>
   ...
    <a4j:outputPanel id="actualizacionCuboLabels" style="font-size: 14px; color: #D17100">
        <h:outputText rendered="#{administrationBean.actualizacionCuboCorrectaLabelRendered}"
                      value="Actualización correcta !"/>
        <h:outputText rendered="#{administrationBean.actualizacionCuboFalloLabelRendered}"
                      value="Fallo la actualización !"/>
    </a4j:outputPanel>
   ...
4

1 に答える 1

1

JavaScriptを使用してテキストを非表示にするには、「onclick」メソッドを使用します。これを行う簡単な方法は、ラベルをdivでラップし、onclick/oncompleteメソッドでそれぞれdivを非表示/表示することです。また、はジョブを実行するためのdivを生成するため、HTMLで生成されたIDを取得し、それを非表示/表示する必要があることを忘れないでください。divを非表示/表示するJS関数を紹介します(非常に簡単です、言わなければなりません):

<script type="text/javascript">
    function ocultaDiv(divId) {
        document.getElementById(divId).style.display = 'none';
    }

    function muestraDiv(divId) {
        document.getElementById(divId).style.display = 'block';
    }
</script>
<a4j:commandButton id="btnActualizaCubo"
    value="Actualizar Cubo"
    render="messageDependenciaCubo actualizacionCuboLabels @this"
    onclick="return confirm('Las fechas seleccionadas son correctas?'); ocultaDiv('myForm:actualizacionCuboLabels');"
    onbegin="this.disabled=true; document.getElementById('formActualizacionCubo:imgProcesandoCubo').style.display='block'"

oncomplete = "this.disabled = false; document.getElementById('formActualizacionCubo:imgProcesandoCubo')。style.display ='none'; muestraDiv('myForm:actualizacionCuboLabels');" action = "#{administrationBean.doActualizaCubo}" />

プレーンJavaScriptで実行でき、パフォーマンスを節約できる場合は、サーバー呼び出しを使用してアイテムをレンダリングしないようにしてください。また、RF3.3またはRF4を使用している場合は、「読み込み中、お待ちください」として使用している画像に関するヒントを追加してください。これは、ページ全体をフリーズすることもできます(する必要はありません)。ボタンとリンクを無効にしてください!)。

于 2012-06-21T21:45:15.090 に答える