Как открыть (открыть) бутстрап модальный на успех AJAX - PullRequest
Новая
       15

Как открыть (открыть) бутстрап модальный на успех AJAX

0 голосов
/ 12 апреля 2019

У меня есть страница JSP, скажем, xyz.jsp.У меня есть кнопка под названием «Отправить почту», у которой свойство onclick () установлено для функции сценария sendMail ().Отправка почты включает отправку html-данных на контроллер для генерации PDF, для которого я использую Ajax.Теперь, после того как письмо успешно отправлено, я хочу показать всплывающее окно с указанием успеха.Итак, в случае успеха Ajax я хочу вызвать всплывающее окно.

Я использую модальное загрузочное устройство для всплывающего окна.

Это мой код для кнопки и модального режима: 

    <div id="reportbuttons">
                <button type="button" class="btn bg-red waves-effect" onclick="convertToPdf()"  style="margin-right: 5px;float: right; margin-top: -8px">Download</button>  
                 <button type="button"  class="btn bg-red waves-effect"  onclick="sendMail()"  style="margin-right: 5px;float: right; margin-top: -8px">Send Mail</button> 
     <!-- Modal -->
      <div class="modal fade" id="myModal" role="dialog">
        <div class="modal-dialog">

          <!-- Modal content-->
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data- 
   dismiss="modal">&times;</button>
              <h4 class="modal-title">Modal Header</h4>
            </div>
            <div class="modal-body">
              <p>Some text in the modal.</p>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default" data 
    dismiss="modal">Close</button>
            </div>
          </div>

        </div>
      </div>
</div>

И, это мой сценарий: 

<script>
function sendMail() {
        let doc = new jsPDF('p','pt','a4');
        doc.setProperties({
            title: 'PDF Document',
            subject: 'subject',
            author: 'ABC',
            keywords: 'generated, javascript, web 2.0, ajax',
            creator: 'XYZ'
        });
        //document.getElementById('reportbuttons').remove();
        document.getElementById('reportbuttons').style.display ="none";
        doc.addHTML(document.body, function() {
    var data = doc.output('datauristring');
                  var reqJson = {};
                     reqJson.machineId = "<%=machineId%>";
                     reqJson.monthYear = "<%=monthYear%>";

                     reqJson.data = data;
                     $.ajax(
                     {
                         url : "sendMail/",
                         type: "POST",
                         dataType: 'json',
                         data : JSON.stringify(reqJson),
                         contentType: "application/json",
                         success:function(data)
                         {
                              $("#myModal").modal();  
                             alert('mail sent successfully');

                             document.getElementById('reportbuttons').style.display ="block";



                         }, 
                         error: function(data)
                         {
                             document.getElementById('reportbuttons').style.display ="block";

                         }
                       });
        });


    }
    </script>

Я хочу показать модальное всплывающее окно начальной загрузки после успешной отправки почты или, другими словами, об успехе Ajax.

...