add error description to modals

This commit is contained in:
Evgenii Alekseev 2021-09-11 23:05:51 +03:00
parent 5bb244cbe8
commit 88c8c929dc
2 changed files with 29 additions and 14 deletions

View File

@ -31,6 +31,7 @@
</div> </div>
<div class="modal-body"> <div class="modal-body">
<p>Packages update has failed.</p> <p>Packages update has failed.</p>
<p id="errorDetails"></p>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-primary" data-bs-dismiss="modal">Close</button> <button type="button" class="btn btn-primary" data-bs-dismiss="modal">Close</button>
@ -48,6 +49,7 @@
</div> </div>
<div class="modal-body"> <div class="modal-body">
<p>Packages update has been run.</p> <p>Packages update has been run.</p>
<ul id="successDetails"></ul>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-primary" data-bs-dismiss="modal">Close</button> <button type="button" class="btn btn-primary" data-bs-dismiss="modal">Close</button>

View File

@ -1,22 +1,24 @@
<script> <script>
const $remove = $("#remove") const $remove = $("#remove");
const $update = $("#update") const $update = $("#update");
const $table = $("#packages") const $table = $("#packages");
$table.on("check.bs.table uncheck.bs.table check-all.bs.table uncheck-all.bs.table", $table.on("check.bs.table uncheck.bs.table check-all.bs.table uncheck-all.bs.table",
function () { function () {
$remove.prop("disabled", !$table.bootstrapTable("getSelections").length) $remove.prop("disabled", !$table.bootstrapTable("getSelections").length);
$update.prop("disabled", !$table.bootstrapTable("getSelections").length) $update.prop("disabled", !$table.bootstrapTable("getSelections").length);
}) })
const $successForm = $("#successForm") const $successForm = $("#successForm");
$successForm.on("hidden.bs.modal", function() { window.location.reload(); }) const $successDetails = $("#successDetails");
$successForm.on("hidden.bs.modal", function() { window.location.reload(); });
const $failedForm = $("#failedForm") const $failedForm = $("#failedForm");
$failedForm.on("hidden.bs.modal", function() { window.location.reload(); }) const $errorDetails = $("#errorDetails");
$failedForm.on("hidden.bs.modal", function() { window.location.reload(); });
const $package = $("#package") const $package = $("#package");
const $knownPackages = $("#knownPackages") const $knownPackages = $("#knownPackages");
$package.keyup(function () { $package.keyup(function () {
const $this = $(this); const $this = $(this);
clearTimeout($this.data("timeout")); clearTimeout($this.data("timeout"));
@ -36,7 +38,7 @@
return $option; return $option;
}); });
$knownPackages.empty().append($options); $knownPackages.empty().append($options);
$this.focus() $this.focus();
}, },
}) })
}, this), 500)); }, this), 500));
@ -50,8 +52,19 @@
data: JSON.stringify({packages: $packages}), data: JSON.stringify({packages: $packages}),
type: "POST", type: "POST",
contentType: "application/json", contentType: "application/json",
success: function (_) { $successForm.modal("show"); }, success: function (_) {
error: function (_) { $failedForm.modal("show"); }, const $details = $packages.map(function (pkg) {
const $li = document.createElement("li");
$li.innerText = pkg;
return $li;
});
$successDetails.empty().append($details);
$successForm.modal("show");
},
error: function (jqXHR, textStatus, errorThrown) {
$errorDetails.text(errorThrown);
$failedForm.modal("show");
},
}) })
} }