JSF - Как реализовать JavaScript "Вы уверены?" введите <h: commandButton>

В моем веб-приложении JSF 1.2 у меня есть страница с <h:commandButton>, которая вызывает метод действия на основе bean. Это действие приведет к удалению/замене данных в базе данных, поэтому я хочу избежать ситуаций, когда пользователь случайно нажимает на командную кнопку.

Я хотел бы реализовать простой "Ты уверен?" введите "Да/Нет" или "ОК/Отмена" с помощью JavaScript. Я не очень разбираюсь в JavaScript, и я никогда раньше не смешивал JavaScript с JSF. Может ли кто-нибудь предоставить фрагмент кода, чтобы показать мне, как это реализовать?

Вот часть моей страницы JSP, где я объявляю кнопку команды:

<h:commandButton 
    id="commandButtonAcceptDraft"
    title="#{bundle.tooltipAcceptDraft}" 
    action="#{controller.actionReplaceCurrentReportWithDraft}" 
    image="/images/checkmark.gif">
</h:commandButton>

РЕШЕНИЕ:

Решение, предоставленное BalusC, отлично справилось. Я хотел бы также упомянуть, что в качестве текста приглашения легко использовать текст из комплекта ресурсов. На моей странице я загружаю ресурсный пакет таким элементом:

<f:loadBundle basename="com.jimtough.resource.LocalizationResources" var="bundle" />

<f:loadBundle> должен находиться внутри вашего <f:view>. Затем я добавляю код, предоставленный BalusC, к элементу кнопки команды, но заменяю строку из моего ресурсного пакета для "Вы уверены?". текст, например:

<h:commandButton 
    id="commandButtonAcceptDraft"
    title="#{bundle.tooltipAcceptDraft}" 
    action="#{controller.actionReplaceCurrentReportWithDraft}" 
    image="/images/checkmark.gif"
    onclick="return confirm('#{bundle.confirmationTextAcceptDraft}')">
</h:commandButton>

Строка в моем файле ресурсов на английском языке (просто текстовый файл с парами ключ/значение) выглядит следующим образом:

# text displayed in user prompt when calling confirm()
confirmationTextAcceptDraft=This will overwrite the current report and cannot be undone. Are you sure?

Ответы

Ответ 1

Используйте функцию JavaScript confirm(). Он возвращает значение boolean. Если он возвращает false, действие кнопки по умолчанию будет заблокировано, иначе оно будет продолжено.

<h:commandButton onclick="return confirm('Are you sure?')" />

Поскольку он уже возвращает boolean, нет необходимости обертывать его в if a, предложенном другими ответами.

Ответ 2

Вы можете добавить javascript в onclick кнопки.

<h:commandButton  
    id="commandButtonAcceptDraft" 
    title="#{bundle.tooltipAcceptDraft}"  
    action="#{controller.actionReplaceCurrentReportWithDraft}"  
    onclick="return confirm('Are you sure?')"
    image="/images/checkmark.gif"> 
</h:commandButton>

Ответ 3

Это должно сработать. В идеале это должно быть в файле java script.

<h:commandButton 
    id="commandButtonAcceptDraft"
    title="#{bundle.tooltipAcceptDraft}" 
    action="#{controller.actionReplaceCurrentReportWithDraft}" 
    image="/images/checkmark.gif"
     onclick="if (!confirm('Are you sure?')) return false">
</h:commandButton>

Ответ 4

Я не уверен, какое событие вам придется слушать (onclick, я бы предположил), поскольку я никогда не использовал JSF. В общем, это должно сработать.

var element = document.getElementById('commandButtonAcceptDraft');

element.onclick = function(e){
  return confirm('Are you sure etc...');
};