SweetAlert2 Update-Zähler für Benutzer-Feedback

Question

Gibt es eine Möglichkeit, den Text auf SweetAlert2 Warnung zu aktualisieren, um die Anzahl der Zeilen anzuzeigen, die in einer wirklich langen Javascript-Schleife verarbeitet wurden? Leider haben Leute die Seite verlassen und dann werden nur die Hälfte der Zeilen gespeichert.

Ich dachte, ich könnte in der Lage sein, jQuery Typ Syntax zu verwenden, aber nicht sicher, was die richtige Auswahl sein könnte.

$ ('# rowsprocessed'). Text (Anzahl);

swal({ 
    title: 'Save Order.', 
    input: 'checkbox',      
    inputValue: 0, 
    inputPlaceholder: 'Remove Zero(s) Quantity Item(s) Before Saving the Order?', 
    html: 'For large templates this may take a few moments. This message will automatically close when the process is complete.', 
    type: 'info', 
    showCancelButton: true, 
    confirmButtonText: 'Submit', 
    showLoaderOnConfirm: true, 
    preConfirm: function(checkbox) { 
     return new Promise(function(resolve, reject) { 
      removeZeros = checkbox; 

      setTimeout(function() { 
       swal.showLoading(); 
       $.post("/components/com_sails/views/neworderform/saveOrderHeader.php", 
         { 
          orderid: orderid, 
          accountid: accountid, 
          buyerid: buyerid, 
          vendorid: vendorid, 
          ponumber: ponumber, 
          specialinstr: specialinstr, 
          orderDate: orderDate, 
          shipDate: shipDate, 
          cancelDate: cancelDate 
         }, 
         function (result) { 
          if (result.return == 1) {       
           // assign order id to holder field 
           $('#orderInput').jqxInput('val', result.ordernbr); 

           // loop through our rows and save depending on the removeZero marker 
           var rows = $('#jqxgrid').jqxGrid('getdisplayrows'); 
           var rowsToRemove = []; 
           var linessaved = 0; 


           for (var i = 0; i < rows.length; i++) { 
            var row = rows[i]; 

            // get row info for delete 
            if ((removeZeros == 1) && row['quantity'] == 0) { 
             rowsToRemove.push(row.uid); 
            } 

            // run database update 
            $.ajax({ 
             type: 'POST', 
             url: '/components/com_sails/views/neworderform/saveOrderLine.php', 
            data: { 
             orderid: result.ordernbr, 
             removezeros: removeZeros, 
             rowdata: row 
            }, 
            success: function (rowSaveData) { 
             // alert('rowSaveData ' + rowSaveData.return + " " + rowSaveData.isbn + " " + rowSaveData.action + " " + rowSaveData.msg + " row.uid: " + row.uid);  
             // if there is a problem what do we do???? 

             if (rowSaveData.return == 1) {               
              $('#rowsprocessed').text(i); 

             } 
             if (rowSaveData.return == -1) { 
              // add to error message? 
             } 

            }, 
            datatype: 'json', 
            async: false}); 

           } 

           if (removeZeros == 1) { 
            // delete our zero rows 
            var commit = $("#jqxgrid").jqxGrid('deleterow', rowsToRemove); 
            $('#jqxgrid').jqxGrid('render'); 
            lastselectedrow = -1; 

           } 

           // set save marker?? 
           isDirty = false; 

          } 
          else { 
           // there was an error saving the header 
           // need to get this logged 
           alert('Error Saving Order. Details: ' + result.msg); 
          } 

         }, "json"); 

       resolve(); 

      }, 2000); 
     }); 
    }, 
    allowOutsideClick: false 
}).then(function() { 
    swal({ 
     type: 'success', 
     title: 'Order saved', 
     html: '<b><div id="rowsprocessed">0</div></b> rows saved.', 
     timer: 4000 
    }); 
}) 

Answer 1

Absolut Sie können, Sie passieren nur in einem zusätzlichen Element mit Ihrem {html: "..."}, die Sie als ein Mittel zur Aktualisierung der Benutzer verwenden können. Wie

Etwas:

{ 
    ... 
    html: 'For large templates this may take a few moments. This message will automatically close when the process is complete.<br/><span class="swal2- status"></span>', 
    ... 
} 

Und dann diese Syntax verwenden zu aktualisieren:

var $status = $('.swal2-status'); 
$status.html("I'm an update"); 

das Beispiel Siehe hier: https://jsfiddle.net/1mvnxp3L/