title: JSF - How do I implement a JavaScript "Are you sure?" prompt for a <h:commandButton>
body: <p>In my JSF 1.2 webapp I have a page with a <code>&lt;h:commandButton&gt;</code> that invokes an action method on a backing bean. This action will cause data to be removed/replaced in the database, so I want to avoid any situations where the user accidentally clicks on the command button.</p>
  
  <p>I would like to implement a simple "Are you sure?" prompt with "Yes/No" or "OK/Cancel" options using JavaScript. I'm not great with JavaScript and I have never mixed JavaScript with JSF before. Can anyone provide a code snippet to show me how to implement this?</p>
  
  <p>Here is the piece of my JSP page where I declare the command button:</p>
  
  <pre><code>&lt;h:commandButton 
      id="commandButtonAcceptDraft"
      title="#{bundle.tooltipAcceptDraft}" 
      action="#{controller.actionReplaceCurrentReportWithDraft}" 
      image="/images/checkmark.gif"&gt;
  &lt;/h:commandButton&gt;
  </code></pre>
  
  <p><strong>SOLUTION:</strong></p>
  
  <p>The solution provided by BalusC worked just fine. I wanted to also mention that it is easy to use text from a resource bundle as the prompt text. On my page, I load the resource bundle with an element like this:</p>
  
  <pre><code>&lt;f:loadBundle basename="com.jimtough.resource.LocalizationResources" var="bundle" /&gt;
  </code></pre>
  
  <p>The <code>&lt;f:loadBundle&gt;</code> must be inside your <code>&lt;f:view&gt;</code>. Then I add the code provided by BalusC to my command button element but substitute a string from my resource bundle for the 'Are you sure?' text, like this:</p>
  
  <pre><code>&lt;h:commandButton 
      id="commandButtonAcceptDraft"
      title="#{bundle.tooltipAcceptDraft}" 
      action="#{controller.actionReplaceCurrentReportWithDraft}" 
      image="/images/checkmark.gif"
      onclick="return confirm('#{bundle.confirmationTextAcceptDraft}')"&gt;
  &lt;/h:commandButton&gt;
  </code></pre>
  
  <p>The line in my English resource file (just a plain text file with key/value pairs) looks like this:</p>
  
  <pre><code># text displayed in user prompt when calling confirm()
  confirmationTextAcceptDraft=This will overwrite the current report and cannot be undone. Are you sure?
  </code></pre>