Показать подтверждение / диалоговое окно и отправить запрос POST в этом диалоговом окне, только если пользователь выбрал переключатель c - PullRequest
1 голос
/ 07 января 2020

Мне нужно показать подтверждение / диалоговое окно и отправить запрос POST из диалогового окна , только если пользователь выбрал радиокнопку среди других радиокнопок со значением «ожидание». Во всех остальных случаях не нужно отображать подтверждение / диалог, а запрос POST должен запускаться непосредственно из элемента #save.

Вот элемент формы в моем JSP:

<form:form id="saveform" modelAttribute="form" action="#">
<div class="row form-group radio">
    <label class="col-xs-12 control-label text-right">
        <spring:message code="indicatorX"/> :
    </label>
    <div class="col-xs-12">
        <div class="has-error">
            <form:errors path="indicatorX" cssClass="help-block error" />
        </div>
        <label class="radio-inline radio-inline-espace">
            <form:radiobutton path="indicatorX" value="true" class="js-close" data-collapse="divX"/>
            <spring:message code="yes"/>
        </label>
        <label class="radio-inline radio-inline-espace">
            <form:radiobutton path="indicatorX" value="false" class="js-open" data-collapse="divX"/>
            <spring:message code="no"/>
        </label>
        <label class="radio-inline radio-inline-espace">
            <form:radiobutton path="indicatorX" value="waiting" class="js-close" data-collapse="divX"/>
            <spring:message code="Not responded"/>
        </label>
    </div>
</div>
<div class="row form-group radio">
    <label class="col-xs-12 control-label text-right">
        <spring:message code="indicatorY"/> :
    </label>
    <div class="col-xs-12">
        <div class="has-error">
            <form:errors path="indicatorX" cssClass="help-block error" />
        </div>
        <label class="radio-inline radio-inline-espace">
            <form:radiobutton path="indicatorY" value="true" class="js-close" data-collapse="divY"/>
            <spring:message code="yes"/>
        </label>
        <label class="radio-inline radio-inline-espace">
            <form:radiobutton path="indicatorY" value="false" class="js-open" data-collapse="divY"/>
            <spring:message code="no"/>
        </label>
        <label class="radio-inline radio-inline-espace">
            <form:radiobutton path="indicatorY" value="waiting" class="js-close" data-collapse="divY"/>
            <spring:message code="Not responded"/>
        </label>
    </div>
</div>
<a id="save" class="btn btn-primary" href="#modalConfirmation" data-toggle="modal" data-backdrop="static">
    <spring:message code="saveRecord" />
</a>
<!--  Modal element to confirm if user want to save -->
<div id="modalConfirmation" class="modal" tabindex="-1" role="dialog" data-backdrop="static" data-keyboard="false" data-show="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header"></div>
            <div class="modal-body">
                <spring:message code="MSG-XXX"/>
            </div>
            <div class="modal-footer">
                <button id="confirmYes" class="btn btn-default" data-dismiss="modal">
                    <spring:message code="no"/>
                </button>
                <button id="confirmYes" class="btn btn-primary" data-dismiss="modal">
                    <spring:message code="yes"/>
                </button>
            </div>
        </div>
    </div>
</div>

Конечная точка POST в моем контроллере

    @RequestMapping(value = "/save", method = RequestMethod.POST)
public String save(@ModelAttribute FormObject form,
    BindingResult validation, RedirectAttributes redirectAttributes, ModelMap model) {
    LOG.info("webapp: method = save");

    //validation logic
    //service logic
    return ...;
}

Пожалуйста, имейте в виду, что я беру на себя проект, поэтому не проектировал архитектуру, и в настоящее время мне приходится иметь дело с некоторыми особыми случаями, поскольку вы можете видеть, что кнопка определена как элемент привязки ( с сохранением идентификатора).

Результаты, достигнутые к настоящему моменту при попытке выполнить несколько примеров:

A) Кнопка сохранения вызовет запрос POST и покажет диалоговое окно (пока не должно) без ожидания для подтверждения пользователя

ИЛИ

B) Если какая-либо из радиопереключателей имеет выбранное значение "ожидание", запрос запускается, но не достигает сервера.

Я имел С трудом подумать, как мне этого добиться, я видел много примеров в стеке, таких как пример диалогового окна ajax о том, как отправлять сообщения из диалогового окна, но я думаю, что в моем случае мне понадобятся логи проверки c перед отправкой синхронный звонок? (AJAX)

Вот мой JS код с несколькими простыми логами c, чтобы проверить, имеет ли радио кнопка «ожидающее» значение.

    var selectedValOne = $("[name='indicatorX']:checked").val();
    var selectedValTwo = $("[name='indicatorY']:checked").val();

    $('document').on(
      "click",
      "#save",
      function() {

        if (selectedValOne === 'waiting' || selectedValTwo === 'waiting') {
          $("#modalConfirmation").modal("show");

          $('#confirmYes').on('click', function() {
            showProgressbar();
            $("#saveform").attr(
              'action',
              PATH_CONTEXT +
              '/savingcontext/save');
            $("#saveform").submit();

          });

        } else {

          showProgressbar();
          $("#saveform").attr(
            'action',
            PATH_CONTEXT +
            '/savingcontext/save');
          $("#saveform").submit();

        }
      });

1 Ответ

0 голосов
/ 09 января 2020

Кнопка теперь вызывает и вызывает модальный режим и запускает запрос на отправку от кнопки «да». Мне пришлось изменить вызов jquery на $ ('document'). On ("click", "#save", function () {});

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...